Onchange doesn't work

Question

Hi guys I know onchange doesn't fire if you fill at textbox programmatically buy how can I make it do this.

I have two textboxes which are readonly and when you click the a date picker shows up.

I have startdate and enddate as my textboxes.

I want the startdate value to be copied in the enddate value when the startdate value has changed.

Thank you guys for the help also I am new to javascript and JQuery

my code

I used this code just to see if i could make hi to popup when i changed the value

<script>
function fireEvent(element,event){
    if (document.createEventObject){
        // dispatch for IE
        var evt = document.createEventObject();
        return element.fireEvent('on'+event,evt)
    }
    else{
        // dispatch for firefox + others
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent(event, true, true ); // event type,bubbling,cancelable
        return !element.dispatchEvent(evt);
    }
}
</script>

<td width="228" align="left" valign="top" bgcolor="#D8ABAD">From:

    <label for="input1"></label>
    <input type="text" name="startdate" id="startdate" required="required" value="04/12/2014"/>
    <script>
        obj = document.getElementById("startdate");
        Event.observe(obj,'change',function(){alert('hi');});
        fireEvent(obj,'change');
    </script>
</td>
<td width="23" align="center" valign="top" bgcolor="#D8ABAD">To:</td>
<td width="267" align="left" valign="top" bgcolor="#D8ABAD">
    <label for="enddate"></label>
    <input type="text" name="enddate" id="enddate" required="required" value="04/12/2014"/>
</td>

Answer 1

The onchange event only fires if the user changes the value of the input. It isn't supposed to fire if the input is changed programmaticly.

Call the function from whatever function sets the value instead.

Answer 2

Try using addEventListener() instead Event.observe() and also your fireEvent function is not defined as function, because you dont put function word in front of your function.

The javascript should be like this

function fireEvent(element,event) { 
    if (document.createEventObject) { // dispatch for IE 
        var evt = document.createEventObject(); 
        return element.fireEvent('on'+event,evt);
    } else { // dispatch for firefox + others 
        var evt = document.createEvent("HTMLEvents"); 
        evt.initEvent(event, true, true ); // event type,bubbling,cancelable 
        return !element.dispatchEvent(evt); 
    } 
}

obj = document.getElementById("startdate");
obj.addEventListener('change',function(){alert('hi');}, false);
fireEvent(obj,'change');

Fiddle: http://jsfiddle.net/XB3RK/