提交前验证表格
[英]validate form before submition
问题描述
I want to submit a form with php variables to input into javascript, the problem is that the variables are only set after posting, which is too late for them to be echoed into the javascript. 
我想提交一个带有php变量的表单以输入到javascript中，问题是变量仅在发布后设置，这对于将它们回显到javascript中为时已晚。 Of course, if I then submit again, the variables have been implemented into the javascript and it works as it should. 当然，如果我再提交一次，则变量已在javascript中实现，并且可以正常工作。 However, I would prefer just to submit once. 但是，我希望只提交一次。 Is there any way to validate the form before submission ? 有什么办法可以在提交之前验证表格？ Here is an example of my dilemma: 这是我的困境的一个例子：
<?php
if(isset($_POST['submit'])){$name=$_POST['name'];}
?>
<html>
<div id="message"></div>
<form action="home.html" method="POST">
<input type="text" name="name">
<input type="submit" name="submit" value="conditions-met"
onclick=<?php if($name=="bob"){echo"start();";}?>>
</form>
</html>
<script type="text/javascript">
function start(){
document.getElementById('message').innerHTML = 'hello bob';
return true;
}
</script>
4 个解决方案
解决方案1
2 2013-01-14 14:26:17
Man people are mean to you!! 男人们对你很卑鄙！
Basically you should validate the fields using JavaScript. 基本上，您应该使用JavaScript验证字段。
When the submit button is clicked do the checks. 单击提交按钮后，进行检查。 Continue on success, show an error message on failure. 继续成功，失败时显示错误消息。
example 例
<form id="myForm" onsubmit="return ValidateFields(this)" name="myForm" accept-charset="UTF-8" enctype="multipart/form-data"" action="myPhpScript.php" method="POST">
// html fields
</form>
<script>
function ValidateFields(formObject)
{
var FieldsValid = true;
//Validate the fields and if one of them is not valid set FieldsValid to false
if(!FieldsValid )
{
//show an error message
return false; // Returing false will prevent the form from submitting
}
return true;// the form will be submitted
}
</script>
In order to become a ninja please read the following: 为了成为忍者，请阅读以下内容：
http://www.script-tutorials.com/form-validation-with-javascript-and-php/ http://www.script-tutorials.com/form-validation-with-javascript-and-php/
http://www.webcredible.co.uk/user-friendly-resources/dom-scripting/validate-forms-javascript.shtml http://www.webcredible.co.uk/user-friendly-resources/dom-scripting/validate-forms-javascript.shtml
http://www.w3schools.com/js/js_form_validation.asp http://www.w3schools.com/js/js_form_validation.asp
解决方案2
1 2013-01-14 14:05:10
The function bound to the onclick-event must return true if validation is correct, or false otherwise. 如果验证正确，则绑定到onclick-event的函数必须返回true，否则返回false。
The same function must be in javascript. 相同的功能必须在javascript中。 You cannot call a php function in it. 您不能在其中调用php函数。 If you want php, try ajax. 如果您想要php，请尝试使用ajax。
<input type="submit" onsubmit="return validate();" />
<script>
function validate() {
// do validation in javascript
// or make an ajax request e.g. to
// /validate.php?name=somename&surname=someothername
// and let this request answer with true or false
// return true if valid, otherwise false
}
</script>
解决方案3
1 2013-01-14 14:32:11
You can do it with Ajax and beforeSubmit function with Jquery You have: 您可以使用Ajax和JQuery的beforeSubmit函数来实现：
$.ajax({
url: "your async page in php",
cache: true,
data: $("#formID").serialize(),
type: 'POST',
beforeSend: function(){
/* You can validate your input here*/
},
success: function(response){
/* Based on the response from php you can handle the message to the user*/
},
error: function(response){/*Error Handler*/},
complete: function(){/*If it's complete than you can reset the form*/}
});
I think it's easy and more clear if you use cross Ajax/PHP request 我认为，如果使用跨Ajax / PHP请求，这将变得更加简单明了
解决方案4
1 已采纳 2013-01-14 14:43:55
<html>
<div id="message"></div>
<form action="home.html" method="POST" onsubmit="return validate()">
<input type="text" name="name" id="name">
<input type="submit" name="submit" value="conditions-met" >
</form>
</html>
<script type="text/javascript">
function validate(){
name=document.getElementById('name').value;
if(name == "")
{
document.getElementById('message').innerHTML = 'Please Fill Name';
return false;
}
return true;
}
</script>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.