Javascript 如何仅捕获多行中用户已更改值的列？

在ASP.NET或JavaScript中，是否有任何方法可以让我只在用户更新了特定列的行上运行更新存储过程

例如：如果有多行

row1= [column1 column2 column3 column4 coumn 5]
row2= [column1 column2 column3 column4 coumn 5]
row3= [column1 column2 column3 column4 coumn 5]
row4= [column1 column2 column3 column4 coumn 5]

如果列2和列3在第1行中更新，列1和列4在第3行中更新，我只想捕获这些行和列，并将其作为JSON字符串传递给列表，然后将其转换为DataTable

我应该采取什么方法

我所尝试的：

---

谷歌搜索了一些样本，但专家意见总是最好的

有一种非常复杂的方法来实现这一点。如果有人知道更干净的方法，请张贴

您需要执行以下操作：

添加到您的模型中： -将被隐藏并用作更改标识符的布尔属性（列）

在视图中这样设置表（我的示例是Razor）：

@{
int j=1；
对于（var i=0；imodel.itemList[i].columnOne，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.TextBoxFor（model=>model.itemList[i].columnTwo，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.TextBoxFor（model=>model.itemList[i].columnThree，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.TextBoxFor（model=>model.itemList[i].columnFour，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.TextBoxFor（model=>model.itemList[i].columnFive，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.HiddenFor（model=>model.itemList[i].IsChanged）
j++；
}

一旦有人更改某行的字段，JavaScript函数就会编辑隐藏元素：

function rerunOldChange(rowIndex, changeIndex) {
    var table = document.getElementById("changeTable");
    var j = rowIndex;
    var i = changeIndex;

    var currentRow = table.rows[j];
    var cellSix = currentRow.cells[5];

    var thisRowIsChanged = "<input type = 'hidden' id = 'itemList_" + i + "__IsChanged' name = 'itemList[" + i + "].IsChanged' value = 'true' />"

    cellSix.innerHTML = thisRowIsChanged;
}

函数重新运行更改（行索引，更改索引）{
var table=document.getElementById（“变更表”）；
var j=指数；
var i=变动指数；
var currentRow=表.行[j]；
var cellSix=当前行。单元格[5]；
var thisRowIsChanged=“”
cellSix.innerHTML=此行已更改；
}

---

它所做的是在有人按下该字段上的键时立即更改布尔值。因此，当您将列表传递给控制器以便发布时，您只能对布尔值为True的行执行此操作。

有一种非常复杂的方法来实现此目的。如果有人知道更干净的方法，请发布it

您需要执行以下操作：

添加到您的模型中： -将被隐藏并用作更改标识符的布尔属性（列）

在视图中这样设置表（我的示例是Razor）：

@{
int j=1；
对于（var i=0；imodel.itemList[i].columnOne，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.TextBoxFor（model=>model.itemList[i].columnTwo，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.TextBoxFor（model=>model.itemList[i].columnThree，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.TextBoxFor（model=>model.itemList[i].columnFour，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.TextBoxFor（model=>model.itemList[i].columnFive，新的{onkeypress=“markAsChanged（“++@j+”，“++@i+”）}）
@Html.HiddenFor（model=>model.itemList[i].IsChanged）
j++；
}

一旦有人更改某行的字段，JavaScript函数就会编辑隐藏元素：

function rerunOldChange(rowIndex, changeIndex) {
    var table = document.getElementById("changeTable");
    var j = rowIndex;
    var i = changeIndex;

    var currentRow = table.rows[j];
    var cellSix = currentRow.cells[5];

    var thisRowIsChanged = "<input type = 'hidden' id = 'itemList_" + i + "__IsChanged' name = 'itemList[" + i + "].IsChanged' value = 'true' />"

    cellSix.innerHTML = thisRowIsChanged;
}

函数重新运行更改（行索引，更改索引）{
var table=document.getElementById（“变更表”）；
var j=指数；
var i=变动指数；
var currentRow=表.行[j]；
var cellSix=当前行。单元格[5]；
var thisRowIsChanged=“”
cellSix.innerHTML=此行已更改；
}

---

它所做的是在有人按下该字段上的某个键时立即更改布尔值。因此，当您将列表传递给控制器以便发布时，您只能对布尔值为True的行执行此操作。

我将对@C Murphy的响应进行一些更新和简化，但在viewmod中设置一个隐藏字段el是最好的选择。我建议使用复选框，因为默认情况下它是布尔值，并且易于使用其

checked

属性进行操作

和不会触发所有键-特别是，Backspace键和Delete键不会触发它，因此有人可以删除字段中的所有内容，而不会发生更新。相反，使用

keydown

事件；这会产生某种相反的效果，因为每个键都会触发它，包括Shift键和其他可能不会实际更改字段的键字段。如果需要，可以验证其他代码中的更改

我删除了检查每列更改的代码，因为我假设您的更新逻辑要求所有对象的数据，或者EF可能期望传递整个对象

剃刀：

//一个文本字段，更改PropertyName并在标记中添加所需的位置
@Html.TextBoxFor（model=>model.itemList[i].PropertyName，新的{onkeydown=“markAsChanged（“+i+”）}）
//IsChanged属性的隐藏复选框
@Html.CheckBoxFor（model=>model.itemList[i].PropertyName，新的{hidden=”“}）

Javascript：

//现代浏览器
var markAsChanged=函数（i）{
document.GetElementById（'itemList'+i+'\uu-IsChanged'）。checked=true；
};
//用于jQuery的旧版支持
var markAsChanged