提交按钮不在ajax中工作

时间:2016-02-11 11:52:02

标签: php jquery html ajax

理想情况下,每当我提交表单时,php应该回来。但是我的表单没有提交。我看过其他与此相关的帖子,但没有任何帮助 代码流正在接受来自用户的输入 - > ajax会将其驱动到php页面 - > php将执行数据操作并返回成功作为输出。

以下是代码

的HTML

<form method="post" id="validation">


  <h3>Enter your Details:</h3>
  <div class="fields">
    <span id="message"></span>
    <table>
      <tr>
        <td width="73">Firstname:</td>
        <td width="150">
          <input type="text" id="firstname" placeholder="firstname" name="firstname" required="required">
        </td>
      </tr>

      <tr style="margin-top::10px">
        <td>Lasttname:</td>
        <td>
          <input type="text" id="lasttname" name="lastname" placeholder="lastname">
        </td>
      </tr>

      <tr>
        <td>Street:</td>
        <td>
          <input type="text" id="Street" name="street" placeholder="street">
        </td>
      </tr>

      <tr>
        <td>City:</td>
        <td>
          <input type="text" placeholder="city" id="city" name="city">
        </td>
      </tr>


      <tr>
        <td>State:</td>
        <td>
          <input type="text" id="state" name="state" placeholder="state">
        </td>
      </tr>

      <tr>
        <td>Mobile No:</td>
        <td>
          <input type="text" id="mobile" name="mobile" placeholder="Mobile no">
        </td>
      </tr>

      <tr>
        <td>Email:</td>
        <td>
          <input type="text" id="email" name="email" placeholder="Email">
        </td>
      </tr>

    </table>
    <div id="success"></div>
  </div>
  <input type="Submit" value="Submit" id="Submit" name="Submit" style="margin-left:150px">


</form>

的Jquery

$("#validation").on('Submit', function(e) {
   //  $('#validation').submit(function(e){
   e.preventDefault();
   alert("gdgdsdfffffffffffffffffffffffff");
   var firstname = document.getElementById("firstname").value;
   var lastname = document.getElementById("lastname").value;
   var street = document.getElementById("street").value;
   var city = document.getElementById("city").value;
   var state = document.getElementById("state").value;
   var mobile = document.getElementById("mobile").value;
   var email = document.getElementById("email").value;

   $.ajax({
     type: "POST",
     url: "save.php",
     data: {
       firstname: fisrtname,
       lastname: lastname,
       street: street,
       city: city,
       state: state,
       mobile: mobile,
       email: email
     },

     success: function(response) {
       $("#success").html(response);
     }
   });

 });

的PHP

$servername = "localhost";
$username   = "root";
$password   = "";
$dbname     = "mydb";
// Create connection
$conn       = mysqli_connect($servername, $username, $password, $dbname);

// Check connection
if (mysqli_connect_errno()) {
    echo "false";
}
echo nl2br("Connected successfully\n");

//create table
$sql = "create table empdetails (id int(6) UNSIGNED                               AUTO_INCREMENT         primary key,firstname varchar(20),
               lastname varchar(20),street varchar(20),city varchar(20),state                                                 varchar(20),mobile varchar(20),email varchar(20))";
$conn->query($sql);
echo nl2br("table empdetails created successfully\n");

$firstname = $_POST["firstname"];
$lastname  = $_POST["lastname"];
$street    = $_POST["street"];
$city      = $_POST["city"];
$state     = $_POST["state"];
$mobile    = $_POST["mobile"];
$email     = $_POST["email"];

$sql = "insert into empdetails(firstname,lastname,street,city,state,mobile,email) values('$firstname','$lastname','$street','$city','$state','$mobile','$email')";
//conn->query($sql);
if ($conn->query($sql) === TRUE) {
    echo nl2br("New record created successfully\n");
    echo $row = 'success';

} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}

1 个答案:

答案 0 :(得分:0)

页面中有很多错误。

  

1。您的ID为街道(capital S)

但是你打电话给小&#34;&#34;

var street = document.getElementById("street").value;

替换上面的

var street = document.getElementById("Street").value;
  

2。您的查询。附加php变量

您的代码:

$sql = "insert into empdetails(firstname,lastname,street,city,state,mobile,email) values('$firstname','$lastname','$street','$city','$state','$mobile','$email')";

将其替换为

$sql = "insert into empdetails(firstname,lastname,street,city,state,mobile,email) values('".$firstname."','".$lastname."','".$street."','".$city."','".$state."','".$mobile."','".$email."')";
  

3. 检查数据库凭据是否正确。

     

4. 检查是否执行了查询。