在jquery中修改json集合

时间:2010-12-13 22:30:33

标签: 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 个答案:

答案 0 :(得分: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()