javascript - jQuery Keithwood calendar plugin -
i have click twice calendar. using keithwood plugin:http://keith-wood.name/calendars.html
my code:
<div class="control-group date"> <div class="day"> <input name="startday_2" placeholder="dd" type="text" id="startday_2" maxlength="2" readonly="readonly" /> </div> <div class="month"> <input name="startmonth_2" placeholder="mm" type="text" id="startmonth_2" maxlength="2" readonly="readonly" /> </div> <div class="year"> <input name="startyear_2" placeholder="yyyy" type="text" id="startyear_2" maxlength="4" readonly="readonly" /> </div> <input type="hidden" id="startdate_2" class="calpicker" /> <div class="date-tool" id="grestartid_2"> <a href="javascript:void(0)" id="startpopup_2"> <span id="img_2"><img onclick="javascript:setval(2)" src="/onlineappointmentsystembase-portlet/img/date-icon.jpg" alt="popup" class="trigger calendericon calendars-trigger"></span> </a> </div> </div> <script type="text/javascript"> function setval(values) { var finalval = '#startpopup_' + values; var imgn = 'img_' + values; document.getelementbyid(imgn).style.display = 'none'; $(finalval) .calendarspicker( { calendar : $.calendars.instance('gregorian'), showonfocus : false, showtrigger : '<img src="<c:url value="/img/date-icon.jpg"/>" alt="popup" class="trigger calendericon">', onselect : updateselected }); function updateselected(dates) { var selid = this.id; var ret = selid.split("_"); var str2 = ret[1]; var = '#startday_' + str2; var b = '#startmonth_' + str2; var c = '#startyear_' + str2; var days = dates[0].day(); if (days < 10) { days = '0' + days; } $(a).val(days); var months = dates[0].month(); if (months < 10) { months = '0' + months; } $(b).val(months); $(c).val(dates[0].year()); $('#enddate_2').val( $('#endyear_2').val() + "/" + $('#endmonth_2').val() + "/" + $('#endday_2').val()); } ; } </script> this code works, have click icon twice. there way preinitialize calendar or how make same work in single click.
first check string in showtrigger option, not formed.
you attaching calendar on click of element itself, work on second click because handler attached it.
to let work on first click can invoke show method:
$(selector).datepick('show') jquery object pop datepicker given field.
like:
$(finalval).calendarspicker('show'); code:
$(function () { $('.trigger calendericon calendars-trigger').calendarspicker(); }); function setval(values) { var finalval = '#startpopup_' + values; var imgn = 'img_' + values; document.getelementbyid(imgn).style.display = 'none'; $(finalval) .calendarspicker({ calendar: $.calendars.instance('gregorian'), showonfocus: false, showtrigger: '<img src="" alt="popup" class="trigger calendericon">', onselect: updateselected }); $(finalval).calendarspicker('show') function updateselected(dates) { var selid = this.id; var ret = selid.split("_"); var str2 = ret[1]; var = '#startday_' + str2; var b = '#startmonth_' + str2; var c = '#startyear_' + str2; var days = dates[0].day(); if (days < 10) { days = '0' + days; } $(a).val(days); var months = dates[0].month(); if (months < 10) { months = '0' + months; } $(b).val(months); $(c).val(dates[0].year()); $('#enddate_2').val( $('#endyear_2').val() + "/" + $('#endmonth_2').val() + "/" + $('#endday_2').val()); }; }
Comments
Post a Comment