jQuery 验证 submitHandler 在 $.ajax 发布表单数据中不起作用

Question

我正在使用 jquery validate 插件将数据从表单发送到 mysql 数据库。验证效果很好，但单击按钮后，数据未提交到数据库。但不会产生响应或错误。我认为错误在 ajax 部分。

下面的文件是db_connect.php，它执行。两个echo都在工作

<?php

echo "hello";
/* Database connection start */
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "upscfpyl_test";
$conn = mysqli_connect($servername, $username, $password, $dbname) or die("Connection failed: " . mysqli_connect_error());
if (mysqli_connect_errno()) {
    printf("Connect failed: %s\n", mysqli_connect_error());
    echo "hi";
    //exit();
}
else{
    echo "hi2";
}
?>       

index.html - 显示 div 错误下方给出的一些代码，但其中的内容是 hi2。我不知道为什么它有内容hi2。我用过 echo "hi2";在 db_connect.php [最后给出的代码] 但没有将其返回给 ajax。

<div id="error"></div>
<form id="signupForm" method="post" action="#">
<input type="submit" class="btn btn-primary" value="Sign Up" id="button1" name="btn-save">
</form>

Ajax 部分：

$.ajax({
    type: 'POST',
    dataType: 'text',
    url: 'js/php/register.php',
    data: {
        name1: name,
        email1: email,
        mobile1: mobile,
        gender1: gender,
        password1: passwords
    },
    beforeSend: function() {
        $("#error").fadeOut();
        document.getElementById("button1").disabled = true; // this works
    },
    success : function(response) {
        if(response==1)
        {
            $("#error").fadeIn(1000, function()
            {
                $("#error").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span>   Sorry email already taken !</div>');
                document.getElementById("button1").disabled = false;
            });
        } 
        else if(response=="registered")
        {
            window.location = "dashboard.html";
        } 
        else {
            $("#error").fadeIn(1000, function()
            {
                $("#error").html('<div class="alert alert-danger"><span class="glyphicon glyphicon-info-sign"></span>   '+response+' !</div>');
                document.getElementById("button1").disabled = false;
            });
        }
    }
});

register.php - 提交到数据库

<?php
include_once("db_connect.php");


function test_input($data) {
  $data = trim($data);
  $data = stripslashes($data);
  $data = htmlspecialchars($data);
  return $data;
}


if ($_SERVER["REQUEST_METHOD"] == "POST") {
  $name=test_input($_POST['name1']); // Fetching Values from URL.
  $email=test_input($_POST['email1']);
  $gender=test_input($_POST['gender1']);
  $mobile=test_input($_POST['mobile1']);
  $password= test_input(sha1($_POST['password1'])); // Password Encryption, If you like you can also leave sha1.

echo "pranav";    // these dont work
echo $name+$email+$gender; // this also doesnt work


  // Check if e-mail address syntax is valid or not
  $email = filter_var($email, FILTER_SANITIZE_EMAIL); // Sanitizing email(Remove unexpected symbol like <,>,?,#,!, etc.)
  if (!filter_var($email, FILTER_VALIDATE_EMAIL)){
    echo $email;
  } 
  else{
    $result = mysql_query("SELECT * FROM users WHERE email='$email'");
    $data = mysql_num_rows($result);
    if(($data)==0){
      $query = mysql_query("insert into users(name, email, password, gender, mobile) values ('$name', '$email', '$password', '$gender', '$mobile')"); // Insert query
      if($query){
        echo "registered";
      }
      else
      {
        echo "Error....!!";
      }
    }
    else
    {
      echo "1";
    }
  }
}
?>  

    

Answer 1

您可以打开浏览器控制台查看日志。

如果 dataType 是 JSON，这意味着您的服务器正在返回一个 json。但事实并非如此，请参阅https://api.jquery.com/jQuery.ajax/

试试这个代码进行数据序列化：

$("#your_form_id").submit(function(e){ 
    e.preventDefault(); 
    var datas = $(this).serialize(); 
    $.ajax({

        data: datas,
        // Or this
        data: 'key1=' + value1 + '&key2=' + value2 + '&key3=' + value3,

        // to match your server response
        dataType: "text"

        // Error warning
        .fail(function() {
           alert( "error" );
        })

    });
});

有了表单的验证码，我们可以更好地帮助你