By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,379 Members | 1,870 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,379 IT Pros & Developers. It's quick & easy.

Validation Problem

P: n/a
I'm tring to use a validation function example from WROX that looks at
form fields on a submit. I can't seem to launch it. I have 2 other
functions up in the header that work fine. Any help appreciated. Here is
the code and form:
<script type='text/javascript'>
function form1_onsubmit()
{
var form = document.MyInput
var controlCounter;
var returnValue = true;
var formControl;

for controlCounter = 0; controlCounter < form.length; controlCounter++)
{
formControl = form.elements[controlCounter];
if (formControl.type == "text" && formControl.value =="")
{
alert("Please complete all fields");
formControl.focus();
returnValue = false;
break;
}
}
return returnValue;
}

</script>
</head>

<Table border="1" Width=100%>

<form action="MyInsert.asp" method="Post" name="MyInput"
LANGUAGE=JavaScript onsubmit="return form1_onsubmit()">
<TR>
<td width=20%><input type="TEXT" name="ExDate2" onkeypress="if
(event.keyCode == 13)
{document.getElementById('next').focus();return
false;}">&nbsp;</td>
<td width=20%><SELECT name="Expense2" id="next" onkeypress="if
(event.keyCode == 13)
{document.getElementById('next2').focus();return
false;}"onchange='javascript:Titleonchange();'><Op tion value="Select"
Selected>
<Option Value="Car">Car
<Option Value="Meals">Meals
<Option Value="Air">Air
<Option Value="Phone">Phone</select>&nbsp;</td>

<td width=20%><input type="INPUT" READONLY=TRUE
name="ExCode2">&nbsp;</td>
<td width=20%><input type="TEXT" id="next2" name="Amount2">&nbsp;</td>
<td width=20%><input type="SUBMIT" value="Submit"></td>
</tr>
</table>
thanks,
Frank

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Jul 20 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a
DU
Frank Py wrote:
I'm tring to use a validation function example from WROX that looks at
form fields on a submit. I can't seem to launch it. I have 2 other
functions up in the header that work fine. Any help appreciated. Here is
the code and form:
<script type='text/javascript'>
function form1_onsubmit()
{
var form = document.MyInput
var controlCounter;
var returnValue = true;
var formControl;

for controlCounter = 0; controlCounter < form.length; controlCounter++)
I did not check the whole code - missing an ( - but this line should
have brought up the javascript debugger or your javascript console:

for (controlCounter = 0; controlCounter < form.length; controlCounter++)
{
formControl = form.elements[controlCounter];
if (formControl.type == "text" && formControl.value =="")
{
alert("Please complete all fields");
formControl.focus();
returnValue = false;
break;
}
}
return returnValue;
}

Your form1_onsubmit() function could be optimize to be more efficient.
</script>
</head>

<Table border="1" Width=100%>

Form should not be inside table. Table should be inside form. This is a
classic validation error (improper nesting). Also, there is no point to
setting the width of a table to 100% since the default value of width is
100% of its parent node.
<form action="MyInsert.asp" method="Post" name="MyInput"
LANGUAGE=JavaScript onsubmit="return form1_onsubmit()">
LANGUAGE=JavaScript should not be in there.
<TR>
<td width=20%><input type="TEXT" name="ExDate2" onkeypress="if
(event.keyCode == 13)
{document.getElementById('next').focus();return
false;}">&nbsp;</td>
event.keyCode == 13 means that only MSIE can support and will support
this page. If you want a tab behavior on an <enter> keypress, then there
is a cross-browser way to do this.
<td width=20%><SELECT name="Expense2" id="next" onkeypress="if
(event.keyCode == 13)
{document.getElementById('next2').focus();return
false;}"onchange='javascript:Titleonchange();'><Op tion value="Select"
Selected>
You can safely remove "javascript:" in the onchange attribute value:
this achieves nothing.

<Option Value="Car">Car
<Option Value="Meals">Meals
<Option Value="Air">Air
<Option Value="Phone">Phone</select>&nbsp;</td>

<td width=20%><input type="INPUT" READONLY=TRUE
name="ExCode2">&nbsp;</td>
It's readonly. Not READONLY=TRUE. Note that no browser now seems to
support correctly the readonly attribute.

http://www.w3.org/TR/html4/interact/...#adef-readonly
<td width=20%><input type="TEXT" id="next2" name="Amount2">&nbsp;</td>
<td width=20%><input type="SUBMIT" value="Submit"></td>
Usually forms have a reset button too and an onreset form event handler.

width=20% will be interpreted as 20px while
width="20%" will be interpreted as 20% of its parentNode given width.

Just by giving wrapping all your attribute values in double quotes, you
make your page get parsed and rendered faster and you avoid this kind of
error.

3.4. Should I put quotes around attribute values?
http://www.htmlhelp.com/faq/html/basics.html#quotes

"By default, SGML requires that all attribute values be delimited using
either double quotation marks(...)"
http://www.w3.org/TR/html4/intro/sgm...tml#attributes
</tr>
</table>
Your form end tag is not found: so, improper nesting here also.
thanks,
Frank

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

You really should validate your whole document, use a doctype
declaration, etc..

http://validator.w3.org/

Activating the Right Layout Mode Using the Doctype Declaration
http://www.hut.fi/u/hsivonen/doctype.html

DU
--
Javascript and Browser bugs:
http://www10.brinkster.com/doctorunclear/

Jul 20 '05 #2

P: n/a
Thanks for your analytical pointers. I was able to get it going with
your help.

Sincerely,
Frank

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.