为什么$ _GET总是返回null,即使数据是通过AJAX成功发送的?

时间:2017-02-27 17:26:07

标签: javascript php html mysql ajax

我正在编写一个PHP脚本,根据用户动态创建Mysql中的表格。输入行数和列数。 我正在使用AJAX将数据发送到服务器。尽管发送成功,但服务器在$ _GET数组中接收空值。

这是我的整个代码:

<!DOCTYPE html>
<html>
<head>
<title>Welcome</title>

<style type="text/css">
    #head-text{
    text-align: center;
    color: blue;
    font-size: 250%;
    }
</style>

</head>
<body>
    <h1 id="head-text">Snippt</h1>
    <div class="main-content">

    <frameset>
        <form>
        <select name="n-cols" id="n-cols"  onchange="createInputFields()">
            <option>Number of columns</option>
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
            <option>5</option>
            <option>6</option>
        </select>
    </form>

    <div id="main">

    </div>

    <div id="display">

    </div>

</frameset>

</div>
</body>


<script type="text/javascript">
    function createInputFields(){

    var x = document.getElementById('n-cols');
    var n = x.value;

    if(x.selectedIndex == 0){
        alert('Choose a valid index');
    }
    //adding the input fields based on user's input

    document.getElementById('main').innerHTML ='<br>';
    for(var i = 0; i < n;i++){
        var field_name = "text" + i;
        //alert(field_name);
        document.getElementById('main').innerHTML += '<input     type="text" name = "col" placeholder="column name"> &nbsp;&nbsp; <select>  <option>Integer</option> <option>Varchar</option>  </select><br> <br> ';
    }



            document.getElementById('main').innerHTML+='<input type="submit" onClick="createTable('+ n +')" Value="Create Table">';

}


function createTable(n){

    var column_names = [];

    for(var i=0;i<n;i++){   
        var column_name = document.getElementsByName('col')[i].value;
        column_names.push(column_name);
    }

    /*
    Sending the column_names array to PHP file residing on the server
    */
    if(window.XMLHttpRequest){
        xmlhttp = new XMLHttpRequest();
    }
    else{
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }


    var column_names_json = JSON.stringify(column_names);
    //alert(column_names_json);
    xmlhttp.open("GET","create_table.php?col_name = "+column_names_json,true);
    xmlhttp.send(null);
    alert('data sent');
}

</script>
</html>

create_table.php

<?php

$arr_json = $_GET['col_name'];
$arr = json_decode($arr_json);

for($x = 0; $x< count($arr); $x++){
    echo $arr[$x];
    echo "<br>";
}

?>

当我打印$ _GET的内容时,它返回NULL。

2 个答案:

答案 0 :(得分:4)

更改

xmlhttp.open("GET","create_table.php?col_name = "+column_names_json,true);

xmlhttp.open("GET","create_table.php?col_name="+column_names_json,true);

您的网址字符串中有空格。

修改

将您的发送流程更改为:

var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", "/create_table.php");
xmlhttp.setRequestHeader("Content-Type", "application/json");
xmlhttp.send(JSON.stringify(column_names));

然后将PHP脚本更改为:

$json = json_decode(file_get_contents("php://input"));
print_r($json);

答案 1 :(得分:1)

编辑:由于您似乎使用JS来读取值并通过AJAX提交,因此以下内容不适用。如果您使用html的常规表单提交,它只会是&#34; true&#34;

表格

您正在将元素附加到main,而表单不是main,因此在提交时,不会发送添加的输入元素的数据。

浏览器

您只需将HTML附加到已渲染的Object-DOM即可添加Form-Elements。我遇到过一些不允许这样做的浏览器。

处理每个浏览器(即使这可能不是您的核心问题) 你需要修改你的javascript,以便浏览器实际上理解了一个新的输入元素已被添加到某个表单。

而不是

document.getElementById('main').innerHTML += '<input     type="text" name = "col" placeholder="column name"> &nbsp;&nbsp; <select>  <option>Integer</option> <option>Varchar</option>  </select><br> <br> ';

您需要使用以下内容向浏览器DOM注册新元素:

var input = document.createElement("input");
input.type = "text";
input.name = "input_element_x";
referenceToForm.appendChild(input) 

某些浏览器可能会显示&#34;添加了html&#34;,但在提交时只依赖于DOM,当使用HTML时,它不包含您的输入。