無法接收用ajax發布的js數組
[英]cannot receive js array posted with ajax
問題描述
我正在嘗試將表單數據和js數組發送到mysql數據庫。 我在將js數組接收到我的php中遇到問題。 我從表單接收數據，但未從數組接收數據。 我找不到問題。
的index.php
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"><!--bootstrap-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script><!--jquery-->
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script><!--angular js-->
<script type="text/javascript" src="assets/js/main.js"></script>
</head>
<body>
<form method="post" action="upload.php">
<!--dynamic form created from javascript-->
<input id="submit" type="submit" value="Upload" name="submit" onclick="upload()"/>
</form>
</body>
</html>
javascript-main.js
var objArray = []; //Array of questions
function upload(){
var jsonArray = JSON.stringify(objArray);
$.ajax({
type:'post',
url: 'upload.php',
data: { jsonData : jsonArray},
success: function(data){
console.log("success!");
}
});
} else {
console.log("no data javascript!");
}
}
upload.php的
<?php
if(($_SERVER['REQUEST_METHOD'] == "POST") && (isset($_POST['submit']))){
$servername = "......";
$username = "......";
$password = "......";
$dbname = ".....";
// Create connection
$conn = new mysqli($servername, $username, $password,$dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
if(!empty($_POST['jsonData'])){
$json = $_POST['jsonData'];
var_dump(json_decode($json, true));
echo "<script type=\"text/javascript\">
console.log('received data');
</script>";
} else {
echo "data not received";
}
$conn->close();
}else {echo "unsecure connection";}
?>
objArray看起來像這樣：
[{"questionId":1,"questionTypeObj":"single","options":3},{"questionId":2,"questionTypeObj":"single","options":3}]
upload.php輸出“未收到數據”
3 個解決方案
解決方案1
0 2016-11-15 20:51:24
當您單擊按鈕時，您的代碼將向服務器發送2個請求
第一個請求-Ajax
此ajax請求具有您需要jsonData : jsonArray的參數，然后您將發送另一個請求
二次提交申請表
並且表單沒有jsonData : jsonArray隨其發送的jsonData : jsonArray參數
您根本不需要這個ajax！
接收jsonData : jsonArray所需要做的就是將jsonData : jsonArray參數與表單一起發送
例如：
改變你的形式像這樣
<form method="post" action="upload.php">
<input id="jsonData" type="hidden" name="jsonData" value="">
<input id="submit" type="submit" value="Upload" name="submit" onclick="upload()"/>
</form>
然后將您的按鈕功能更改為這樣
function upload(){
var jsonArray = JSON.stringify(objArray);
$('input#jsonData')[0].value=jsonArray ;
}
編輯：
或者，如果您希望upload.php處理ajax請求，而不是對整個文檔進行響應，則不需要該表單，將表單從HTML中刪除，只需將submit:Upload添加到ajax請求中即可
data: { jsonData : jsonArray, submit:"Upload" }
解決方案2
0 已采納 2016-11-15 20:51:38
您的輸出表明問題出在哪里：您到達data not received回顯data not received但未發送submit鍵的部分：通過ajax調用時未設置$_POST['submit'] 。
因此，您是以“常規”方式而不是通過Ajax提交表單的。
這是由於您沒有取消按鈕的默認submit操作引起的。
解決這個問題的最佳方法（我認為...）是刪除內聯javascript-點擊處理程序-並將函數替換為：
$("form").on('submit', function(e) {
// Cancel the default form submit
e.preventDefault();
// The rest of your function
var jsonArray = JSON.stringify(objArray);
...
});
請注意，我正在捕獲表單提交事件。 您也可以將其替換為按鈕單擊事件，但是當訪問者在表單字段中使用Enter鍵時，該事件可能無法正常工作。
解決方案3
0 2016-11-15 20:54:17
您不應該這樣做。 沒有任何方法可以確保JavaScript在重定向之前會執行。 實際上，它的運行速度不夠快，只會重定向到下一頁。 嘗試
<form method="post" action="upload();">
這會將數據獲取到頁面，但不會顯示它。 如果要顯示它，則應具有提交表單的表單。 如果您使用ajax發布，也可以嘗試使用jquery捕獲響應。
接收用ajax發布的數據
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.