[英]Javascript client side validation with PHP
以下是我在简单表单上进行的一些JavaScript验证。 我第一次点击提交时,验证就会生效,并会触发错误消息。 如果出现错误,请输入仍然不正确的新值,然后再次单击提交,验证将不再起作用,并且这些值将传递到我的php表单中。
这是javascript
<script type="text/javascript" language="javascript">
<!--
function validateMyForm ( ) {
var isValid = true;
if ( document.form1.gamedate.value === "Select One" ) {
document.getElementById("errorMessage").innerHTML = ( "Please select a game" );
isValid = false;
} else if ( document.form1.wteam.value === "Select One" ) {
document.getElementById("errorMessage").innerHTML = ( "Please select the winning team" );
isValid = false;
} else if ( document.form1.wscore.value === "Select One" ) {
document.getElementById("errorMessage").innerHTML = ( "Please select the winning score" );
isValid = false;
} else if ( document.form1.lscore.value === "Select One" ) {
document.getElementById("errorMessage").innerHTML = ( "Please select the losing score");
isValid = false;
} else if ( document.form1.wscore.value <= document.form1.lscore.value ){
document.getElementById("errorMessage").innerHTML = ( "Winning score must be larger than the losing score");
isValid = false;
}
return isValid;
}
//-->
</script>
带有*******的php表单以删除某些数据
<form action="*********" method="post" name="form1">
<div class="form-group">
<label>Game Date:</label>
<select name="gamedate">
<option>Select One</option>
<?php
$stmt = $db->prepare("***********)");
$stmt->execute(array(':**********' => $_SESSION['**********']));
while($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
echo '<option value="';
echo $row['*********'];
echo '">';
echo $row['*********'];
echo '</option>';
}
?>
</select>
</div>
<div class="form-group">
<label>Winning Team</label>
<select name="wteam">
<option>Select One</option>
<option value="1">Home</option>
<option value="0">Opponent</option>
</select>
</div>
<div class="form-group">
<label>Winning Score</label>
<select name="wscore">
<option>Select One</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
</select>
</div>
<div class="form-group">
<label>Losing Score</label>
<select name="lscore">
<option>Select One</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
</select>
</div>
<div class="form-group">
<input type="submit" value="Submit" onclick="javascript:return validateMyForm();">
</form>
对我在做什么错有任何想法吗?
从错误的位置调用了您的validate函数。 应该从表单的onsubmit
方法而不是提交按钮的onclick
方法调用它:
<form action="*********" method="post" name="form1" onsubmit="return validateMyForm()">
您试图在JavaScript中获取下拉菜单的值,但随后将其与下拉菜单的文本进行比较。 您可以将值分配给默认的下拉选项并与之进行比较,或者更改您的JavaScript来获取文本(例如“选择一个”)。
JavaScript验证很棒,但是您也应该在PHP表单处理程序中执行相同的验证步骤。 然后,如果它没有通过PHP表单处理程序的验证,则可以再次将表单重定向回页面。 最好预先填充有效字段,并指出需要更正的字段。
应该将Javascript验证视为服务器端验证的补充。
@danl这是一些基本的PHP验证。 我不确定您的gamedate变量应采用哪种格式进行检查。 其他都是非常基本的。
$haserror=false;
$gamedate=$_POST['gamedate'];
//not sure what is valid for gamedate. But you should check it against something
if(strlen($gamedate)<1){
$haserror=true;
$errordetail.=' Game Date must be selected';
}
$wteam=$_POST['wteam'];
if(!(($wteam==1) || ($wteam==0))){
$haserror=true;
$errordetail.=' Winning team must be selected';
}
$wscore=$_POST['wscore'];
if(!is_numeric($wscore)){
$haserror=true;
$errordetail.=' Winning score does not appear to be a valid number';
}
$lscore=$_POST['lscore'];
if(!is_numeric($lscore)){
$haserror=true;
$errordetail.=' Losing score does not appear to be a valid number';
}
if($lscore > $wscore){
$haserror=true;
$errordetail.=' Losing score should not be more than the winning score.';
}
if($haserror){
echo $errordetail;
exit();
}
else{
echo' Success! . Process the data here';
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.