Automatically Submitting a form using PHP and Javascript

Hi I have a form that, once submitted, cookies the users machine with an ident, that can be used to retrieve the user's data from the DB.  When the user hits the form for a second time, I am populating the form with the user's data and I want to automatically submit the form (this gives us seperate DB records for each submission, which is required).  However, the form isn't submitting!

I'm using javscript to submit the form, but I get the following error:

Error: document.getElementById("download_form").submit is not a function

      <script type="text/javascript">
      function autoSubmit()
      {
            document.getElementById("download_form").submit();
      }
      <?php
            if ($dataReady) // flag for retrieved data
            {
                  echo 'addLoadEvent(autoSubmit);';
            }
      ?>
      </script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Gartner White Paper Key Issues for Multienterprise B2B Integration, 2008 |</title>
<script src="/assets/js/swfobject.js" type="text/javascript"></script>
<script src="/assets/js/lp.js" type="text/javascript"></script>
<link href="s/base.css" type="text/css" rel="stylesheet" />
<!--[if !IE]>-->
<style type="text/css">
body {
  font-size:16px;
}
</style>
<!--<![endif]-->
</head>
<body class="inside uk">
 
	<div id="container">
		<div id="logo"><img src="/assets/i/logo_sci_bwb.gif" width="454" height="82" alt="Sterling Commerce &ndash; an AT&amp;T Company" /></div>
		<div id="topCap"><img src="i/pageframe_topcap.png" width="335" height="31" alt="" /></div>
		<div id="mainHolder">
			<div id="right"><div class="rightbluemod" >
				<p>Just one step is required before you can download:</p>
				<p><strong class="blue">Gartner White Paper<br />Key Issues for Multienterprise B2B Integration, 2008</strong></p>
 
				<p>Please complete the following form:</p>
				<form name="download_form" id="download_form" action="#" method="post" onsubmit="addgoal()">
