Page 1 of 1
JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 2:12 am
by JAB Creations
In XHTML the name attribute is invalid on form elements yet I am unable to get getElementById to work with submit().
Code: Select all
document.getElementById('form_id').submit()
Suggestions?
Re: JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 2:33 am
by VladSun
There is nothing wrong with your JS code

Perhaps you call it before the form element is created or you have other elements with the same ID ...
Re: JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 3:15 am
by JAB Creations
Gah...this is retarded...if I try to use submit() it won't submit unless I access document.name but I can't use the name attribute on a form element because it's invalid.
I've also tried getting return false to work on the script on the submit button (using both onclick on the button itself and then moving the function to the onsubmit event) all without success.
There are no similar ids nor are any of the name attribute/value sets contain the same value.
So yeah...I'm still stuck on this. What do you suggest?
Re: JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 3:21 am
by VladSun
Post the
original HTML/javascript code

Re: JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 3:23 am
by JAB Creations
I tried the onsubmit function on the submit/input and the form...as well as calling the function on the submit/input via an onclick event.
Code: Select all
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head><title>John Bilicki</title><style type="text/css">#body {background-color: #09c; margin: 0px auto 0px auto; padding: 8px 0px 8px 0px; width: 80%;}#content {background-color: #cff; float: right; width: 80%;}#menu {background-color: #ffc; float: left; width: 20%;}body, html {background-color: #036; color: #000;}b.bad {color: #f00;}b.good {color: #0f0;}div.center {margin: 0px auto 0px auto; text-align: center;}form fieldset {background-color: #eee; border: #ddd solid 1px; margin: 4px 16px 4px 16px;}form input {background-color: #a7a68f; color: #000; border: #ebef92 solid 1px;}form input:hover, form input:focus {background-color: #000; color: #a7a68f;}form input.button {clear: left; display: block; float: left; margin: 4px;}form input.button:hover, form input.button:focus {color: #0f0; outline: #9cf dotted 6px;}form input.status_invalid {background-image: url(images/interface-icon-warning.gif); background-position: 204px 2px; background-repeat: no-repeat; border: #f00 solid 2px;}form input.status_valid {background-image: url(images/interface-icon-valid.gif); background-position: 202px 2px; background-repeat: no-repeat; border: #0f0 solid 2px;}form input.required {background-image: url(images/interface-icon-required.gif); background-position: 205px 1px; background-repeat: no-repeat;}form input.required:hover, form input.required:focus {background-image: url(images/interface-icon-required-h.gif);}form input.text {display: block; float: left; margin: 4px; width: 220px;}form input.text:hover, form input.text:focus {outline: #9cf dotted 6px;}form label {border: #ebef92 dotted 1px; clear: left; display: block; float: left; margin: 4px; padding: 0px 4px 0px 4px; width: 120px;}form label:hover {border: #ebef92 solid 1px;}form legend {background-color: #ddd; border: #ddd solid 1px; color: #000; padding: 0px 2px 0px 2px;}form textarea {border: #a7a68f solid 1px; clear: right; display: block; float: left; margin: 4px; width: 400px;}form textarea:hover, form textarea:focus {border: #00f solid 2px; clear: right; display: block; float: left; margin: 3px;}h1 {background-color: #004; color: #9cac53; margin: 16px 10% 16px 10%; padding-left: 4px;}h2 {color: #ebef92; width: 80%;}</style><script type="text/javascript">//<![CDATA[function warning_check(form_id){if (document.getElementById('warning1') || document.getElementById('warning2')) { var answer = confirm('continue?') if (answer) {alert('1 - yes?'); return true; } else {alert('2 - no?'); return true;} }} //]]></script></head> <body> <h1>Installation</h1> <div id="body"> <form action="install.php?step=3" method="post" onsubmit="warning_check('step_2');"><fieldset><legend>Step 2 - Connect to MySQL</legend> <p>You successfully connected to your server's database!</p><p><b class="bad" id="warning1">WARNING!</b> There are <b>1</b> row(s) of data in the table <em>public_accounts</em>!   If you continue to step 3 <em>the data will be lost</em>!</p><p>The table <em>admin_global</em> exists however it contains no data.</p></fieldset> <fieldset><legend>Step 2 - Create Tables</legend> <p>   </p> <input class="button" type="submit" value="Continue to Step 3" /></fieldset></form> </div><!-- /#body --> </body> </html>
Re: JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 3:31 am
by VladSun
I can't see a call to submit() ...
Re: JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 3:34 am
by JAB Creations
I originally had the submit button just be a regular button and attempted to use document.getElementById('form_id').submit() as I mentioned in my original post though pretty much using the confirm function as in the full file just above.
Re: JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 3:44 am
by VladSun
Jab ... You had to post the original code as described in the OP, instead you let me wonder what the problem
could be
Anyway
Code: Select all
<script type="text/javascript">//<![CDATA[function warning_check(form_id){ if (document.getElementById('warning1') || document.getElementById('warning2')) { var answer = confirm('continue?'); if (answer) { alert('1 - yes?'); document.getElementById('form_1').submit(); } else { alert('2 - no?'); document.getElementById('form_1').submit(); } }} //]]></script></head> <body> <h1>Installation</h1> <div id="body"> <form action="install.php?step=3" method="post" onsubmit="warning_check('step_2');" id="form_1"><fieldset><legend>Step 2 - Connect to MySQL</legend> <p>You successfully connected to your server's database!</p><p><b class="bad" id="warning1">WARNING!</b> There are <b>1</b> row(s) of data in the table <em>public_accounts</em>!   If you continue to step 3 <em>the data will be lost</em>!</p><p>The table <em>admin_global</em> exists however it contains no data.</p></fieldset> <fieldset><legend>Step 2 - Create Tables</legend> <p>   </p> <button onclick="warning_check()">OK<button/></fieldset></form> </div><!-- /#body --> </body> </html>
Re: JavaScript submit() without name attribute on form element?
Posted: Fri Jul 18, 2008 3:55 am
by JAB Creations
Gah I'm sorry about that, poor etiquette on my part.
However I was able to get this to work thanks to your help...though I'm not sure what is different from what I've tried but that doesn't matter.

Thank you for your help!
Code: Select all
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head><title>John Bilicki</title><link href="themes/style.css" media="screen" rel="stylesheet" title="Classic Theme" type="text/css" /><script type="text/javascript">//<![CDATA[function warning_check(form_id){ if (document.getElementById('warning1') || document.getElementById('warning2')) { var answer = confirm('continue?'); if (answer) { alert('1 - yes?'); document.getElementById(form_id).submit(); } else { alert('2 - no?'); //document.getElementById(form_id).submit(); } }}//]]></script></head> <body> <h1>Installation</h1><div id="body"><form action="install.php?step=3" method="post" id="form_1"><fieldset><legend>Step 2 - Connect to MySQL</legend> <p>You successfully connected to your server's database!</p><p><b class="bad" id="warning1">WARNING!</b> There are <b>1</b> row(s) of data in the table <em>public_accounts</em>!   If you continue to step 3 <em>the data will be lost</em>!</p><p>The table <em>admin_global</em> exists however it contains no data.</p></fieldset> <fieldset><legend>Step 2 - Create Tables</legend> <p>   </p><input onclick="warning_check('form_1')" type="button" value="OK" /><!-- <input class="button" type="submit" value="Continue to Step 3" />--></fieldset></form></div><!-- /#body --> </body></html>