Posted in Javascript onDecember 03, 2012
上篇文章都是关于界面的东西,下面写关于如何把无刷新的把数据写入到数据库中。
当我们改变某一个人或某几个人的某项分值实现无刷新写入数据库。
首先,我们需要声明XMLHttpRequest对象
//声明XMLHttpRequest对象 var xmlHttp; function createXMLHTTP() { if (window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); //Mozilla浏览器 } else if (window.ActiveXObject) { try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); //IE老版本 } catch (e) { } try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); //IE新版本 } catch (e) { } if (!xmlHttp) { window.alert("不能创建XMLHttpRequest对象实例!"); return false; } } }
同时,需要回调函数来确定是否修改成功
//更新或者添加记录的回调函数(检验是否评分成功) function ModifyScore () { if (xmlHttp.readyState == 4) { // if (xmlHttp.status == 200) { if (xmlHttp.responseText == "true") { } else { // alert("评分失败,请重新评分或者与管理员联系"); } } } }
准备工作完成之后,下面就是关键的一步:
因为需要在修改分值的时候写入数据库,所以只需要在上篇博客中提高的改变下拉框值(循环选中项时)的执行这样一段代码:
//获取互评ID var criticsID = checkbox[i].value; //把修改值写入数据库 //获取项目分数 var scoreAll = document.getElementById("score" +checkbox[i].value + srcElem.id + ""); var accessAllScore = scoreAll.outerText; //获取项目编号 var assess = document.getElementById("assess" + srcElem.id); var assessID = assess.title; createXMLHTTP(); //创建XMLHttpRequest对象 //把数据传入到另一个页面执行 var url = "CriticsAgainAjax.aspx?criticsID=" + criticsID +"&assessID=" + assessID + "&accessAllScore=" +accessAllScore + "&Event=allCriticsInfo"; xmlHttp.open("Post", url, true); // xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xmlHttp.onreadystatechange = AnswerOneKindQuestion; xmlHttp.send(null);
最后,我们只需要在CriticsAgainAjax.aspx获取参数,并执行写入数据库就可以了
//获取参数 if(Request.QueryString["Event"].ToString() =="allCriticsInfo") { string criticsID = Request.QueryString["criticsID"].ToString(); string assessID = Request.QueryString["assessID"].ToString(); string accessAllScore =Request.QueryString["accessAllScore"].ToString(); }
参数传过来之后,写入数据库就很容易了,这里就不提了。
这样,在前台显示的效果就是没有刷新,时时的把数据写入到数据库。只是把脏活累活都交给CriticsAgainAjax.aspx页面来干,这也是一种不错的分工。
这样写出了少刷新以外,还有另一个好处就是ajax是异步操作,即在js页面中把数据抛到CriticsAgainAjax.aspx之后,他就继续执行,他不考虑CriticsAgainAjax.aspx是否执行完成,可能抛过来100条数据,写入数据库需要三秒钟,而抛过来的时间是非常快的,可能就零点几秒,所以用户的感觉会非常好,他不需要在选中后等半天才能继续执行。
ajax异步刷新实现更新数据库
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@