Javascript无刷新操作数据库记录(增删查改)

原文来自： http://www.ajaxsamples.cn/html/15393.html

        比较无聊，都是用脚本划的table，似乎效率也不怎么好。
        下面的代码是整个用户控件的HTML页面：
        几处 oHttpReq.open( " POST " ,  " Ajax框架.aspx?TypeID=1&RequestID= "   +  RequestID,  false );Ajax框架.aspx页面就是操作数据库页面。
        
        

<% @ Control Language = " C# "  AutoEventWireup = " true "  CodeFile = " ContentFilesList.ascx.cs "  Inherits = " Content_Contorls_ContentFilesList "   %>
< script >
var GetStatus = 0 ; // 当前问题状态
var sumpage = 1 ; // 总页数
var cuurpage = 1 ; // 当前页
var pagecount = null ; // 总记录数量

// 删除表格
function   _delAllRows(tbobj)   
   {   
      var   obj=document.getElementById(tbobj);   
      if   (obj==null||obj.rows==null)   return   false;   
      var   len=obj.rows.length;   
      if   (len==null||len<1)   return   false;   
      for   (var   i=0;   i<len;   i++)   
          obj.deleteRow(0);   
      return   true;   
  }    

function LoadDataList()
{
    _delAllRows("question");
    var oHttpReq = new ActiveXObject("MSXML2.XMLHTTP"); 
    var oDoc = new ActiveXObject("MSXML2.DOMDocument"); 
    
    var RequestID = getargs();
    
    oHttpReq.open("POST", "Ajax框架.aspx?TypeID=1&RequestID=" + RequestID, false); 
    oHttpReq.send(""); 
    result = oHttpReq.responseText; 
    
    if(oHttpReq.readyState==4)
    {
        eval("loading.style.display=\"none\";");
    }
    
    a = new Array(2);
    a=result.split('|爩|');
    oDoc.loadXML(a[0]);//返回的DataSet数据集
    var localurl=a[1];//总记录条数    
    //alert(localurl);
    itemsID = oDoc.selectNodes("//Table/ID"); 
    itemsNewName = oDoc.selectNodes("//Table/NewName"); 
    itemsOldName = oDoc.selectNodes("//Table/OldName"); 
    itemsState = oDoc.selectNodes("//Table/State"); 

    var itemsLength=itemsID.length; 
　　for(i=0;i<itemsLength;i++) //将小类的类名和编号赋予
　　{   //创建表格
　　    newRow=question.insertRow(i);
        newRow.bgColor="#ffffff";
          for (j=0; j < 4; j++) { 
               newCell=newRow.insertCell(j);
       } 
            
           var thisEname = itemsOldName[i].text;
           
           var fileType="";
           if(thisEname.split('.').length>0)
                fileType=thisEname.split('.')[1];
                
           switch(fileType.toLowerCase())
           {
                //类型
                case "doc" : document.all.question.rows(i).cells(0).innerHTML = "<img src=\"../Resource/Images/Default/Icon/fileDoc.gif\"  style=\"border: solid 0 #000;width:16px;height:16px\" />"; break;
                case "ppt" : document.all.question.rows(i).cells(0).innerHTML = "<img src=\"../Resource/Images/Default/Icon/filePpt.gif\"  style=\"border: solid 0 #000;width:16px;height:16px\" />"; break;
                case "jpg" : document.all.question.rows(i).cells(0).innerHTML = "<img src=\"../Resource/Images/Default/Icon/fileJpg.gif\"  style=\"border: solid 0 #000;width:16px;height:16px\" />"; break;
                case "gif" : document.all.question.rows(i).cells(0).innerHTML = "<img src=\"../Resource/Images/Default/Icon/fileGif.gif\"  style=\"border: solid 0 #000;width:16px;height:16px\" />"; break;
                case "txt" : document.all.question.rows(i).cells(0).innerHTML = "<img src=\"../Resource/Images/Default/Icon/fileTxt.gif\"  style=\"border: solid 0 #000;width:16px;height:16px\" />"; break;
                case "rar" : document.all.question.rows(i).cells(0).innerHTML = "<img src=\"../Resource/Images/Default/Icon/buttonTheme.gif\"  style=\"border: solid 0 #000;width:16px;height:16px\" />"; break;
                default:case "rar" : document.all.question.rows(i).cells(0).innerHTML = "<img src=\"../Resource/Images/Default/Icon/fileNone.gif\"  style=\"border: solid 0 #000;width:16px;height:16px\" />"; break;
           }

           document.all.question.rows(i).cells(0).width=16;
           document.all.question.rows(i).cells(0).align="left";
           
           //*
           //获取路径
           var FileUrl='';
           var url=unescape(window.location.href);//获取URL,unescape解析URL字符 
           //var GetfileLinkLength = fileLink.IndexOf("UpLoadFiles");
           var GetFilesLength = url.indexOf("Content");
           //alert(GetFilesLength);
           var fileurl = url.substring(0, GetFilesLength) + "UpLoadFiles/" + itemsNewName[i].text;
           //alert(fileurl);
            //名称
           localurl = localurl + '\UpLoadFiles';
           localurl = localurl + itemsNewName[i].text;
           /**//*
            if(ReportFileStatus(localurl))   
                 alert(1);   
            else     
                 alert(0);    
           */ 
           document.all.question.rows(i).cells(1).innerHTML =
            "<div title="+itemsOldName[i].text+" style=\"overflow:hidden; text-align:left; text-overflow:ellipsis; white-space:nowrap; PADDING-TOP: 1px; PADDING-RIGHT: 1px; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; width:150px;\">"                                       
            +"<a href='"+fileurl+"' style=\"cursor:hand;\" target=\"_blank\" >"+itemsOldName[i].text+" </a>"
            +"</div>";

           document.all.question.rows(i).cells(1).width=150;
           document.all.question.rows(i).cells(1).align="left";
           //*/
           var StateText = itemsState[i].text;
           switch(StateText)
           {
                //类型
                case "0" : document.all.question.rows(i).cells(2).innerHTML = "<a title='当前状态：未审核' style=\"cursor:hand;\" οnclick=\"tracestate("+itemsID[i].text+",1,'审核','"+itemsOldName[i].text+"')\"><font color=black>×</a></font>"; break;
                case "1" : document.all.question.rows(i).cells(2).innerHTML = "<a title='当前状态：已开通' style=\"cursor:hand;\" οnclick=\"tracestate("+itemsID[i].text+",2,'关闭','"+itemsOldName[i].text+"')\"><font color=green>√</a></font>"; break;
                case "2" : document.all.question.rows(i).cells(2).innerHTML = "<a title='当前状态：已关闭' style=\"cursor:hand;\" οnclick=\"tracestate("+itemsID[i].text+",1,'开通','"+itemsOldName[i].text+"')\"><font color=red>⊙</a></font>"; break;
                default :  document.all.question.rows(i).cells(2).innerHTML = "<a title='当前状态：未知' style=\"cursor:hand;\" οnclick=\"tracestate("+itemsID[i].text+",2,'关闭','"+itemsOldName[i].text+"')\"><font color=blue>？</a></font>"; break;
           }
           document.all.question.rows(i).cells(2).width=40;
           document.all.question.rows(i).cells(2).align="left";
          
           document.all.question.rows(i).cells(3).innerHTML = "<a style=\"cursor:hand;\" class=\"ApageLink\" οnclick=\"tracedelete("+itemsID[i].text+",'"+itemsOldName[i].text+"')\">删除</a>";
           document.all.question.rows(i).cells(3).width=50;
           document.all.question.rows(i).cells(3).align="center";
　　}
    
}
 function  ReportFileStatus(filespec)   
  {   
    var   fso,   s   =   filespec;   
    fso   =   new   ActiveXObject("Scripting.FileSystemObject");   
    if   (fso.FileExists(filespec))   
          return true;   
    else     
          return false; 
 }
  
