Почему моя привязка данных не работает?

Question

Я разрабатываю веб-часть SharePoint 2010. Я бы использовал рамки нокаута для привязки данных.

У меня есть один ASCX с этим кодом:

<table> 
     <tr> 
      <td> 
       <label id="lblLastMaintenanceDate">Data ultima manuntenzione:</label> 
      </td> 
      <td> 
       <span id="lastMaintenanceDate" data-bind="text: lastMaintenanceDate"></span> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <label id="lblMaintenanceDescription">Descrizione manuntenzione:</label> 
      </td> 
      <td> 
       <span id="MaintenanceDescription" data-bind="text: maintenanceDescription"></span> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <label id="lblConcept">Concept:</label> 
      </td> 
      <td> 
       <span id="Concept" data-bind="text: concept"></span> 
      </td> 
     </tr> 
    </table> 

Внутри document.ready() Я написал этот код:

$(document).ready(function() { 
    ko.applyBindings(ShopViewModel); 
}); 

Это мой ViewModel:

var ShopViewModel = { 
lastMaintenanceDate : ko.observable(), 
maintenanceDescription : ko.observable(), 
concept : ko.observable(), 

GetShopDetail : function (val1) { 

$.ajax({ 
     type: "GET", 
     url: "../_layouts/MyProject/MasterPage.aspx/GetDetails?par1=" + val1, 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     data: "{}", 
     cache: false, 
     async: false, 
     success: function (result) { 
      var oJson = eval("(" + result['d'] + ")"); 
      if (oJson.Success) { 
       var result = oJson.Data; 
       if (result) { 
        this.lastMaintenanceDate = String(result.LastMaintenanceDate); 
        this.maintenanceDescription = String(result.MaintenanceDescription); 
        this.concept = String(result.SyConceptId); 
       } 
      } 
      else { 
       WriteToConsole(oJson.Error); 
       customAlert(oJson.Error, "Error"); 
      } 
     } 
    }) 
} 

}

И я c все функции GetShopDetail с помощью этого кода:

ShopViewModel.GetShopDetail(val1); 

Моя проблема в том, что привязка данных не работает.

Вы можете мне помочь?

Благодаря

Answer 1

две причины:

1. Поскольку this в вашем АЯКС обратного вызова не ваш ViewModel. Если вы хотите, используйте bind

2. Потому что вы заменяете свои наблюдаемые исходными свойствами. Вместо этого установите значение наблюдаемой

Итак:

success: function (result) { 
     var oJson = eval("(" + result['d'] + ")"); 
     if (oJson.Success) { 
      var result = oJson.Data; 
      if (result) { 
       // ************** Change on next three lines 
       this.lastMaintenanceDate(String(result.LastMaintenanceDate)); 
       this.maintenanceDescription(String(result.MaintenanceDescription)); 
       this.concept(String(result.SyConceptId)); 
      } 
     } 
     else { 
      WriteToConsole(oJson.Error); 
      customAlert(oJson.Error, "Error"); 
     } 
    }.bind(this)  // <===== Change here 

Re # 2, я предлагаю работать через Knockout tutorials, так как это одна из самых фундаментальных аспектов КО.

---

Side Примечание: Не используйте eval для разбора JSON. Используйте команду JSON.parse для разбора JSON. Или $.parseJSON.