preeth
preeth

Reputation: 365

how to set datepicker when clicked on both textbox and calendar button?

hi i have two text boxes and two calendar buttons beside them,,when you press on calendar button then it popup a calendar then the selected date will come into text box but now my requirement is even when press in text box also the calander popup should come and as well as it also should come when clicked on calendar button. here my code goes...please cdan any one help me how to modify my code to achieve my requirement as i said.....

<script>
$(function() {
 $( "#datepicker1" ).datepicker({
dateFormat: "dd/mm/yy" ,
 showOn: "button",
 buttonImage: "images/cal.gif",
 buttonImageOnly: true
 });
 });
$(function() {
$( "#datepicker2" ).datepicker({
    dateFormat: "dd/mm/yy" ,
showOn: "button",
buttonImage: "images/cal.gif",
buttonImageOnly: true
});
});
  </script>
<body>
<tr>
<td>Memo Start Date :</td>
<td><form:input name="dateOfBirth" id="datepicker1" path="memoStartDate" /> 
    </td>
 </tr>
   <tr>
    <td>Memo End Date :</td>
<td><form:input id="datepicker2"  path="memoEndDate" /> </td>
    </tr>           
       <tr>

Upvotes: 3

Views: 4902

Answers (3)

Shivank
Shivank

Reputation: 1

you can do showOn: "button" to showOn: "both" then calendar open on click on button and textbox both.

 <script>
    $(function () {
      $("#datepicker2").datepicker({
    dateFormat: "dd/mm/yy",
    showOn: "button",
    buttonImage: "images/cal.gif",
    buttonImageOnly: true,
    showOn: "both"
      });
   });
</script>

Upvotes: 0

Rahul rajoria
Rahul rajoria

Reputation: 129

<script>    
 $(function()     {
    $( "#datepicker" ).datepicker();    
 });    
 $(function()     {    
    $( "#datepicker1" ).datepicker({    
    changeMonth: true,    
    changeYear: true    
 });           

</script>   
<input  type="text" name="date"  id="datepicker"   />
<input type="text" name="edate"  id="datepicker1"/>

Upvotes: 0

Arun P Johny
Arun P Johny

Reputation: 388316

Use showOn: "both" option to set it

$(function () {
    $("#datepicker1").datepicker({
        dateFormat: "dd/mm/yy",
        showOn: "button",
        buttonImage: "images/cal.gif",
        buttonImageOnly: true,
        showOn: "both"
    });
});
$(function () {
    $("#datepicker2").datepicker({
        dateFormat: "dd/mm/yy",
        showOn: "button",
        buttonImage: "images/cal.gif",
        buttonImageOnly: true,
        showOn: "both"
    });
});

Demo: Fiddle

Upvotes: 6

Related Questions