0

I have two elements on my form and one is input text date picker and second is input text. I want to copy the value from date picker field to second input text box after date changed. My current function will copy current value right when I click on the date picker but after I pick another date that won't affect another input field. What is the best option to approach this problem? Here is my example:

<td>
    <input type="text" name="addDate_dt" id="addDate_dt" maxlength="10" size="12" value="" readonly="readonly">
</td>

<td>
  <input type="text" name="st_begDt" id="st_begDt" maxlength="10" size="12" value="#Dateformat(st_begDt,'mm/dd/yyyy')#" readonly="readonly">
  <img src='calendar.gif' alt='Calendar' onclick="calendar(event,'o_begDt')";
onMouseup="copyBegDt()">
</td>

function copyBegDt(){
        var begDt = document.getElementById('st_begDt').value;

        if(begDt.trim() !== ''){
            document.getElementById('addDate_dt').value = begDt;
        }else{
            document.getElementById('addDate_dt').value = '';
        }
    }

Also I would like to populate the addDate_st field on page load as well. Side note, I don't want to modify my calendar function because it's used on the other pages in my app as well.

espresso_coffee
  • 5,076
  • 9
  • 53
  • 124
  • This is basically a duplicate of: http://stackoverflow.com/questions/39249781/how-to-detect-programmatic-value-change-on-input-field – mcgraphix Apr 12 '17 at 15:41

1 Answers1

1

If st_begDt is being updated correctly already what about just creating a change watch on that input?

var begDt = document.getElementById('st_begDt');
begDt.onchange = function() {
    //update other input here
};
Eric G
  • 2,487
  • 1
  • 12
  • 21
  • Do I have to call this function from somewhere or it should triggered every time begin date is changed? I have tried and doesn't work for me. – espresso_coffee Apr 12 '17 at 15:46
  • @espresso_coffee You need to put it in some sort of 'document.ready'' function so it will begin watching once the page is rendered. If you aren't using jquery then put it in something like this: http://stackoverflow.com/questions/799981/document-ready-equivalent-without-jquery – Eric G Apr 12 '17 at 15:48
  • @espresso_coffee did that solve your issue? Let me know if I can help further. – Eric G Apr 13 '17 at 14:37
  • I have approached with the different solution. My function that is set on date-picker was modified and I was able to pass my function. That solved the problem. Thanks for your help. – espresso_coffee Apr 13 '17 at 14:40