Ajax不能使用按钮

我的发送按钮不起作用。不应该脚本带我去add.php？但它而不是它刷新页面？如何和为什么？帮助我请它没有Ajax脚本工作。Ajax不能使用按钮

Tommorow是我的实验考试，我无法让事情正常工作。

我应该做些什么改变才能解决问题。

<script 
src="https://code.jquery.com/jquery-3.2.1.min.js" 
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" 
crossorigin="anonymous"></script> 

</head> 

<body> 
<a class="btn btn-outline-primary" href="index.php">Home</a> 
<br/><br/> 

<form method="post" id="form1"> 
    <table width="25%" border="0"> 
    ... 
     ... 
     <tr> 
      <td><input class="btn btn-primary" type="reset" 
name="Clear" value="Clear"></td> 
      <td><input type="button" value="send" id="asdasd" 
name="Submit" /></td> 
     </tr> 
    </table> 
</form>

<script> 
$(document).ready(function(e){ 
$("#form1").click(function() { 

var name=$('#name').val(); 
var email=$('#email').val(); 
var age=$('#age').val(); 
var status=$('#status').val(); 

    $.ajax({ 
    type: "POST", 
    url: '../crud/add2.php', 
    data: $('#form1').serialize() 
    }); 

}); 
}); 
</script>

这里是我的add.php文件

<body> 
<?php 
//including the database connection file 
include_once("config.php"); 

