ajax向servlet提交数据,并返回结果,关于实现异步刷新问题
各位大神,是这样的,小弟初接触ajax,还不知道轻重,但由于手头工作需要,先在解决实际问题重要,恶补来不及了,请各位帮帮忙。
我在写一个考勤系统。当前用户登陆后,在页面点击查看个人考勤情况的导航,出现页面,用户选择后,比如说选择2012年12月的考勤状况,点击查询以查询信息。
现在用ajax将选择的数据提交到后台的servlet,进行处理,在数据库中查询后将结果放回到前台jsp页面并以表格显示。
现在的问题出现了:
以及有了前台的jsp页面,也有了后台的servlet相应的处理方法。
jsp页面:index.jsp
servlet: package servlet.chap;
public class ChaxunServlet extends HttpServlet{}
由于ajax不是甚解;其主要问题详细写在下面:
javascript代码:
<script type="text/javascript">
var xmlhttp;
var name;
var title;
var department;
var deleteID;
var EMP_PREFIX="emp-";
function creatXMLHttpRequest()
{
if(window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else if(window.ActiveXObject){
xmlhttp=new ActiveXObject("Microsoft.XMLHttp");
}
}
function addEmployee()
{
name=document.getElementById("name").value;
title=document.getElementById("title").value;
department=document.getElementById("dep").value;
action="add";
if(name=""||title=""||department=""){
return ;
}
var url="ajaxbook/chap4/EmployeeListServlet?EmployeeList="+new Date().getTime();//重点就是这个url的写法。。。真心不会写,也不知道有什么规则。相对路径和绝对路径肿么写。。另外,还需要在web.xml中进行相应的配置么?如果要配置,该肿么配置呢。。。。新手真心不会啊。。。谢谢各位大神了。。。。最后一个疑问,这样的话再servlet中如何接收传过来的数据呢。。。。。。在线等各位的回复。。。先塞塞了。。
createXMLHttpRequest();
xmlhttp.onreadystatechange=handleAddStateChange;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
xmlhttp.onreadystatechange=function (){
var ready=xmlhttp.readyState;
if(ready==4){
对返回的结果如何显示的处理.....
};
}
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$.ajax({url:"ajaxbook/chap4/EmployeeListServlet",cache:false,
data:{
action:"add",
name:$(#name).val(),
title:$(#title).val(),
dep:$(#dep).val()
},success:function(data){
alert(data)
}});
</script>
if(ready==4){
对返回的结果如何显示的处理.....
};
1.你到底要用哪个回调函数?
2.如果用后面那个,请把它放到send前面。
3.少了一个结束大括号,不知道是你复制的时候少了,还是本来就少了。
[解决办法]
建议用以下方法来做,不过要用jquery框架哦;实在方便
$.ajax({
type: "GET",
url: "php文件",
dataType: "html /JSON等格式",//**注意:不能用JSON,因为返回的是HTML格式
data: {content:content,formname:nameofform},//{}这样写就是Json数据;
error:function(e){
alert("error occured");//有错误时候会弹出该信息;
},
success: function(msg){}
});