ajax异步刷新实现更新数据库


Posted in Javascript onDecember 03, 2012

上篇文章都是关于界面的东西,下面写关于如何把无刷新的把数据写入到数据库中。
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条数据,写入数据库需要三秒钟,而抛过来的时间是非常快的,可能就零点几秒,所以用户的感觉会非常好,他不需要在选中后等半天才能继续执行。
Javascript 相关文章推荐
让你的博客飘雪花超出屏幕依然看得见
Jan 04 Javascript
javaScript NameSpace 简单说明介绍
Jul 18 Javascript
基于iframe实现类似于ajax的页面无刷新
May 31 Javascript
Jquery仿IGoogle实现可拖动窗口示例代码
Aug 22 Javascript
jQuery+AJAX实现遮罩层登录验证界面(附源码)
Sep 13 Javascript
jQuery判断浏览器并动态调整select宽度的方法
Mar 02 Javascript
js控制TR的显示隐藏
Mar 04 Javascript
javaScript知识点总结(必看篇)
Jun 10 Javascript
jQuery Pagination分页插件使用方法详解
Feb 28 Javascript
原生js封装添加class,删除class的实例
Nov 06 Javascript
解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题
Sep 27 Javascript
JavaScript事件循环及宏任务微任务原理解析
Sep 02 Javascript
JavaScript代码复用模式实例分析
Dec 02 #Javascript
JSONP 跨域访问代理API-yahooapis实现代码
Dec 02 #Javascript
script标签属性type与language使用选择
Dec 02 #Javascript
JavaScript中valueOf函数与toString方法深入理解
Dec 02 #Javascript
json对象转字符串如何实现
Dec 02 #Javascript
javascript 构造函数强制调用经验总结
Dec 02 #Javascript
js精度溢出解决方案
Dec 02 #Javascript
You might like
php 变量未定义等错误的解决方法
2011/01/12 PHP
PHP输入输出流学习笔记
2015/05/12 PHP
CodeIgniter使用smtp服务发送html邮件的方法
2015/06/10 PHP
PHP反射API示例分享
2016/10/08 PHP
php封装的smartyBC类完整实例
2016/10/19 PHP
Laravel中Facade的加载过程与原理详解
2017/09/22 PHP
PHP实现通过strace定位故障原因的方法
2018/04/29 PHP
js字符编码函数区别分析
2008/06/05 Javascript
jQuery 树形结构的选择器
2010/02/15 Javascript
js实现的GridView即表头固定表体有滚动条且可滚动
2014/02/19 Javascript
jQuery的观察者模式详解
2014/12/22 Javascript
详解Javascript模板引擎mustache.js
2016/01/20 Javascript
js实现微博发布小功能
2017/01/12 Javascript
nginx+vue.js实现前后端分离的示例代码
2018/02/12 Javascript
[48:53]2014 DOTA2华西杯精英邀请赛 5 25 LGD VS VG第一场
2014/05/26 DOTA
python下函数参数的传递(参数带星号的说明)
2010/09/19 Python
跟老齐学Python之有容乃大的list(2)
2014/09/15 Python
Python检测字符串中是否包含某字符集合中的字符
2015/05/21 Python
Python3实战之爬虫抓取网易云音乐的热门评论
2017/10/09 Python
python实现读Excel写入.txt的方法
2018/04/29 Python
解决python测试opencv时imread导致的错误问题
2019/01/26 Python
python简单实现AES加密和解密
2019/03/28 Python
BookOutlet加拿大:在网上书店购买廉价折扣图书和小说
2018/10/05 全球购物
北欧最好的童装网上商店:Babyshop
2019/09/15 全球购物
化妆品店促销方案
2014/02/24 职场文书
企业承诺书怎么写
2014/05/24 职场文书
水污染治理工程专业自荐信
2014/06/21 职场文书
2014乡镇干部纪律作风整顿思想汇报
2014/09/13 职场文书
干部作风建设个人剖析材料
2014/10/11 职场文书
群众路线表态发言材料
2014/10/17 职场文书
二手车交易协议书标准版
2014/11/16 职场文书
2014年客房服务员工作总结
2014/11/18 职场文书
考试作弊检讨书范文
2015/01/27 职场文书
2015年音乐教师个人工作总结
2015/05/20 职场文书
利用 Python 的 Pandas和 NumPy 库来清理数据
2022/04/13 Python
Python循环之while无限迭代
2022/04/30 Python