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不能使用按鈕

回答

相關問題