Can't access form element in IE because it 'is undefined'. Works ok in FF and Chrome

Question

It's strange because I only get 1 error in IE: 'sTime is undefined'. sTime is the ID of one of the many input elements in my form. Everything works fine in Chrome and FF. Here's a link to the code:

http://la.truxmap.com/sched.html

and the form html:

<form id="addNewTruck" class='updateschedule' action="javascript:sub(sTime.value, eTime.value, lat.value, lng.value, street.value);"> 

    <b style="color:green;">Opening at: </b> 
        <input id="sTime" name="sTime" title="Opening time" value="Click to set opening time" class="datetimepicker"/> 

    <b style="color:red;">Closing at: </b> 
        <input id="eTime" name= "eTime" title="Closing time" value="Click to set closing time" class="datetimepicker"/> 

    <b style="color:blue;">Address: </b> 
        <input type='text' name='street' id='street' class='text street' autocomplete='off'/> 
        <input id='submit' class='submit' style="cursor: pointer; cursor: hand;" type="submit" value='Add new stop'/> 
    <div id='suggests' class='auto_complete' style='display:none'></div> 
        <input type='hidden' name='lat' id='lat'/> 
        <input type='hidden' name='lng' id='lng'/> 
        <input type='hidden' value='CA' name='state' id='state' class='text state' /> 

Thanks for your help!

Answer 1

• Try putting the JavaScript into the onsubmit event rather than action

• Address the form elements less ambiguously in the JS, e.g. using this.elements.sTime. It could be that the element name is used elsewhere in the document.

Answer 2

Javascript in form's action should work well. Maybe you should use instead of sTime.value the following:

document.forms[0].sTime.value

Of course this means that this form is the first in your page (else you must change ...forms[0]... into ...forms['formname']... or ...forms[<form index>]...)