2013-01-10 26 views
0

在我的網絡應用程序,而我更新一些數據時,我需要顯示一些加載旋轉gif在網頁中。 這是我的代碼。knockoutjs數據保存UI問題

這是我的html代碼

<img src="../../../../Content/images/submit-gif.gif" class="hidegif" data-bind="visible: isWaiting"/> 
<button data-bind="click: createNew">Save</button> 

在我knockoutjs模型我有這個

self.isWaiting = ko.observable(false); 

self.createNew = function() { 
      this.isWaiting(true); 
         $.getJSON("/Admin/Material/GetFolders", function (allData) { 
          this.isWaiting(true); 
          var mappedFolders = $.map(allData, function (item) { return new Folder(item); }); 
          self.folders(mappedFolders); 
          this.isWaiting(false); 
         }).success(function() { this.isWaiting(false); }).error(function() { }).complete(function() { this.isWaiting(false); }); ; 
     }; 

我有屬性稱爲isWaiting。在我打電話給服務器之前,我將它設置爲true。在完成和連續的方法中,我將其設置回false。 因此,基於我的紡車應該出現和消失。

但這不起作用。

在此先感謝

回答

1

this將有createNewcallback函數中的另一個方面。您應該使用self而不是this來訪問視圖模型的屬性:

self.createNew = function() { 
    self.isWaiting(true); 
    $.getJSON("/Admin/Material/GetFolders", function (allData) { 
     self.isWaiting(true); 
     var mappedFolders = $.map(allData, function (item) { return new Folder(item); }); 
     self.folders(mappedFolders); 
     self.isWaiting(false); 
    }).success(function() { 
     self.isWaiting(false); 
    }).error(function() {}) 
    .complete(function() { 
     self.isWaiting(false); 
    }); 
};