//#temptime is id of a text box to hold date $("#temptime").datepicker({ //picker is a button to fire date picker up. picker: "" });
.picker { height:16px; width:16px; background:url("/images/icons/cal.gif") no-repeat; margin-left:-19px; cursor:pointer; border:none; }
$("#datetime").datepicker({ picker: "Select", applyrule:rule }); $("#endtime").datepicker({ picker: "Select", applyrule: rule }); function rule(id) { //before start time picker drops down if (id == 'datetime') { var v = $("#endtime").val(); if (v == "") { return null; } else { //To get end time. All dates after end time will be disabled. var d = v.match(/^(\d{1,4})(-|\/|.)(\d{1,2})\2(\d{1,2})$/); if (d != null) { var nd = new Date(parseInt(d[1], 10), parseInt(d[3], 10) - 1, parseInt(d[4], 10)); return { enddate: nd }; } else { return null; } } } else { var v = $("#datetime").val(); if (v == "") { return null; } else { //To get start time. All dates before start time will be disabled. var d = v.match(/^(\d{1,4})(-|\/|.)(\d{1,2})\2(\d{1,2})$/); if (d != null) { var nd = new Date(parseInt(d[1], 10), parseInt(d[3], 10) - 1, parseInt(d[4], 10)); return { startdate: nd }; } else { return null; } } } }
$("#hdobj").datepicker({ picker: "#handler", //this should be a hidden onReturn:function(d){ alert(d.Format("M/d, yyyy")); $("#target").html(d.Format("M/d, yyyy")); } });