首页 > 编程 > .NET > 正文

用.Net实现基于CSS的AJAX开发(2)

2024-07-10 13:12:45
字体:
来源:转载
供稿:网友

       好了,完成删除,,那么所有对应这个业务的删除都可以由命名为dgbigclassmanage的某一元素通过绑定delbtn样式来执行删

  除(当然,这样不科学,不过是demo嘛,如果是实际你可以在querystring里多传一个参数,在到ajaxdelrow派发后再用进行二次派发,然后以这个参数做标识就完美了)由于麻烦,,有兴趣的自己做吧。。 呵呵。
  
  这个样式只依赖table元素,所以datagrid、datalist、自己做的table,自定义控件只要最后生成table元素的控件都可以用。
   主要提供一个思想,跟代码制作的好坏无关。在.net里轻量地使用样式绑定,在有ajax应用的开发中效果很棒。你也可以自己去实现一个更优秀的轻量框架了。
  
  增删改、上下移动记录样式绑定的js:
  
   /**//**
   * written by wangzhongyuan
   *
   * 这是一个样式驱动的功能按钮控制脚本,样式用法如下:
   *
   * 修改按钮样式: editgtn 应用样式后即可把目标元素变为修改按钮,目标行变为修改行并出现确定、取消按钮。
   * 删除按钮样式: delbtn 应用样式后即可把目标元素变为删除按钮,点击删除则目标删除。
   * 上移下移按钮样式: updownbtn 应用样式后即可把目标元素变为上移、下移元素,目标行变为可上移和下移。
   *
   * 其他需要样式正在制作中........
   **/
  var crudbtn = ...{
   that: false,
   isodd: false,
   lastassignedid : 0,
   addbtnid : 0,
   newrows: -1,
   init : function() ...{
   // 首先, 查看浏览器是否能执行此脚本(有些浏览器不能用getelementsbytagname)
   if (!document.getelementsbytagname) ...{
   return;
   }
  
   this.that = this;
  
   this.run();
  
   },
   /**//**
   * 遍历document中的所有table,如果有样式crudtable,则应用此脚本
   *
   **/
   run : function() ...{
   var tables = document.getelementsbytagname("table");
  
   for (var i=0; i < tables.length; i++) ...{
   var thistable = tables[i];
  
   if (css.elementhasclass(thistable, 'crudtable')) ...{
   this.makecrudtable(thistable);
   }
   }
   },
   /**//**
   * 构建控制按钮
   **/
   makecrudtable : function(table) ...{
  
   // 首先, 检测table是否有id,如果没有则创建
   if (!table.id) ...{
   table.id = 'crudtable'+this.lastassignedid++;
   }
   // 遍历表格的数据行
   var newrows = new array();
   // 遍历表格所有数据行
   for (var j = 0; j < table.tbodies[0].rows.length-1; j++) ...{
   // 遍历数据行所有列
   for(var k = 0;k < table.tbodies[0].rows[j+1].cells.length;k++) ...{
   // 判断是否存在删除样式,如果存在则把该单元个转化为删除按钮
   if(css.elementhasclass(table.tbodies[0].rows[j+1].cells[k], 'delbtn')) ...{
   table.tbodies[0].rows[j+1].cells[k].id = 'delbtn'+this.addbtnid ++;
   var linkel = createelement('a');
   linkel.href = '#';
   linkel.onclick = this.delrow;
   linkel.setattribute('columnid', k);
  
   var innerels = table.tbodies[0].rows[j+1].cells[k].childnodes;
  
   linkel.innertext = "删除";
   table.tbodies[0].rows[j+1].cells[k].appendchild(linkel);
   }
   // 判断是否存在修改样式,如果存在则把该单元个转化为修改按钮
   if(css.elementhasclass(table.tbodies[0].rows[j+1].cells[k], 'editbtn')) ...{
   table.tbodies[0].rows[j+1].cells[k].id = 'delbtn'+this.addbtnid ++;
   var linkel = createelement('a');
   linkel.href = '#';
   linkel.onclick = this.editrow;
   linkel.setattribute('columnid', k);
  
   var innerels = table.tbodies[0].rows[j+1].cells[k].childnodes;
  
   linkel.innertext = "修改";
   table.tbodies[0].rows[j+1].cells[k].appendchild(linkel);
   }
   // 判断是否存在上移、下移样式,如果存在则把该单元个转化为上移、下移按钮
   if(css.elementhasclass(table.tbodies[0].rows[j+1].cells[k], 'updownbtn')) ...{
   table.tbodies[0].rows[j+1].cells[k].id = 'updownbtn'+this.addbtnid ++;

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表