JS form verification function not working
I have this form with a JS function to verify that there are no blank fields, but it doesn't work.
<head>
<script language='javascript'>
function verifyForm(){
var msg='';
if(document.getElementById('field1').value==''){msg+='Field 1 \n';}
if(document.getElementById('field2').value==''){msg+='Field 2 \n';}
if(msg!=''){
alert('The following entries are empty:\n\n'+msg);
return false
}else{
return true }
}
</script>
</head>
<body>
<form name="frmRequest2" id="frmRequest2" action="<? echo $submitURL2; ?>" method="post" onsubmit='return verifyForm();'>
Please answer all questions and enter "NONE" where appropriate.
<table>
<tbody>
开发者_StackOverflow社区 <tr>
<th>List any items you already have</th>
<th>List any items you need to get</th>
</tr>
<tr>
<td><textarea name="field1" id="field1" rows="2" cols="39"> <? echo $field1; ?> </textarea></td>
<td><textarea name="field2" id="field2" rows="2" cols="39"> <? echo $field2; ?> </textarea></td>
</tr>
<tr>
<td colspan="4" align="center" valign="top" style="border-width: 0px 0px 0px 0px;"> <br />
<input name="submit" value="Submit Data" type="submit"/> </td>
</tr>
</tbody>
</table>
</form>
</body>
You have extra closing curly braces (}) after your if clauses.
Edited to add: The following code works as expected and ignores any leading/trailing whitespace in the fields:
<html>
<head>
<script language='javascript'>
function verifyForm(){
var msg='';
if(document.getElementById('field1').value.replace(/\s+$|^\s+/, '') == '') {msg+='Field 1 \n';}
if(document.getElementById('field2').value.replace(/\s+$|^\s+/, '') == '') {msg+='Field 2 \n';}
if(msg!=''){
alert('The following entries are empty:\n\n'+msg);
return false;
}else{
return true;
}
}
</script>
</head>
<body>
<form name="frmRequest2" id="frmRequest2" action="" method="post" onsubmit='return verifyForm();'>
Please answer all questions and enter "NONE" where appropriate.
<table>
<tbody>
<tr>
<th>List any items you already have</th>
<th>List any items you need to get</th>
</tr>
<tr>
<td><textarea name="field1" id="field1" rows="2" cols="39"></textarea></td>
<td><textarea name="field2" id="field2" rows="2" cols="39"></textarea></td>
</tr>
<tr>
<td colspan="4" align="center" valign="top" style="border-width: 0px 0px 0px 0px;">
<input name="submit" value="Submit Data" type="submit"/>
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
You're missing a ">" on your closing "[/head]" tag, you're not closing your "[form]" tag. That could cause a problem.
You have a space on each side of each of your default value. "" != " "
As a general rule, I like to trim the spaces of inputs. Does changing the if clause to
document.getElementById('field1').value == '' to
document.getElementById('field1').value.trim() == ''
Help at all?
Also, to reiterate what David suggested, your original code looks like
<textarea name="field1" id="field1" rows="2" cols="39"><? echo $field1; ?></textarea>
and not
<textarea name="field1" id="field1" rows="2" cols="39"> <? echo $field1; ?> </textarea>
Notice the spaces?
加载中,请稍侯......
精彩评论