淘汰更新objable成功函数无需重新加载

时间:2013-04-19 06:26:16

标签: jquery asp.net-mvc knockout.js knockout-mvc

我在我的MVC 4Application中使用knockout来进行视图模型绑定。我需要在Ajax成功函数上更新我的视图模型字段,而无需重新加载整个视图模型。我使用以下代码更新视图模型字段。但问题是,在更新每个视图模型字段值时,重新加载整个视图模型,最终以调用updateHiddenElements方法的循环请求结束。

这是我的视图模型

function ViewModel(data) {

      var self = this;
      self.Fields = ko.observableArray(ko.utils.arrayMap(data, function(item) {
        return new FormField(item);
      }));
      self.HiddenElements = ko.observableArray([]);
      self.dirtyFlag = new ko.dirtyFlag(self, false);
      self.applyUpdates = ko.computed(function () {

      if (self.dirtyFlag.isDirty()) {
          //alert("YES !!!");
           updateHiddenElements(self);
           setTimeout(function() {
           self.dirtyFlag.reset();
           }, 0);
       }
     });
};

这是我的更新方法,

var updateHiddenElements = function (viewModel) {
 //alert("Posting Data:\n\n"+ko.toJSON(viewModel));
 //console.log("#### SENDING AJAX REQUEST TO FETCH LIST OF ELEMENTS TO BLANKOUT ####\n");
   $.ajax({
             type: "POST",
             url: '@Url.Action("GetBlankoutElements", "Offer")' +  "?OfferID=" + @Model.ID,
             contentType: 'application/json; charset=utf-8',
             dataType: 'json',
             data: ko.toJSON(viewModel),
             success: function(result) {
               result.split(',').forEach(function(name) {
               var param = ko.utils.arrayFirst(viewModel.Fields(),  function(currentParam)
               {
                    return currentParam.Name() == name;
               });
               if (param) {
                            param.Value(param.Default());
                           }
              });
              viewModel.HiddenElements(result.split(','));
             }
          });
 };

有人可以建议我如何解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

我没看到整个视图模型是如何完全重新加载的。但我不明白为什么updateHiddenElements函数没有直接在viewmodel中实现。这在我看来更合乎逻辑,我认为它可能会清除你的问题。 'success'函数不仅直接在viewmodel上工作,而且你不必传递整个viewmodel。

function ViewModel(data) {
    ...
    updateHiddenElements = function () {
         $.ajax({
           type: "POST",
           url: '@Url.Action("GetBlankoutElements", "Offer")' +  "?OfferID=" + @Model.ID,
           contentType: 'application/json; charset=utf-8',
           dataType: 'json',
           data: ko.toJSON(self),
           success: function(result) {
             result.split(',').forEach(function(name) {
             var param = ko.utils.arrayFirst(self.Fields(),  function(currentParam)
                           self.HiddenElements(result.split(','));
             }
             ...
           });
       });
}