I'm cleaning up a simple form that has a Start Date textbox and an End Date textbox. I want to add a checkbox in between these fields that the user can check if the End Date is the same as the Start Date, so when they check it, the Start Date input value (e.g., 04/01/09) will automagically appear in the End Date textbox, so they don't have to type in the same date twice. Does that make sense?
BTW, I'm using the sexy jquery datepicker UI, and it's sweet, but I just can't figure out the above problem.
I know there's a simple solution (event handler?) but I'm stumped.
I'm cleaning up a simple form that has a Start Date textbox and an End Date textbox. I want to add a checkbox in between these fields that the user can check if the End Date is the same as the Start Date, so when they check it, the Start Date input value (e.g., 04/01/09) will automagically appear in the End Date textbox, so they don't have to type in the same date twice. Does that make sense?
BTW, I'm using the sexy jquery datepicker UI, and it's sweet, but I just can't figure out the above problem.
I know there's a simple solution (event handler?) but I'm stumped.
Share Improve this question edited Apr 23, 2009 at 23:59 GEOCHET 21.3k15 gold badges77 silver badges99 bronze badges asked Apr 1, 2009 at 16:40 JesseJesse 3093 gold badges7 silver badges14 bronze badges2 Answers
Reset to default 13Try this code:
$("#checkboxId").click(copyDate);
function copyDate()
{
var start=$("#startDate").val();
if (this.checked==true)
$("#endDate").val(start);
}
Replace the 'id's with your own field ids.
Simple hack to solve your problem.
<html>
<head>
<script src="js/jquery.js" ></script>
</head>
<body>
<form>
<input type="text" name="startdate" id="startdate" value=""/>
<input type="text" name="enddate" id="enddate" value=""/>
<input type="checkbox" name="checker" id="checker" />
</form>
<script>
$(document).ready(function(){
$("input#checker").bind("click",function(o){
if($("input#checker:checked").length){
$("#enddate").val($("#startdate").val());
}else{
$("#enddate").val("");
}
});
}
);
</script>
</body>
</html>