2010-12-13 54 views
1

我有一個顯示在屏幕上的發票列表。現在,用戶可以選擇或取消選擇一個複選框的發票或更改他們想要支付的金額。發生這種情況時,將彙總並顯示所有發票的總金額。在jquery中修改json集合

這裏的最終目標是跟蹤來自服務器的數組數組。我使用json,因爲它是標準化的。

然後,我有一個隱藏的使用JSON數據,如下所示:

<input id="InvoicingGridRows" name="InvoicingGridRows" type="hidden" 
value="[[{&quot;Value&quot;:&quot;TST-1000&quot;},{&quot;Value&quot;:346.230000}, 
{&quot;Value&quot;:null},{&quot;Value&quot;:null},{&quot;Value&quot;:null}, 
{&quot;Value&quot;:null}], 
[{&quot;Value&quot;:&quot;TST-1001&quot;}, 
{&quot;Value&quot;:126.970000},{&quot;Value&quot;:null},{&quot;Value&quot;:null}, 
{&quot;Value&quot;:null},{&quot;Value&quot;:null}]]" /> 

眼下,數據有很多關於數據空的佔位符。

我想要做的是創建一個JavaScript對象,以便當事件發生在上面導致總結髮生時,我可以啓動有針對性的編輯/刪除/添加。這裏是我迄今所擁有的。

var invoiceRows = function() { 
    var targetControl = ''; 

    var getByInvoiceId = function (invoiceId) { 
     var data = $(targetControl.val()); 

     for (var x = 0; x < data.length; x++) { 
      if (data[x][0].Value == invoiceId) 
       return data[x]; 
     } 

     return null; 
    }; 

    return { 

     init: function (selector, invoices) { 
      targetControl = $(selector); 

      //set up the gridrows to defaulted values 
      targetControl.val(invoices); 
     }, 

     save: function (invoiceId, amount) { 
      var invoiceData = getByInvoiceId(invoiceId); 

      if (invoiceData) { 
       //update 
      } else { 
       //add new 
      } 
     }, 

     remove: function (invoiceId) { 
      //remove row with invoiceid 
     } 

    } 

}(); 

我的問題是我怎麼輕鬆地修改/刪除行以及添加新行到我的JSON對象,然後將其保存回隱藏字段?這甚至可能還是有更好的方法?我接受建議。

回答

1

您可以通過使用eval字符串轉換在隱藏輸入到JavaScript對象:

var dataObj = eval($("#InvoicingGridRows").val()); 

我應該這樣做一次,然後做所有的操作,如刪除此對象。當你準備好將其發送回服務器,將對象轉換回字符串:

var dataStr = JSON.stringify(dataObj); 
$("#InvoicingGridRows").val(dataStr); 

另外,如果你可以修改你的服務器是如何工作的,讓服務器創建一個包含數據的<script>標籤準備好用作javascript對象 - 基本上是隱藏輸入中的字符串,但沒有引用整個事物的引用,並且前面有一個變量賦值。例如。讓您的服務器輸出:

<script type="text/javascript"> 
    var dataObj = {...}; 
</script> 

現在不需要eval()