如何創建一個動態和唯一的行數值在html表格中更改的數組

Question

我有一個動態的html表格，其中每行都有不同的行構建 一組特定的字段，如文本框，我有一個更新所有的按鈕修改後的 行。能夠跟蹤哪一行已更改，哪裏我們將獲得已更改的行號

如何創建表格中正在更改的所有行號的動態數組 如何創建格式對於已更改的行值併發送到服務器進行更新

 var m = 0; 
     var changedrows = {}; 
     $.each($('input[id*=mid_],select[id*=mse_]')).live('change',function(m){ 
      var num= $(this).parent().html()*1; // Able to get the row number correctly 
      alert("changed row is"+num);  
      changedrows[m] = {row:num};   
      m++;      
     }); 

如何創建動態且唯一的數組。

Answer 1

您可以利用表單域的defaultValue和defaultSelected屬性。首先，找到所有那些defaultValue從value不同的輸入：

var changedFields = $("input[id*=mid]").filter(function() { 
    return this.defaultValue != this.value; 
}); 

然後，找到所有的列表框，其defaultSelected從當前選擇的區別：

changedFields.add($("select[id*=mse_]").filter(function() { 
    return !this.options[this.selectedIndex].defaultSelected; 
})); 

注意的是，如果沒有<option>有selected屬性，所有選項都將具有defaultSelected爲假。你可以解決的一個方法是找到默認選項。默認選項是0123'爲真的最後一個選項，如果沒有選項，則默認選項將是第一個選項。

changedFields.add($("select[id*=mse_]").filter(function() { 
    var defaultOption = $("option", this).filter(function() { 
     return this.defaultSelected; 
    }); 
    defaultOption = defaultOption.length ? defaultOption.last()[0] : this.options[0]; 
    return this.options[this.selectedIndex] != defaultOption; 
})); 

然後，找到自己的父行：

var changedRows = changedFields.closest("tr"); 

然後，使用.map()得到行排索引數組：現在

var changedRowIndexes = changedRows.map(function() { 
    return $(this).index(); 
}).get(); 

，changedRowIndexes是數字數組用一個已經改變的輸入元素來指示每一行的索引。

您發送更改到服務器之後，它可能是一個好主意，更新您輸入的defaultValue：

changedFields.filter("input").each(function() { 
    this.defaultValue = this.value; 
}); 
changedFields.filter("select").each(function() { 
    $("option", this).each(function() { 
     this.defaultSelected = false; 
    }); 
    this.options[this.selectedIndex].defaultSelected = true; 
}); 

Answer 2

我會嘗試大致如下（未經測試）代碼的東西線：

var changedrows = []; // Use an array 

$('#yourtableid').on('change', 'input[id*=mid_],select[id*=mse_]', function() { 
    var num = $(this).closest('tr').index(); 
    if(changedrows.indexOf(num) == -1) { 
     changedrows.push(num); 
    } 
}); 

Answer 3

，你已經擁有更改的行的數組。

現在，當您要提交表單時，請循環訪問您的數組，然後使用serialize()將每個更改的行轉換爲查詢字符串。

每個查詢字符串都以「？」開頭，字符，所以你需要使用substring（）來處理它。您可以使用$.post將數據提交給服務器。