function tracestate(ID,StateID,strTxt,strName)
{
    if(window.confirm('您确认' + strTxt + strName +  '？'))
    {
        var StateReq = new ActiveXObject("MSXML2.XMLHTTP");     
        StateReq.open("POST", "Ajax框架.aspx?TypeID=2&RequestID="+ ID + "&State=" + StateID, false);
        StateReq.send(""); 
        Sresult = StateReq.responseText;

        if(Sresult=="1")
        {
            LoadDataList();
        }
        else
        {
            alert(strTxt + '失败，请稍后再试');
            return;
        }
    }
}

function tracedelete(DeleteID,oldName)
{
    if(window.confirm('您确认删除附件：'+oldName+'？'))
    {
        var DelReq = new ActiveXObject("MSXML2.XMLHTTP");     
        DelReq.open("POST", "Ajax框架.aspx?TypeID=3&RequestID="+ DeleteID, false);
        DelReq.send(""); 
        Dresult = DelReq.responseText;

        if(Dresult=="1")
        {
            LoadDataList();
            var allowCount = document.getElementById("hidFileAllowCount").value;
            alert(allowCount);
            allowCount++;
            alert(allowCount);
            document.getElementById("hidFileAllowCount").value = allowCount;
            document.getElementById('attach').innerText = "继续添加附件";
        }
        else
        {
            alert('删除失败，请稍后再试');
            return;
        }
    }
}

