My datepicker should work only on icon

2

I have the following code:

$(".datePicker").datepick();
$("#IconDate").on("click", function () {
    $("#Date").focus();
})

My Html:

<div class="float-left gutter-right field-wrap">
    <label for="admissionEndDate">Data Admissão Fim</label>
    <span class="input-type-text">
        <input type="text" id="Date" name="admissionEndDate" class="datePicker hasDatePick" />
        <a href="#" class="datePicker" title="Calendário" id="IconDate">
            <img src="~/Content/images/icons/fugue/calendar-month.png" width="16" height="16" />
        </a>
    </span>
</div>

You need to click on the icon that appears the data picker that is stylized, but when I click on the input it also appears. was not to appear in the click of the input.

    
asked by anonymous 26.09.2017 / 14:52

1 answer

2

This is because your datepicker is related to your input and also by clicking its icon. Then you will have to create a trigger in your icon/button , so only it will trigger your datepicker . Link to documentation at the end of the response. I hope this helps you.

To do the way you want it will look like this:

$( function() {
    $( "#datepicker" ).datepicker({
      showOn: "button",
      buttonImage: "~/Content/images/icons/fugue/calendar-month.png",
      buttonImageOnly: true,
      buttonText: "Select date"
    });
  } );

// acao do button

$("#myButton").click(function() {
  $("#datepicker").datepicker("show");
});

Link to related documentation

    
26.09.2017 / 17:07