用.Net實現基於CSS的AJAX開發(2)

       好了，完成刪除，，那麼所有對應這個業務的刪除都可以由命名為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 ++;