function getargs()
{ 
   var url=unescape(window.location.href);//获取URL,unescape解析URL字符
   var allargs=url.split("?")[1];//获取?后的值
   var args=allargs.split("&");//获取参数数组
   for(var i=0;i<args.length; i++)
   {
     if(args[i].split("=")[0]=="ID")
     
     return args[i].split("=")[1];
     break;
   }
}

window.onload  =  function() {LoadDataList();}   
</ script >
     < table border = " 0 "  align = " left "  cellpadding = " 0 "  cellspacing = " 0 "  width = " 60% " >         
             < tr style = " height:auto; width:98% "  align = " center " >
             < td align = " left " >
                 < table align = " center "  border = " 0 "  cellpadding = " 0 "  cellspacing = " 0 "  style = " width: 100% " >
                     < tr >< td >
                         < div id = " loading " >
                         < img src = " ../Resource/Images/Default/loading.gif "  alt = " 数据加载中，请稍后 "    />& nbsp; </ div >
                     </ td ></ tr >
                     < tr >
                         < td >
                             < table id = " question "  align = " center "  border = " 0 "  cellpadding = " 0 "  cellspacing = " 0 "  width = " 98% " >
                                 < tr >
                                     < td style = " height: auto " >
                                     </ td >
                                 </ tr >
                             </ table >
                         </ td >
                     </ tr >
                 </ table >
                </ td ></ tr >
     </ table >

        Ajax框架.cs 代码
        1、返回数据集：

private   void  GetFileList( string  RequestID)
     {
        if (string.IsNullOrEmpty(RequestID))
        {
            DataSet ds = CommonSqlExec.ExecReturnDataSet("SELECT * FROM Tables WHERE [ID]=" + RequestID, 1);
            string localurl = Request.MapPath("~/");
            //回写DataSet为XML,客户端接收
            XmlTextWriter writer = new XmlTextWriter(Response.OutputStream, Encoding.UTF8);
            writer.Formatting = Formatting.Indented;
            writer.Indentation = 4;
            writer.IndentChar = ' ';
            writer.WriteStartDocument();
            ds.WriteXml(writer);
            writer.Flush();
            Response.Write("|爩|" + localurl);//个人需要加的，可以不要的
            Response.End();
            writer.Close();
        }
    }

        这个就是加载数据的HTML页面： LoadDataList（）方法。。。
        
        2、更改状态

private   void  StateFile( string  RequestID,  string  State)
     {
        bool b = CommonSqlExec.Exec("UPDATE Tables SET State=" + State + " WHERE [ID]=" + RequestID, 1);
        if (b)
        {
            Response.Write("1");
            Response.End();
        }
        else
        {
            Response.Write("0");
            Response.End();
        }
    }

        
        就这么简单。。。

 

 

