Vis priya Vis priya - 5 months ago 26
Javascript Question

How to open calendar with help of button in input field which has type="date"?

I have an

input field
with
type="date"
, and a
button
:

<input type="date" name="DateOfBirth"class="form-control" ng-model="patient.DateOfBirth" format="dd/mm/yyyy" required="true" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-disabled="patient.PatientId" ng-click="open()">
<i class="fa fa-calendar"></i>
</button>
</span>


So when I click the button, the calendar (date picker) should open. Is that possible?

Answer

Try this one(bootstrap date picker)

           <input ng-change="onDateSelector()" id="DateOfBirth"name="DateOfBirth" ng-disabled="patient.PatientId" ng-click="opened=!opened" type="text" placeholder="dd-MM-yyyy" max-date="{{maxDate}}" class="form-control" datepicker-popup="{{format}}" ng-model="patient.DateOfBirth" is-open="opened" min-date="minDate" required="true" close-text="Close" />

           <span class="input-group-btn">
                   <button type="button" class="btn btn-default"ng-click="open($event)"><i class="fa fa-calendar"></i></button>
           </span>