1

我将如何对具有数据链接到表单元素的子属性的对象进行可观察的更新？

var app = {
    formData: {
        selectedThing: "thingValue1",
        selectedPlace: "placeValue1"
    }
};



$("#btnUpdate").on("click", function(){
    var replacementForm = {
        selectedThing: "thingValue2",
        selectedPlace: "placeValue2"
    }
    $.observable(app).setProperty("formData", replacementForm);
});

$("#content").link(true, app);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://www.jsviews.com/download/jsviews.js"></script>

<div id="content">
    <input data-link="formData.selectedThing trigger=true"/>
    <br/>
    <input data-link="formData.selectedPlace trigger=true"/>
</div>

<button id="btnUpdate" type="button">Update</button>

我有一些输入字段数据链接到对象的属性，当用户按下按钮时，所有这些字段都需要使用对象进行更新（从服务器作为 JSON 接收，反序列化为与数据对象相同的对象表单元素的基础。）这是我的jsfiddle：http: //jsfiddle.net/xpe1ds0a/

4

1 回答 1

0

从https://stackoverflow.com/a/32339038/1054484回答“克隆”

它不起作用的原因是因为您使用的是“深层路径” formData.selectedThing- 默认情况下，它只在叶级别“监听”可观察到的变化，而不是更深层次。要选择监听formData对象的变化，而不仅仅是叶selectedThing属性，您需要替换.by^以指示您想要监听路径中的更深层次：

<input data-link="formData.selectedThing trigger=true"/>
<input data-link="formData.selectedPlace trigger=true"/>

请参阅此文档主题中 的路径：叶子更改或深度更改部分：http: //www.jsviews.com/#observe。

另请参阅本主题中的示例，例如示例：具有普通对象和数组的 JsView ：http : //www.jsviews.com/#explore/objectsorvm。

在这里更新了 jsfiddle：http: //jsfiddle.net/xpe1ds0a/1/

于 2015-11-05T02:02:45.003 回答