来自Ajax的KnockoutJS映射

时间:2013-11-08 21:53:05

标签: jquery ajax knockout.js knockout-mapping-plugin

我的任务是做一个KnockoutJS的POC并遇到一个我无法弄清楚的问题。

我想使用Ajax从服务中检索数据,然后使用ko.mapping.fromJS()填充表单。当我从ajax调用的success函数中调用映射时,我的表单将不会填充。如果我把它移到成功之外那么它就可以了。

更新:我确实知道在我的jsfiddle中调用了load函数(在那里放了一个警告并且它会触发)但是表单没有填充..

http://jsfiddle.net/Ud9ex/6/

var planDesignData = {
        RecordID: '1124',
        Name: "Main"            
    };


var PlanDesignModel = function () {
var self = this;            

//*** As soon as I move this line inside the sucess the input doesn't get populated 
self.planDesign = ko.mapping.fromJS(planDesignData);

self.load = function () {
    $.ajax({
        type: "POST",
        url: "/echo/json/",
        contentType: "application/json; charset=utf-8",
        dataType: "json",                    
        success: function (data) {                       
            var loadedPD = {};

            //I want to run the mapping here

        }
    });
}
}


$(document).ready(function () {
            var viewModel = new PlanDesignModel();
            viewModel.load();
            ko.applyBindings(viewModel);    

        });

非常感谢任何帮助。

1 个答案:

答案 0 :(得分:-2)

这是example

您需要做的就是将数据发送到/echo/json

我在这个例子中做过defer

$(document).ready(function () {
    var viewModel = new PlanDesignModel();
    $.when(viewModel.load).always(function(){
        ko.applyBindings(viewModel);
    });
});

但一切正常:

success: function (data) {
            var loadedPD = {};
            console.log(data);
            self.planDesign = ko.mapping.fromJS(planDesignData);
            //I want to run the mapping here

        }

注意,我确实放了1秒延迟:

data: {
            json: JSON.stringify({
                RecordID: '1124',
                Name: "Main"
            }),
            delay: 1
        },