通过ajax POST传值,但返回为空

WBOY
发布: 2016-06-23 13:58:43
原创
805 人浏览过

第一次接触ajax,想通过一个简单的例子来练练
index.php中有一个下拉列表,选择不同的班级返回不同的学生信息
代码如下:

<?php	//从数据库把班级名称取出来放入下拉列表中	mysql_connect("localhost","root","root") or die("数据库连接失败");	mysql_select_db("studentmanage") or die("数据库不存在");							$sql="select * from class";	$rs=mysql_query($sql);	$info=array();	while($row=mysql_fetch_assoc($rs)){		$info[]=$row;	}?><!doctype html><html>	<head>		<title>查询学生信息</title>		<meta http-equiv="content-type" content="text/html;charset=utf-8"/>		<style type="text/css">				</style>		<script type="text/javascript">			var xmlhttprequest;;			function getMessage(){								if(window.ActiveXObject){					xmlhttprequest=new ActiveXObject("Microsoft.XMLHTTP");				}else{					xmlhttprequest=new XMLHttpRequest();				}								if(xmlhttprequest){					var url="result.php";					var cid=document.getElementById("class").value;					var show=document.getElementById("info");					var data="class=cid";					xmlhttprequest.open("post",url,true);					xmlhttprequest.setRequestHeader("content-type","application/x-www-form-urlencode");					xmlhttprequest.onreadystatechange=function(){						if(xmlhttprequest.readyState==4){							if(xmlhttprequest.status==200){								var info=xmlhttprequest.responseText;								if(info==""){									show.value="你好,你查询的班级暂时还没有学生";								}else{									show.value=info;								}							}						}else{							alert("error");						}					}					xmlhttprequest.send(data);				}			}		</script>	</head>	<body>		<div id="content">			<h1>				请选择班级:				<select name="class" id="class" onchange="getMessage()">					<option value="" selected>choose class</option>					<?php foreach($info as $v){?>					<option value="<?php echo $v['cid'];?>"><?php echo $v['cname'];?></option>					<?php }?>				</select>			</h1>			<div id="info"></div>		</div>	</body></html>
登录后复制


通过result.php查询数据库,并返回学生信息,代码如下:
<?php	//header("content-type:text/html;charset=utf-8");	header("Content-type:text/xml;charset=utf-8");	header("Cache-Control:no-cache");	$class=$_POST['class'];		mysql_connect("localhost","root","root") or die("数据库连接失败");	mysql_select_db("studentmanage");	mysql_query("set names utf-8");	$sql="select * from student where cid='$class'";	//$sql="select * from student where cid=3";	$rs=mysql_query($sql);	$info=array();	while($row=mysql_fetch_assoc($rs)){		$info[]=$row;	}		$result="<table><tr><td>学号</td><td>姓名</td><td>住址</td><td>班级</td></tr>";	foreach($info as $v){		$result.="<tr><td>{$v['sid']}</td><td>{$v['name']}</td><td>{$v['address']}</td><td>{$v['cid']}</td></tr>";	}	$result.="</table>";	echo $result;?>
登录后复制


我单独测试了下result.php,我确定没有问题,能从数据库中取出对应的信息,但是就是不能把取到的信息返回到index.php中
求各位帮帮忙,找找问题在哪


回复讨论(解决方案)

result.php
不能直接返回带输出内容,要用 json_encode 处理返回的数据

如:查表中的数据出来放到一数组中,然后:echo json_encode($arr);

给div设置value?即使你的查询时正常的,由于div的value并不会直接在视图中展现,所以你看不到效果。
你需要的应该是innerHTML

result.php
不能直接返回带输出内容,要用 json_encode 处理返回的数据

如:查表中的数据出来放到一数组中,然后:echo json_encode($arr);



ajax不是有三种返回格式吗?分别为text, xml,json
我这里用的是text格式,我不知道这有什么错误

至少需要把 var show=document.getElementById("info"); 放在回调函数中

给div设置value?即使你的查询时正常的,由于div的value并不会直接在视图中展现,所以你看不到效果。
你需要的应该是innerHTML



恩恩,你说的对(我Js基础不是很好==),我按照您说的改了,然后按步骤调试了下:

