加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 编程开发 > asp.Net > 正文

asp.net – KnockoutJS,在ajax调用后更新ViewModel

发布时间:2020-12-15 19:16:06 所属栏目:asp.Net 来源:网络整理
导读:我正在使用Knockout和Knockout Mapping插件. 我的MVC3 Action返回一个View而不是JSON直接将我的Model转换成JSON. 这是一个数据输入表单,由于系统验证的性质全部在服务层中完成,并在ViewModel中的Response对象中返回警告. 初始的绑定和更新正确的工作正是导致
我正在使用Knockout和Knockout Mapping插件.

>我的MVC3 Action返回一个View而不是JSON直接将我的Model转换成JSON.
>这是一个数据输入表单,由于系统验证的性质全部在服务层中完成,并在ViewModel中的Response对象中返回警告.
>初始的绑定和更新正确的工作正是导致我的问题的“后更新”行为.

我的问题是在调用AJAX POST之后,并且接收到我的JSON响应剔除没有更新我的所有绑定…好像可观察/映射已经掉下来

如果我添加了一个额外的ko.applyBindings(viewModel);在成功的事情做的工作…但是问题然后出现与多个绑定,并确定这不是正确的解决方案.

这是HTML / Template / Bindings

<!-- Start Form -->
<form action="@Url.Action("Edit")" data-bind="submit: save">
<div id="editListing" data-bind="template: 'editListingTemplate'"></div>
<div id="saveListing" class="end-actions">
    <button type="submit">Save Listings</button>
</div>
</form>
<!-- End Form -->

<!-- Templates -->
<script type="text/html" id="editListingTemplate">
        <div class="warning message error" data-bind="visible: Response.HasWarning">
            <span>Correct the Following to Save</span>
            <ul>
                {{each(i,warning) Response.BusinessWarnings}}
                    <li data-bind="text: Message"></li>
                {{/each}}
            </ul>
        </div>

        <fieldset>
            <legend>Key Information</legend>
            <div class="editor-label">
                <label>Project Name</label>
            </div>
            <div class="editor-field">
                <input data-bind="value: Project_Name" class="title" />
            </div>            
        </fieldset>        
</script>
<!-- End templates -->

这是Knockout / Script

<script type="text/javascript">
        @{ var jsonData = new HtmlString(new JavaScriptSerializer().Serialize(Model)); }

        var initialData = @jsonData;
        var viewModel = ko.mapping.fromJS(initialData);


        viewModel.save = function () 
        {
            this.Response = null;
            var data = ko.toJSON(this);
            $.ajax({
                url: '@Url.Action("Edit")',contentType: 'application/json',type: "POST",data: data,dataType: 'json',success: function (result) {
                ko.mapping.updateFromJS(viewModel,result);
            }
        });
    }

    $(function() {                        
        ko.applyBindings(viewModel);            
    });
</script>

这是从成功请求(包括验证消息)返回的JSON响应.

{
    "Id": 440,"Project_Name": "","Response": {
        "HasWarning": true,"BusinessWarnings": [
            {
                "ExceptionType": 2,"Message": "Project is invalid."
            },{
                "ExceptionType": 1,"Message": "Project_Name may not be null"
            }
        ]
    }   
}

UPDATE

Fiddler Demo是一个修剪现实的例子,我正在经历.我使用返回的JSON更新了Project_Name,但是没有通过它们的数据绑定来更新viewModel.Response对象和属性.具体Response.HasWarning().

我已经改回到ko.mapping.updateFromJS,因为在我的控制器中,我专门返回Json(viewModel).

清理我的初始代码/问题以匹配演示.

解决方法

我猜回应是保留的,当我将“回应”改为“resp”时,一切顺利.见 http://jsfiddle.net/BBzVm/

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读