<p id="privacy">All information is protected by our <a href="http://www.sterlingcommerce.co.uk/about/Privacy_Policy" target="_blank">privacy policy</a>.</p><table width="275" cellspacing="5" cellpadding="0">
	<tr>
    	<td valign="top"><input type="text" name="first_name" id="first_name" value="Chris" class="textbox" onfocus="if(first_name.value=='First Name') {first_name.value=''};" onblur="if(first_name.value == '') {first_name.value='First Name'};" /></td>
        <td valign="top"><input type="text" name="last_name" id="last_name" value="Recknell" class="textbox" onfocus="if(last_name.value=='Last Name') {last_name.value=''};" onblur="if(last_name.value == '') {last_name.value='Last Name'};" /></td>
    </tr>
 
    <tr>
        <td valign="top"><input type="text" name="job_title" id="job_title" value="Test" class="textbox" onfocus="if(job_title.value=='Role in Organisation') {job_title.value=''};" onblur="if(job_title.value == '') {job_title.value='Role in Organisation'};" /></td>
        <td valign="top"><input type="text" name="company_name" id="company_name" value="Test" class="textbox" onfocus="if(company_name.value=='Organisation') {company_name.value=''};" onblur="if(company_name.value == '') {company_name.value='Organisation'};" /></td>
    </tr>
    <tr>
        <td colspan="2"><input type="text" name="address1" id="address1" value="Test" class="textbox" style="width:260px" onfocus="if(address1.value=='Address Line 1') {address1.value=''};" onblur="if(address1.value == '') {address1.value='Address Line 1'};" /></td>
    </tr>
    <tr>
        <td colspan="2"><input type="text" name="address2" id="address2" value="Test" class="textbox" style="width:260px" onfocus="if(address2.value=='Address Line 2') {address2.value=''};" onblur="if(address2.value == '') {address2.value='Address Line 2'};" /></td>
 
    </tr>
    <tr>
        <td valign="top"><input type="text" name="city" id="city" value="Test" class="textbox" onfocus="if(city.value=='City') {city.value=''};" onblur="if(city.value == '') {city.value='City'};" /></td>
        <td valign="top" style="padding-top:2px"><select name="country" id="country" class="dropdownlist" style="color:DimGray; width:126px;">
    <option value="United States">United States</option>
    <option value="Albania">Albania</option>
    <option value="Algeria">Algeria</option>
 
    <option value="Angola">Angola</option>
    <option value="Australia">Australia</option>
    <option value="Austria">Austria</option>
    <option value="Bahrain">Bahrain</option>
    <option value="Bangladesh">Bangladesh</option>
    <option value="Barbados">Barbados</option>
 
    <option value="Belgium">Belgium</option>
    <option value="Bosnia">Bosnia</option>
    <option value="Botswana">Botswana</option>
    <option value="Brazil">Brazil</option>
    <option value="Canada">Canada</option>
    <option value="China">China</option>
 
    <option value="Congo">Congo</option>
    <option value="Croatia">Croatia</option>
    <option value="Czech Republic">Czech Republic</option>
    <option value="Denmark">Denmark</option>
    <option value="Egypt">Egypt</option>
    <option value="Eire">Eire</option>
 
    <option value="Estonia">Estonia</option>
    <option value="Finland">Finland</option>
    <option value="France">France</option>
    <option value="Germany">Germany</option>
    <option value="Greece">Greece</option>
    <option value="Hong Kong">Hong Kong</option>
 
    <option value="Hungary">Hungary</option>
    <option value="India">India</option>
    <option value="Indonesia">Indonesia</option>
    <option value="Ireland">Ireland</option>
    <option value="Israel">Israel</option>
    <option value="Italy">Italy</option>
 
    <option value="Japan">Japan</option>
    <option value="Korea">Korea</option>
    <option value="Kuwait">Kuwait</option>
    <option value="Latvia">Latvia</option>
    <option value="Lesotho">Lesotho</option>
    <option value="Lithuania">Lithuania</option>
 
    <option value="Luxembourg">Luxembourg</option>
    <option value="Macedonia">Macedonia</option>
    <option value="Malawi">Malawi</option>
    <option value="Malaysia">Malaysia</option>
    <option value="Mauritius">Mauritius</option>
    <option value="Mexico">Mexico</option>
 
    <option value="Morocco">Morocco</option>
    <option value="Mozambique">Mozambique</option>
    <option value="Namibia">Namibia</option>
    <option value="Netherlands">Netherlands</option>
    <option value="New Zealand">New Zealand</option>
    <option value="Nigeria">Nigeria</option>
 
    <option value="Norway">Norway</option>
    <option value="Pakistan">Pakistan</option>
    <option value="Philippines">Philippines</option>
    <option value="Poland">Poland</option>
    <option value="Portugal">Portugal</option>
    <option value="Qatar">Qatar</option>
 
    <option value="Romania">Romania</option>
    <option value="Russia">Russia</option>
    <option value="Saudi Arabia">Saudi Arabia</option>
    <option value="Serbia">Serbia</option>
    <option value="Seychelles">Seychelles</option>
    <option value="Singapore">Singapore</option>
 
    <option value="Slovakia">Slovakia</option>
    <option value="Slovenia">Slovenia</option>
    <option value="South Africa">South Africa</option>
    <option value="South Korea">South Korea</option>
    <option value="Spain">Spain</option>
    <option value="Swaziland">Swaziland</option>
 
    <option value="Sweden">Sweden</option>
    <option value="Switzerland">Switzerland</option>
    <option value="Taiwan">Taiwan</option>
    <option value="Tanzania">Tanzania</option>
    <option value="Thailand">Thailand</option>
    <option value="Tunisia">Tunisia</option>
 
    <option value="Turkey">Turkey</option>
    <option value="United Arab Emirates">United Arab Emirates</option>
    <option value="United Kingdom" selected>United Kingdom</option>
    <option value="Vietnam">Vietnam</option>
    <option value="Zimbabwe">Zimbabwe</option>