赵  钱  孙  李  周  吴  郑  王  冯  陈  褚  卫 
蒋  沈  韩  杨  朱  秦  尤  许  何  吕  施  张 
孔  曹  严  华  金  魏  陶  姜  戚  谢  邹  喻 
柏  水  窦  章  云  苏  潘  葛  奚  范  彭  郎 
鲁  韦  昌  马  苗  凤  花  方  俞  任  袁  柳 
酆  鲍  史  唐  费  廉  岑  薛  雷  贺  倪  汤 
滕  殷  罗  毕  郝  邬  安  常  乐  于  时  傅 
皮  卞  齐  康  伍  余  元  卜  顾  孟  平  黄 
和  穆  萧  尹  姚  邵  湛  汪  祁  毛  禹  狄 
米  贝  明  臧  计  伏  成  戴  谈  宋  茅  庞 
熊  纪  舒  屈  项  祝  董  梁  杜  阮  蓝  闵 
席  季  麻  强  贾  路  娄  危  江  童  颜  郭 
梅  盛  林  刁  锺  徐  邱  骆  高  夏  蔡  田 
樊  胡  凌  霍  虞  万  支  柯  昝  管  卢  莫 
经  房  裘  缪  干  解  应  宗  丁  宣  贲  邓 
郁  单  杭  洪  包  诸  左  石  崔  吉  钮  龚 
程  嵇  邢  滑  裴  陆  荣  翁  荀  羊  於  惠 
甄  麴  家  封  芮  羿  储  靳  汲  邴  糜  松 
井  段  富  巫  乌  焦  巴  弓  牧  隗  山  谷 
车  侯  宓  蓬  全  郗  班  仰  秋  仲  伊  宫 
宁  仇  栾  暴  甘  钭  历  戎  祖  武  符  刘 
景  詹  束  龙  叶  幸  司  韶  郜  黎  蓟  溥 
印  宿  白  怀  蒲  邰  从  鄂  索  咸  籍  赖 
卓  蔺  屠  蒙  池  乔  阳  郁  胥  能  苍  双 
闻  莘  党  翟  谭  贡  劳  逄  姬  申  扶  堵 
冉  宰  郦  雍  却  璩  桑  桂  濮  牛  寿  通 
边  扈  燕  冀  僪  浦  尚  农  温  别  庄  晏 
柴  瞿  阎  充  慕  连  茹  习  宦  艾  鱼  容 
向  古  易  慎  戈  廖  庾  终  暨  居  衡  步 
都  耿  满  弘  匡  国  文  寇  广  禄  阙  东 
欧  殳  沃  利  蔚  越  夔  隆  师  巩  厍  聂 
晁  勾  敖  融  冷  訾  辛  阚  那  简  饶  空 
曾  毋  沙  乜  养  鞠  须  丰  巢  关  蒯  相 
查  后  荆  红  游  竺  权  逮  盍  益  桓  公 
万俟  司马  上官  欧阳  夏侯  诸葛  闻人  东方  赫连  皇甫  尉迟  公羊 
澹台  公冶  宗政  濮阳  淳于  单于  太叔  申屠  公孙  仲孙  轩辕  令狐 
钟离  宇文  长孙  慕容  司徒  司空  召  有  舜  叶赫那拉  丛  岳 
寸  贰  皇  侨  彤  竭  端  赫  实  甫  集  象 
翠  狂  辟  典  良  函  芒  苦  其  京  中  夕 
之  章佳  那拉  冠  宾  香  果  依尔根觉罗  依尔觉罗  萨嘛喇  赫舍里  额尔德特 
萨克达  钮祜禄  他塔喇  喜塔腊  讷殷富察  叶赫那兰  库雅喇  瓜尔佳  舒穆禄  爱新觉罗  索绰络  纳喇 
乌雅  范姜  碧鲁  张廖  张简  图门  太史  公叔  乌孙  完颜  马佳  佟佳 
富察  费莫  蹇  称  诺  来  多  繁  戊  朴  回  毓 
税  荤  靖  绪  愈  硕  牢  买  但  巧  枚  撒 
泰  秘  亥  绍  以  壬  森  斋  释  奕  姒  朋 
求  羽  用  占  真  穰  翦  闾  漆  贵  代  贯 
旁  崇  栋  告  休  褒  谏  锐  皋  闳  在  歧 
禾  示  是  委  钊  频  嬴  呼  大  威  昂  律 
冒  保  系  抄  定  化  莱  校  么  抗  祢  綦 
悟  宏  功  庚  务  敏  捷  拱  兆  丑  丙  畅 
苟  随  类  卯  俟  友  答  乙  允  甲  留  尾 
佼  玄  乘  裔  延  植  环  矫  赛  昔  侍  度 
旷  遇  偶  前  由  咎  塞  敛  受  泷  袭  衅 
叔  圣  御  夫  仆  镇  藩  邸  府  掌  首  员 
焉  戏  可  智  尔  凭  悉  进  笃  厚  仁  业 
肇  资  合  仍  九  衷  哀  刑  俎  仵  圭  夷 
徭  蛮  汗  孛  乾  帖  罕  洛  淦  洋  邶  郸 
郯  邗  邛  剑  虢  隋  蒿  茆  菅  苌  树  桐 
锁  钟  机  盘  铎  斛  玉  线  针  箕  庹  绳 
磨  蒉  瓮  弭  刀  疏  牵  浑  恽  势  世  仝 
同  蚁  止  戢  睢  冼  种  涂  肖  己  泣  潜 
卷  脱  谬  蹉  赧  浮  顿  说  次  错  念  夙 
斯  完  丹  表  聊  源  姓  吾  寻  展  出  不 
户  闭  才  无  书  学  愚  本  性  雪  霜  烟 
寒  少  字  桥  板  斐  独  千  诗  嘉  扬  善 
揭  祈  析  赤  紫  青  柔  刚  奇  拜  佛  陀 
弥  阿  素  长  僧  隐  仙  隽  宇  祭  酒  淡 
塔  琦  闪  始  星  南  天  接  波  碧  速  禚 
腾  潮  镜  似  澄  潭  謇  纵  渠  奈  风  春 
濯  沐  茂  英  兰  檀  藤  枝  检  生  折  登 
驹  骑  貊  虎  肥  鹿  雀  野  禽  飞  节  宜 
鲜  粟  栗  豆  帛  官  布  衣  藏  宝  钞  银 
门  盈  庆  喜  及  普  建  营  巨  望  希  道 
载  声  漫  犁  力  贸  勤  革  改  兴  亓  睦 
修  信  闽  北  守  坚  勇  汉  练  尉  士  旅 
五  令  将  旗  军  行  奉  敬  恭  仪  母  堂 
丘  义  礼  慈  孝  理  伦  卿  问  永  辉  位 
让  尧  依  犹  介  承  市  所  苑  杞  剧  第 
零  谌  招  续  达  忻  六  鄞  战  迟  候  宛 
励  粘  萨  邝  覃  辜  初  楼  城  区  局  台 
原  考  妫  纳  泉  老  清  德  卑  过  麦  曲 
竹  百  福  言  第五  佟  爱  年  笪  谯  哈  墨 
南宫  赏  伯  佴  佘  牟  商  西门  东门  左丘  梁丘  琴 
后  况  亢  缑  帅  微生  羊舌  海  归  呼延  南门  东郭 
百里  钦  鄢  汝  法  闫  楚  晋  谷梁  宰父  夹谷  拓跋 
壤驷  乐正  漆雕  公西  巫马  端木  颛孙  子车  督  仉  司寇  亓官 
鲜于  锺离  盖  逯  库  郏  逢  阴  薄  厉  稽  闾丘 
公良  段干  开  光  操  瑞  眭  泥  运  摩  伟  铁 
迮 

 

转载于:https://www.cnblogs.com/armywin/archive/2008/08/31/1280692.html