无法接收js数组发布与ajax

我想发送表单数据和js数组到mysql数据库。我有接收js数组到我的PHP的问题。我从窗体接收数据，但不是数组。我找不到问题。无法接收js数组发布与ajax

的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的输出的“数据没有收到”

当你点击按钮的代码

来源

2016-11-15 Bhups

请忽略main.js中的“else”语句。 – Bhups

您是否尝试过'print_r（$ _ POST）'？而且你不应该提交你的表单！您应该决定是否使用ajax，或者将其作为通常的邮寄表单提交。既然你使用了ajax（whats实际用于防止重新编码页面），你应该从你的update.php中获得一个回调函数的结果数据。类似'$ .ajax（...）。complete（function（response）{...}）'但要小心，您可能需要异步调用您的ajax函数。取决于你在做什么。 – Dwza

你的输出指示的问题是什么：你得到的部分，你回声data not received但你不能发送submit键：$_POST['submit']通过Ajax调用时未设置。

所以你提交表单是“正常”的方式，而不是通过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键时可能无法正常工作。

来源

2016-11-15 20:51:38 jeroen

我按照你说的完成了，但现在我无法加载php页面。 – Bhups

@Bhups你是否删除了'isset（$ _ POST ['submit']）'check？如果没有，你会最终进入'不安全的连接'部分。 – jeroen

@Bhups另外请注意，你的php脚本的输出将在'data'变量的'success'函数中可用，并且你还没有使用它。 – jeroen

将发送2个请求到服务器

首先请求阿贾克斯

这个Ajax请求有你需要jsonData : jsonArray参数和之后，你会再次提出请求

第二请求提交表单

和形式没有jsonData : jsonArray放慢参数与它

送你不需要这个AJAX了！

所有你需要做的，收到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" }

来源

2016-11-15 20:51:24

你不应该这样做。无法保证在重定向之前JavaScript将执行。事实上，它运行速度不够快，只会重定向到下一页。尝试

<form method="post" action="upload();">

这将获得数据到页面，但不会显示它。如果你想显示你应该有表单提交它。如果你用ajax发布，你也可以尝试用jquery来捕获响应。

来源

2016-11-15 20:54:17

无法接收js数组发布与ajax

回答

相关问题