欢迎您访问我爱IT技术网,今天小编为你分享的javascript教程:【ajax异步刷新实现更新数据库】,下面是详细的讲解!
ajax异步刷新实现更新数据库
上篇文章都是关于界面的东西,下面写关于如何把无刷新的把数据写入到数据库中。
当我们改变某一个人或某几个人的某项分值实现无刷新写入数据库。
首先,我们需要声明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异步刷新实现更新数据库的用户互动如下:
相关问题:ajax页面异步刷新
答:使用ajax 啊,100%满足你的需求! 下面我提供一个异步请求源代码给你 js中: function isExist() { var companyName = $("#company").val(); if(companyName==""){ alert("'所属公司'不能为空!"); $("#company").focus(); return; } var num = 0... >>详细
相关问题:如何实现ajax异步请求,要访问数据库的那种
答:换班级的select框写个onchange函数,在里面通过ajax访问后台,根据结果更新班级人数的值 >>详细
相关问题:AJAX 异步刷新 IE中只显示第一次的数据,为什么不更新
答:你获取的数据被缓存了。。。你改用post就可以了。。或者把你的url改成 'zx.aspx?id=' + p.value+‘&date='+new Date()。。。。 >>详细
- 【Array】js中更短的 Array 类型转换-类型转换
- 【ExtJs】ExtJs 表单提交登陆实现代码-表单提交-
- 【Ajax】jQuery 学习第六课 实现一个Ajax的TreeVi
- 【extjs】extjs每个组件要设置唯一的ID否则会出错
- 【bootstrap3】基于bootstrap3和jquery的分页插件
- 【hover】jQuery控制图片的hover效果(smartRollo
- 【ajax更新数据库】ajax异步刷新实现更新数据库-
- 【div】div浮层 滚动条移动 位置保持不变的4种方
- 【Cookie】Cookie 小记
- 【arguments】JavaScript的arguments对象应用示例
- 评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
-
