I have a form with an input text field which imports data every couple of seconds and display it in the form field , let us say :

<input name="code" id="code" type="text" size="64" maxlength="128" />

and a submit button and my form has the formname form1. I want the submit button to be clicked as soon as the data in the form field is changed. I did try to do the following. In the header I did add the follwoing javascript:

<SCRIPT LANGUAGE="javascript">
function send_data()
{
document.form1.submit();
}
</SCRIPT>

and on the form :

<input name="code" id="code" type="text" size="64" maxlength="128" onchange="send_data();" />

but it didn`t work..

Any help ?

Thanks

I have a form with an input text field which imports data every couple of seconds and display it in the form field , let us say :

<input name="code" id="code" type="text" size="64" maxlength="128" />

and a submit button and my form has the formname form1. I want the submit button to be clicked as soon as the data in the form field is changed. I did try to do the following. In the header I did add the follwoing javascript:

<SCRIPT LANGUAGE="javascript">
function send_data()
{
document.form1.submit();
}
</SCRIPT>

and on the form :

<input name="code" id="code" type="text" size="64" maxlength="128" onchange="send_data();" />

but it didn`t work..

Any help ?

Thanks

• javascript
• html
• forms
• onchange

• 1 could you display the <form> tag. It needs to have the action attribute in order to have the .submit() to work. – David Laberge Commented Sep 15, 2011 at 12:15
• I already have an action but not the submit() , here <form name="form1" method="post" action="form_response.php"> .. Is there any turnaround for this ? – Momo Commented Sep 15, 2011 at 12:23
• Caveat: Avoid naming the submit button(or any other form element) name="submit" or the submit() will fail in some browsers. Call it name="btnSubmit" or something, anything but "submit". – Charlie Commented Sep 15, 2011 at 12:39
• 1 look at - stackoverflow./questions/3102889/javascript-autosubmit-form/… – T.Todua Commented Mar 26, 2013 at 9:50

1 Answer 1

Something like this would work:

<form action="#">
    <input type="" id="input" />
    <button type="submit"></button:>
</form>

<script>
function send_data() {
    document.forms[0].submit();
}

window.onload = function(){
    var input = document.getElementById('input');
    input.onchange = send_data;
}
</script>

But I'd add a few caveats:

1. I'm assuming there is only one form on the page. You would be safer assigning and ID to your form and using getElementById and referencing that instead of document.forms[x]
2. The change event will only happen after you lose focus on the input, which I probably what you want? Just making sure it's expected behavior
3. Without knowing why you need to do this, I'd note that it could potentially be very annoying to the user, as submission will trigger a new page load. You may be better off doing a submission via ajax so as not to disrupt the user's browsing. If you do this, I strongly remend a JS library to handle this.