我正在编写一个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"> <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。
答案 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"> <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时,它不包含您的输入。