if(isset($_POST)) { 
$name = mysqli_real_escape_string($mysqli, $_POST['name']); 
$age = mysqli_real_escape_string($mysqli, $_POST['age']); 
$email = mysqli_real_escape_string($mysqli, $_POST['email']); 
$status = mysqli_real_escape_string($mysqli, $_POST['status']); 

// checking empty fields 
if(empty($name) || empty($age) || empty($email)|| empty($status)) { 

    if(empty($name)) { 
     echo "<font color='red'>Name field is empty.</font><br/>"; 
    } 

    if(empty($age)) { 
     echo "<font color='red'>Age field is empty.</font><br/>"; 
    } 

    if(empty($email)) { 
     echo "<font color='red'>Email field is empty.</font><br/>"; 
    } 

    if(empty($status)) { 
     echo "<font color='red'>Status field is empty.</font><br/>"; 
    } 

    //link to the previous page 
    echo "<br/><a href='javascript:self.history.back();'>Go Back</a>"; 
} else { 
    // if all the fields are filled (not empty) 

    //insert data to database 
    $result = mysqli_query($mysqli, "INSERT INTO   
users(name,age,email,Status)   
VALUES('$name','$age','$email','$status')"); 

    //display success message 
    echo "<font color='green'>Data added successfully."; 
    echo "<br/><a href='index.php'>View Result</a>"; 
} 
} 
else { 
echo "<font color='green'>NOOOOOOO added successfully."; 
    echo "<br/><a href='index.php'>View Result</a>"; 
} 
?> 
</body> 
</html>

来源

2017-05-29 Mansoor Ahmad

据我所知，没有重定向到add.php。你可以在ajax返回输出后添加它以获得add.php。 – Redrif

您是否还需要在实验考试中使用ajax？因为如果没有，你可以把行动iside窗体标签，并将其设置为add.php – Redrif

是的，我需要使用ajax。它是我的实验室要求，这个要求在几分钟前刚刚发布。“CRUD WITH AJAX” –

好吧，你说你需要在你的实验室考试使用AJAX这里是你如何重定向后阿贾克斯完成：

<script> 
$(document).ready(function(){ 
    $("#asdasd").click(function(e) { 

    var name=$('#name').val(); 
    var email=$('#email').val(); 
    var age=$('#age').val(); 
    var status=$('#status').val(); 

     $.ajax({ 
      type: "POST", 
      url: '../crud/add2.php', 
      data: $('#form1').serialize() 
     }).done(function(data){ 
      window.location.href = "add.php"; // or whatever redirect you want 
     }); 

    }); 
}); 
</script>

另外即时通讯不知道，如果你明白，重定向到add.php后，你不会有$ _POST数据这种方式。我不知道为什么你想重定向到add.php在最前面的地方，因为ajax会执行你的脚本anywayt（虽然这是add2.php不add.php，但我认为它只是错字或什么）。你可以将ajax的输出附加到当前页面的主体中（这就是ajax的基本用法 - 不需要重定向）。但是，如果你想添加使用Ajax的数据，并且还自己重定向到add.php页面时得到发布的数据，你需要这样的事：

更改添加操作形成这样的标签：

<form method="post" id="form1" action="add.php">

然后脚本应该是这样的：

<script> 
$(document).ready(function(){ 
    $("#asdasd").click(function(e) { 
    e.preventDefault(); 
    var name=$('#name').val(); 
    var email=$('#email').val(); 
    var age=$('#age').val(); 
    var status=$('#status').val(); 

     $.ajax({ 
      type: "POST", 
      url: '../crud/add2.php', 
      data: $('#form1').serialize() 
     }).done(function(data){ 
      $soap('#form1').submit(); 
     }); 

    }); 
}); 
</script>

但是这样一来，将两次添加相同的一行到你的数据库。

最后更新： 好吧，你在commencts add.php想应该是这样的：

//including the database connection file 
include_once("config.php"); 

if(isset($_POST)) { 
    $name = mysqli_real_escape_string($mysqli, $_POST['name']); 
    $age = mysqli_real_escape_string($mysqli, $_POST['age']); 
    $email = mysqli_real_escape_string($mysqli, $_POST['email']); 
    $status = mysqli_real_escape_string($mysqli, $_POST['status']); 

    // checking empty fields 
    $result = array(); 
    if(empty($name) || empty($age) || empty($email)|| empty($status)) { 

     if(empty($name)) { 
      $result['error']['name'] = 'Name field is empty.'; 
     } 

     if(empty($age)) { 
      $result['error']['age'] = 'Age field is empty.'; 
     } 

     if(empty($email)) { 
      $result['error']['email'] = 'Email field is empty.'; 
     } 

     if(empty($status)) { 
      $result['error']['status'] = 'Status field is empty.'; 
     } 
    } else { 
     // if all the fields are filled (not empty) 

     //insert data to database 
     $result = mysqli_query($mysqli, "INSERT INTO   
     users(name,age,email,Status)   
    VALUES('$name','$age','$email','$status')"); 

     //display success message 
     $result['success'] = "<font color='green'>Data added successfully.". 
     "<br/><a href='index.php'>View Result</a>"; 
    } 
} else { 
    $result['error_message'] = "<font color='green'>NOOOOOOO added successfully.". 
    "<br/><a href='index.php'>View Result</a>"; 
} 
echo json_encode($result);

脚本部分：

<script> 
$(document).ready(function(){ 
    $("#asdasd").click(function(e) { 
     $.ajax({ 
      type: "POST", 
      url: '../crud/add.php', 
      data: $('#form1').serialize(), 
      dataType: 'json' 
     }).done(function(data){ 
      if(data.hasOwnProperty('error_message')){ 
       $('#form1').after(data['error_message']); 
      } else if(data.hasOwnProperty('error')){ 
       for(var key in data['error']) { 
        if (data['error'].hasOwnProperty(key)) { 
         $('#'+key).after(data['error'][key]); 
        } 
       } 
      } else if(data.hasOwnProperty('success')){ 
       $('#form1').after(data['success']); 
      } 
     }); 

    }); 
}); 
</script>

来源

2017-05-29 08:52:18 Redrif

让我试试你的方式 –

我添加了一些更多信息。如果你告诉我在使用ajax发送数据之后是否真的需要重定向，或者在完成ajax之后添加一些消息，这将是一件好事。 – Redrif

我的代码是这样工作的从html获得的数据传递给 - > add.php。插入后查询回声与主页按钮。 –

请键ID创建点击事件，不一个表单ID ..我已经修改你的ajax脚本请尝试这个脚本。

<script> 
    $(document).ready(function(e){ 
     $("#asdasd").click(function() { 
       var name=$('#name').val(); 
       var email=$('#email').val(); 
       var age=$('#age').val(); 
       var status=$('#status').val(); 

    $.ajax({ 
      type: "POST", 
      url: '../crud/add2.php', 
      data: $('#form1').serialize() 
     }); 

    }); 
});

来源

2017-05-29 08:53:58

$(function() { 

$('#form1').on('submit', function (e) { 

    e.preventDefault(); 

    $.ajax({ 
     type: 'post', 
     url: 'add.php', 
     data: $('#form1').serialize(), 
     success: function (data) { 
      alert('form was submitted'); 



     }, 

    error: function() { 
     alert('error'); 
    } 
    }); 

}); 

});

两个文件.PHP的.html必须具有其中上面的代码被置于一个JS文件。这为我工作。

来源

2017-05-30 00:23:29

Ajax不能使用按钮

回答

相关问题