jQuery PHP表单提交错误 [英] jQuery PHP form submission bug
问题描述
我正在尝试使用jquery和ajax提交表单.基本上，问题是:
I am trying to submit a form using jquery and ajax.Basically, the issues are:
1.POST请求未发送
1.POST request not being sent
2.表单数据未通过验证
2.Form data not being validated
3.表单在第二次单击提交按钮时未获取数据
3.The form is not taking data on the second click of the submit button
对于第一个问题，一旦删除验证部分，就会发送POST请求.但是，我不知道为什么下面提到的代码不起作用.
For the first problem, a POST Request is being sent once I remove the validation portion. However, I do not know why the code mentioned below should not work.
我不知道为什么第二个问题存在.我已经一次又一次地更改了代码的结构，但是数据尚未得到验证.我已经分别测试了这些功能，它们可以工作，但是，当按下提交"按钮时，它们不起作用，即，即使应该在if条件内进行测试，应该发送帖子数据的if条件也返回false(转到else).分别是正确的.
I have no idea why the second problem exists. I have changed the structure of my code time and again, but data is not being validated. I have tested the functions separately and they work, however they do not work when the submit button is pressed, i.e. the if condition that is supposed to send the post data returns false (goes to else), even when the tests inside the if condition are true individually.
我怀疑第三个问题可能是第一个问题.不过我不太确定.
The third problem, I suspect, is probably due to the first. I am not so sure though.
预先包含的脚本是jquery.min.js 1.11.1，twitter bootstraps.min.js
scripts pre included are jquery.min.js 1.11.1, twitter bootstraps.min.js
<!DOCTYPE HTML>
<html>
<head>
<title>Live info a Sports Category Flat Bootstrap Responsive Website Template | Home :: w3layouts</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta property="og:title" content="Vide" />
<meta name="keywords" content="Live info Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design" />
</head>
<?php
session_start();
include 'db.php';
if(isloggedin() == 0) {
include 'header.php';
?>
<br><br>
<form id="formdata">
<div class="contact signup-body">
<div class="login-body">
<div class="login-heading">
<h3>Sign up</h3>
</div>
<div class="login-info">
<input type="text" class="user" id="name" name="name" placeholder="Name" >
<div id="namem" style='text-align:center;color:red;'></div>
<input type="text" class="user" id="email" name="email" placeholder="Email">
<div id="emailm" style='text-align:center;color:red;'></div>
<input type="text" class="user" id="mobile" name="mobile" placeholder="Phone">
<div id="mobilem" style='text-align:center;color:red;'></div>
<input type="password" id="password" name="password" class="lock" placeholder="Password">
<div id ="passm" style='text-align:center;color:red;'></div>
<input type="password" id="repassword" name="repassword" class="lock" placeholder="Confirm Password" >
<div id = "repassm" style='text-align:center;color:red;'></div>
<input type="submit" id="signin" name="signin" value="Sign up">
<div class="signup-text">
<a href="#" data-toggle="modal" data-target="#myModal">Already have an account? Login here.</a>
</div>
</div>
</div>
<!-- Modal -->
<!-- // Modal -->
</div>
</form>
<!-- //contact -->
</div>
<script src="js/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$('#signin').click(function(event){
event.preventDefault();
var name = $('#name').val();
var email = $('#email').val();
var mobile = $('#mobile').val();
var password = $('#password').val();
var repassword = $('#repassword').val();
var email_filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
var mob_fil = /^[0-9]{10}$/i;
var string = /^[ a-zA-Z]+$/;
var pass = /^[a-zA-Z0-9_\.\-\@\!]*$/;
if (!(name == '' || email == '' || mobile== '' || password == '' || repassword == '')){
if (!email_filter.test(email)) {$('#emailm').html('Please provide a valid email address');}
if (!mob_fil.test(mobile)) {$('#mobilem').html('Please enter a 10 digit number');}
if (!string.test(name)) {$('#namem').html('Please enter only alphabets');}
if (!pass.test(password)) {$('#passm').html('Only alphabets,digits and special characters allowed in password');}
if(password.length<3) {$('#passm').html('please enter a bigger password');}
if (password!=repassword) {$('#repassm').html('Password and Confirm password do not match');}
}
if((email_filter.test(email)==true) && (mob_fil.test(mobile)==true) && (string.test(name)==true) && pass.test(password) && (password.length>3) && (password=repassword))
{
var dataString = $('#formdata').serializeArray();
$.ajax({
type: "POST",
url: "register.php",
data: dataString,
dataType:"text",
contentType: 'application/x-www-form-urlencoded',
cache: false,
success: function(result){
var data="";
$("#message").html('success');
$("#name").val('');
$("#email").val('');
$("#mobile").val('');
$("#password").val('');
$("#repassword").val('');
},
error: function(error){console.log(error);}
});
}
else {$('#repassm').html("your form is not valid");}
});
});
</script>
<?php include 'login_modal.php';session_destroy();}
else { $url = 'index.php'; echo '<META HTTP-EQUIV=REFRESH CONTENT="0; '.$url.'">';} ?>
<!-- main content end-->
</div>
</div>
</div>
<?php include 'footer.php' ?>
</section>
</body>
</html>
我之前发布了一个问题，发现验证部分存在问题.
I posted a question previously and found out that the validation part is buggy.
此外，控制台没有显示jQuery错误.
Also, the console shows no jQuery errors.
推荐答案
我建议的第一件事是不要在JQuery中进行验证.将数据发送到PHP并在那里进行检查.
First thing I'd suggest is don't do your validation in JQuery. Send the data to PHP and do the checking there.
第二，您在这里遇到拼写错误:event.prevetnDefault();
Second, you've got a spelling error here: event.prevetnDefault();
第三，您对register.php返回的结果不做任何事情
Third, you're not doing anything with the results returned from register.php
success: function(result){
var data="";
$("#message").html('success');
$("#name").val('');
$("#email").val('');
$("#mobile").val('');
$("#password").val('');
$("#repassword").val('');
console.log(result); // Check the result in console
},
第四，您提到删除验证时它可以正常工作.一次删除一次验证，直到找出导致问题的原因.但是就像我说的那样，您应该使用PHP进行验证.
Fourth, you mentioned it working when you removed the validation. Remove the validation one step at a time until you figure out which one is causing the problem. But like I said, you should be doing your validation in PHP.
我可能错了，但是我认为也许这行需要重写:
I could be wrong, but I think maybe this line needs to be re-written:
if (!(name == '' || email == '' || mobile== '' || password == '' || repassword == '')){
if (name != '' && email != '' && mobile != '' && password != '' && repassword != '') {
这篇关于jQuery PHP表单提交错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