<?php	//从数据库把班级名称取出来放入下拉列表中	mysql_connect("localhost","root","root") or die("数据库连接失败");	mysql_select_db("studentmanage") or die("数据库不存在");							$sql="select * from class";	$rs=mysql_query($sql);	$info=array();	while($row=mysql_fetch_assoc($rs)){		$info[]=$row;	}?><!doctype html><html>	<head>		<title>查询学生信息</title>		<meta http-equiv="content-type" content="text/html;charset=utf-8"/>		<style type="text/css">				</style>		<script type="text/javascript">			var xmlhttprequest;;			function getMessage(){								if(window.ActiveXObject){					xmlhttprequest=new ActiveXObject("Microsoft.XMLHTTP");				}else{					xmlhttprequest=new XMLHttpRequest();				}								if(xmlhttprequest){					var url="result.php";					var cid=document.getElementById("class").value;					//window.alert(cid);					var show=document.getElementById("info");					//window.alert(show);					var data="class="+cid;					//window.alert(data);					xmlhttprequest.open("post",url,true);					xmlhttprequest.setRequestHeader("content-type","application/x-www-form-urlencode");					xmlhttprequest.onreadystatechange=function(){						if(xmlhttprequest.readyState==4){							if(xmlhttprequest.status==200){								var info=xmlhttprequest.responseText;								if(info==""){									show.innerHTML="你好,你查询的班级暂时还没有学生";								}else{									show.innerHTML=info;								}							}						}else{							window.alert("error");						}					}					xmlhttprequest.send(data);				}			}		</script>	</head>	<body>		<div id="content">			<h1>				请选择班级:				<select name="class" id="class" onchange="getMessage()">					<option value="" selected>choose class</option>					<?php foreach($info as $v){?>					<option value="<?php echo $v['cid'];?>"><?php echo $v['cname'];?></option>					<?php }?>				</select>			</h1>			<div id="info">aaa</div>		</div>	</body></html>
登录后复制


下拉列表的值通过js取到了,我用window.alert(data)调试的时候没有问题
但是在result.php中通过$class=$_POST['class']取值的时候$class没有被赋值,因为我通过file_put_contents("D:/WWW/PHPDemo/log.log",$class."\r\n",FILE_APPEND);把$class的值保存在log.log文件中,但我运行后
打开时这个文件为空,且运行报错,说:Notice: Undefined index: class in D:\WWW\dbDesign\project\result.php on line 5
我想问下我的ajax通过POST传值的 方式有错误吗??
<?php	//header("content-type:text/html;charset=utf-8");	header("Content-type:text/xml;charset=utf-8");	header("Cache-Control:no-cache");	$class=$_POST['class'];		file_put_contents("D:/WWW/PHPDemo/log.log",$class."\r\n",FILE_APPEND);			mysql_connect("localhost","root","root") or die("数据库连接失败");	mysql_select_db("studentmanage");	mysql_query("set names utf-8");	$sql="select * from student where cid='$class'";	//$sql="select * from student where cid=3";	$rs=mysql_query($sql);	$info=array();	while($row=mysql_fetch_assoc($rs)){		$info[]=$row;	}		$result="<table><tr><td>学号</td><td>姓名</td><td>住址</td><td>班级</td></tr>";	foreach($info as $v){		$result.="<tr><td>{$v['sid']}</td><td>{$v['name']}</td><td>{$v['address']}</td><td>{$v['cid']}</td></tr>";	}	$result.="</table>";	echo $result;?>
登录后复制

问题就是没有把值传到result.php里面去,,,为什么呢,,一直没找到问题出在哪

xmlhttprequest.setRequestHeader("Content-Type","application/x-www-form-urlencode");

xmlhttprequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

最后少写了一个d

我能说我是一行行代码仔细看仔细看才找到错误的么=====
不知道有什么js调试工具能调试出这种错误,就不用这么费时间找BUG了。。。。

做程序员千万不能粗心,以此共勉

为什么不用jquery呢?

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script><script type="text/javascript">var cid=document.getElementById("class").value;var show=document.getElementById("info");$.post("result.php", { class: cid },   function(info){     if(info==""){       show.innerHTML="你好,你查询的班级暂时还没有学生";     }else{       show.innerHTML=info;     }   },"text");</script>
登录后复制
登录后复制


http://api.jquery.com/jQuery.post/

为什么不用jquery呢?

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script><script type="text/javascript">var cid=document.getElementById("class").value;var show=document.getElementById("info");$.post("result.php", { class: cid },   function(info){     if(info==""){       show.innerHTML="你好,你查询的班级暂时还没有学生";     }else{       show.innerHTML=info;     }   },"text");</script>
登录后复制
登录后复制


http://api.jquery.com/jQuery.post/



js才入门,我js基础很差的,我想把js基础打好点再用框架
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!