为一个表中的选定行设置唯一ID以存储在localStorage中

我有一个窗口，它具有下拉列表和一个HTML表格，其中根据在下拉列表中进行的选择来填充表格行。一旦表填充完毕，用户点击每一行进行选择并点击“确定”按钮。用户也可以根据需要选择三行中的两行。为一个表中的选定行设置唯一ID以存储在localStorage中

$('.ok').bind('click', function() { 
    if (somecondition) { 
     //some process 
    } 
    $("#selectedTblDiv tr:selected").each(function(index,row) { 
     fnMatch($(row).find(("td:first").html())); 
     localStorage.setItem("test-" + index, $(row).find(("td:first").html())); 
    }); 
    fnDialogClose(); 
});

这里我已存储的每一行的第一个元素中的localStorage具有唯一ID：一旦“OK”按钮被点击我使用下面的代码，并且还预成型件的一些动作如下存储在localStorage的选择的行。虽然我在检索页面刷新同我做了以下过程：

function fnDisplay() { 
    //some code to open dialog 
    for (var i = 0; i < localStorage.length; i++) { 
     //some code and process 
     var $select = $("#list_button"); 
     for (var j = 0; j < localStorage.length; j++) { 
      if (localStorage.getItem("test-" + j)){ 
       var t = localStorage.getItem("test-" + j); 
       if (t == prevIDs) { 
        $("#list_button > option").each(function() { 
         if (this.text == prevIDs) { 
          $(this).remove(); 
         } 
        }); 
        $('<option>').text(prevIDs).attr("disabled", true).appendTo($select); 
       } 
      } 
     } 
    } 
}

这里基本上fnDisplay（）打开一个窗口，一些过程下拉列表中填充。并从列表中选择用户选择，并将详细信息填充到HTML表格中。“确定”选项可执行一些操作，并将用户选择的表格存储在localStorage中。

再次，当用户打开窗口时，下拉菜单中的项目被禁用，这些项目先前已从表中选择。但是没有从下拉菜单中选择的项目仍然可以选择。

我的问题是：

下拉列表中有

10023 
10024 
10025

用户选择10023和10024，以便HTML表格填入如下：

HTML表格

vehID Name Place  Summary 
----- ---- -----  ------- 
10023 car  blore 4-wheeler 
10024 bike pune  2 wheeler

现在用户选择行10023和10024并点击“确定”。现在窗口关闭并重新打开，所以我的下拉看起来followss

10023 //disabled 
10024 //disabled 
10025 //enabled

和我的HTML表是空的。

现在用户有条款选择未选择的值。即10025 现在选择10025并填充HTML，并单击相同的行选择和“确定”按钮。现在，当用户重新加载窗口，我希望所有选项在下拉菜单中被禁用，因为所有选项都被选中。但由于localStorage基于行选择，因此在选择新值时覆盖存储的值。尽管我已经给出了每行的唯一ID，但是

localStorage.setItem("test-"+index,somethin);

当选择新行时，索引的值再次设置为0。所以，我的下拉列表看起来像这样

10023 //enabled 
10024 //disabled 
10025 //disabled

因此，这里是10025上覆盖10023.如何通过提供一个唯一的ID给每个解决这个问题？

来源

2014-09-03 user3201640

你的第一JS码块被破坏（缺少'）后''” .ok''并且也是'}）;'在端部）和非常杂乱。请使用http://jsbeautifier.org/使这更容易阅读 – CodingIntrigue 2014-09-03 08:43:08

是的所有都是输入错误。对不起，现在已完成更改。 – user3201640 2014-09-03 08:45:53

您是否意识到您发布的代码充满了语法错误？一个工作演示例如[jsfiddle]（http://jsfiddle.net）将有助于那些试图帮助你。 – 2014-09-03 08:50:25

问题是，您要分别保存每个选定的项目，导致现有项目在添加新项目时被覆盖。您可以在localStorage中存储一组物品。当您添加新项目时，您可以检索数组并将新项目推入该项目。沿着下面的内容：

var items = JSON.parse(localStorage.getItem("items")) || []; 
$("#selectedTblDiv tr:selected").each(function (index, row) { 
    items.push($(row).find(("td:first").html())); 
}); 
localStorage.setItem("items", JSON.stringify(items));

来源

2014-09-03 08:57:37

太棒了！有效。万分感谢。 – user3201640 2014-09-04 05:02:11

为一个表中的选定行设置唯一ID以存储在localStorage中

回答

相关问题