</select></td>
    </tr>
 
    <tr>
        <td valign="top"><input type="text" name="postal_code" id="postal_code" value="Test" class="textbox" onfocus="if(postal_code.value=='Post Code') {postal_code.value=''};" onblur="if(postal_code.value == '') {postal_code.value='Post Code'};" /></td>
       <td valign="top" id="statefield"><input type="text" name="state" id="state" value="Test" class="textbox" onfocus="if(state.value=='County/Region') {state.value=''};" onblur="if(state.value == '') {state.value='County/Region'};" /></td>
    </tr>
    <tr>
        <td colspan="2"><input type="text" name="email" id="email" value="chris_recknell@stercomm.com" class="textbox" style="width:260px" onfocus="if(email.value=='E-mail') {email.value=''};" onblur="if(email.value == '') {email.value='E-mail'};" /></td>
    </tr>
    <tr>
        <td valign="top"><input type="text" name="phone" id="phone" value="Test" class="textbox" onfocus="if(phone.value=='Telephone Number') {phone.value=''};" onblur="if(phone.value == '') {phone.value='Telephone Number'};" /></td>
 
       <td valign="top" style="padding-top:2px"><select name="company_size" class="dropdownlist" style="color:DimGray; width:126px;">
    <option >Company Size</option>
    <option value="under 50M">under $50M</option>
    <option value="50M-250M" selected>$50M - $250M</option>
    <option value="250M-500M">$250M - $500M</option>
    <option value="500M-1B">$500M - $1B</option>
 
    <option value="over 1B">over $1B</option>
</select></td>
    </tr>
    <tr>
        <td colspan="2">
            <table border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td valign="top"><input type="checkbox" name="promotion" id="promotion" value="I would like to receive offers and information from Sterling Commerce." /></td><td><label for="promotion">I would like to receive offers and information from Sterling Commerce.</label></td>
 
                </tr>
            </table></td>
    </tr>
    <tr>
        <td colspan="2" align="right"><input class="buttons" type="submit" name="submit" value="Download Now!" /></td>
    </tr>
</table>
</form>			</div></div>
			<div style="clear: both;"><img src="/assets/i/spacer.gif" width="1" height="1" alt="" /></div>
 
		</div>
		<div id="bodyBottom"><img src="i/pageframe_botcap.png" width="335" height="32" alt="" /></div>
	</div>
	<div id="loginFooter">&copy; 2008 Sterling Commerce. All Rights Reserved&nbsp;&nbsp;|&nbsp;&nbsp;<a href="http://www.sterlingcommerce.co.uk/about/Privacy_Policy" target="_blank" title="Privacy Policy">Privacy Policy</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="http://www.sterlingcommerce.co.uk/about/termsofuse" target="_blank" title="Terms of Use">Terms of Use</a></div>
	<script type="text/javascript">
	function autoSubmit()
	{
		document.getElementById("download_form").submit();
	}
	addLoadEvent(autoSubmit);	</script>
 
 
</body>
</html>

Open in new window

adhoweAsked:
Who is Participating?
 
fsze88Commented:
adhowe,
source of problem is naming of <input> -> name="submit".
when you fire document.getElementById("download_form").submit(); it is looking for <input> tag named submit

at line 175
<input class="buttons" type="submit" name="submit" value="Download Now!" />
try
<input class="buttons" type="submit" name="submitvalue" value="Download Now!" />
0
 
fsze88Commented:
try
document.forms["download_form"].submit();
0
 
bansidharCommented:
change

      <script type="text/javascript">
      function autoSubmit()
      {
            document.getElementById("download_form").submit();
      }
      addLoadEvent(autoSubmit);      </script>

To

      <script type="text/javascript">
            document.getElementById("download_form").submit();
      </script>
0
Cloud Class® Course: MCSA MCSE Windows Server 2012

This course teaches how to install and configure Windows Server 2012 R2.  It is the first step on your path to becoming a Microsoft Certified Solutions Expert (MCSE).

 
adhoweAuthor Commented:
Thanks for the suggestions... but:

fsze88:

<script type="text/javascript">
      function autoSubmit()
      {
            document.forms["download_form"].submit();
      }
      addLoadEvent(autoSubmit);      </script>

Yields : Error: document.forms.download_form.submit is not a function

      <script type="text/javascript">
            document.getElementById("download_form").submit();
      </script>

and I get: Error: document.getElementById("download_form").submit is not a function

This is mysterious...
0
 
sunithnairCommented:
Try document.forms[0].submit(); or document.download_form.submit();
0
 
adhoweAuthor Commented:
Thanks sunithnair, but I get:

Error: document.forms[0].submit is not a function

 and

Error: document.download_form.submit is not a function

respectively, its weird, because:

alert(document.download_form.first_name.value);

Does what you would expect....
0
 
bansidharCommented:
try a delay of about 5 secs before you submit the form
0
 
adhoweAuthor Commented:
Would never have spotted that, thank you...
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.