onchange

[hongho2]

I have two text boxes with diffrent datepicker.
Txt1: default to the current date. (Required)
Txt2: user can pick the date from the picker calendar.
I want the date in txt1 change to the same date from txt2 when user picks the date from the picker.

How can i accomplish that? Thank you very much.

Thanks

[p.phresh]

HTML portion:

<input id="txt1" />
<input id="txt2" onblur="checkValue(this);" />

Javascript Portion:

<script>
function checkValue (el){
     if (el.value != ""){
          document.getElementById("txt1").value = el.value;
     }
}
</script>

[hongho2]

i've tried your code but it didn't work, any other sugesstions?
<script>
function checkValue (el){
if (el.value != ""){
document.getElementById("txt1").value = el.value;
}
}
</script>
<cfform>
<cfinput type="datefield" name="txt1" id="txt1" value="" size="12" required="no">
<cfinput type="datefield" onblur="checkValue(this);" name="txt2" id="txt2" value="" size="12" required="no">

</cfform>

[p.phresh]

Works here:
http://jsfiddle.net/pphresh/AQ3MJ/1/


the change will occur when you click off the input field. You can also try switching onblur with onchange. It may suit your needs better. try them both.

[hongho2]

already tried but didn't work

<script>
function checkValue (el){
if (el.value != ""){
document.getElementById("txt1").value = el.value;
}
}
</script>
<cfform action="" method="post">
<cfinput type="datefield" name="txt1" id="txt1" value="" size="12" required="no">
<cfinput type="datefield" onchange="checkValue(this);" name="txt2" id="txt2" value="" size="12" required="no">
</cfform>

[p.phresh]

you're using cold fusion? I'm not sure if these javascripts work in cold fusion. Can you try in regular HTML first to see if it works for you?

Also try closing the input element <cfinput ... />