Question

我有一个Javascript对象，基本上代表.NET GridView中的一行。当用户单击网格中的任何行时，该行中的所有输入元素都将“启用”。（即“编辑”模式）。

我根据选择的行运行此代码

$(":input", this._row).attr('disabled', true);
or
$(":input", this._row).removeAttr('disabled');

到目前为止一切顺利。现在，我希望在用户进入“编辑模式”之前跟踪该行中的值，因此如果他们决定点击该行而不保存他们所做的任何更改，我可以恢复原始值。

所以我通过这样做捕获数组中的原始值：

var $inputs = $(":input", this._row);
var values = {}; 
$inputs.each(function(i, el) { values[el.name] = $(el).val(); });

'values'数组现在看起来像这样：

ctl00$ContentPlaceHolder1$resultsGrid$ctl04$COMPONENT1    "56"  
ctl00$ContentPlaceHolder1$resultsGrid$ctl04$COMPONENT2    "98"  
ctl00$ContentPlaceHolder1$resultsGrid$ctl04$COMPONENT3        "08"
ctl00$ContentPlaceHolder1$resultsGrid$ctl04$COMPONENT4    "200"

到目前为止很棒。然后，用户可以修改这些值，但决定不保存更改。所以我需要将这一行恢复回'values'数组中的orignal值。有人能告诉我最好的方法吗？我希望它很简单，但我不是jquery专家，但是......

感谢

Answer 1

您可以使用'数据方法'（http://docs.jquery.com/Internals/jQuery.data）将相关数据与元素一起存储。

类似的东西：

//Call this function for each row after the page has loaded. 
function storeOriginalData(row)
{        
    var $inputs = $(":input", row);
    //For each input element inside the table row, we store it's original value 
    //using the 'data' method of jQuery.
    $inputs.each(function(i, el) { $(el).data('oldValue', el.val()); });    
}

//Call this function from the reset button code. 
function resetOriginalData(row)
{
    var $inputs = $(":input", row);
    //Now we get the original value using the data method and store it in the input element.
    $inputs.each(function(i, el) { $(el).val($el.data('oldValue')); 
};

这样，您将避免维护每行的'values'对象。

编辑：

修改后的代码，包含更多详细信息及其工作原理。

Answer 2

我没有时间设置测试，但是我会尝试一下：

$ inputs.each（function（i，el）{$（el）.val（values [el.name]）;}）;

假设您已经检查过已存储的值。

Answer 3

你能否复制行html并存储它，然后如果他们改变了那么你可以恢复原来的行吗？

使用JQuery将“脏”元素设置回原始值

3 个答案: