2013-07-01 75 views
-2

我要瘋了knockuoutjs和綁定:Knockoutjs並結合

我已經定義了一個CreateEditGroup.js文件,我已經創建的方法和集合檢索或在我的應用程序更新組:

var url = window.location.pathname; 
var GroupID = url.substring(url.lastIndexOf('/') + 1); 


var Group = function (group) 
{ 
    var self = this; 
    self.GroupID = ko.observable(group ? group.GroupID : 0).extend({ required: true }); 
    self.Name = ko.observable(group ? group.Name : '').extend({ required: true }); 
}; 

var GroupCollection = function() { 
    var self = this; 
    if (GroupID == 0) { 
     self.group = ko.observable(new Group()); 
    } 
    else { 
     $.ajax({ 
      url: '/Group/GetGroupByID/' + GroupID, 
      async: false, 
      dataType: 'json', 
      success: function (json) { 
       self.group = ko.observable(new Group(json)); 
      } 
     }); 
    } 

    self.backToGroupList = function() { window.location.href = '/App/Groups' }; 

    //Aggiunta o modifica 

    self.saveGroup = function() { 
     $.ajax({ 
      type: (self.group().GroupID > 0 ? 'PUT' : 'POST'), 
      cache: false, 
      dataType: 'json', 
      url: urlContact + (self.group().GroupID > 0 ? '/UpdateGroup?id=' + self.group().GroupID : '/SaveGroup'), 
      data: JSON.stringify(ko.toJS(self.group())), 
      contentType: 'application/json; charset=utf-8', 
      async: false, 
      success: function (data) { 
       window.location.href = '/App/Groups'; 
      }, 
      error: function (err) { 
       var err = JSON.parse(err.responseText); 
       var errors = ""; 
       for (var key in err) { 
        if (err.hasOwnProperty(key)) { 
         errors += key.replace("group.", "") + " : " + err[key]; 
        } 
       } 
       $("<div></div>").html(errors).dialog({ modal: true, title: JSON.parse(err.responseText).Message, buttons: { "Ok": function() { $(this).dialog("close"); } } }).show(); 
      }, 
      complete: function() { 
      } 
     }); 
    }; 

}; 

ko.applyBindings(new GroupCollection()); 

和表示形式有此HTML代碼的視圖:

@{ 
    ViewBag.Title = "CreateEditGroup"; 
} 

<h2>Nuovo gruppo</h2> 
<table class="table"> 
    <tr> 
     <th colspan="1"> 

     </th> 
    </tr> 
    <tr></tr> 
    <tbody data-bind="with: Group"> 
     <tr> 
      <td> 
       <input class="input-large" data-bind="value: Name" placeholder="Nome" /> 
      </td> 
     </tr> 
    </tbody> 
</table> 

<button class="btn btn-small btn-success" data-bind="click: saveGroup">Salva</button> 
<input class="btn btn-small btn-primary" type="button" value="Annulla" data-bind="click: $root.backToGroupList" /> 

<script src="@Url.Content("~/Repository/CreateEditGroup.js")"></script> 

每次我加載CreateEditGroup頁我收到是impossibil消息e綁定Name屬性,但代碼看起來不錯。

請幫助我。

代碼錯誤:

An unhandled exception occurred at line 1936 column 17 in http://localhost:2297/Scripts/knockout-2.2.1.debug.js 

0x800a139e - Run-time JavaScript: Unable to parse bindings. 

Message: ReferenceError: 'Name' is not defined; 

Bindings value: value: Name 
+1

請發佈確切的錯誤信息! – nemesv

+0

在你的示例中,你沒有'data-bind =':Name「'!你只有'data-bind =':Group「'和'data-bind =」value:Name「'所以你的示例和錯誤不匹配! – nemesv

+0

我已添加錯誤代碼:) –

回答

0

我已經解決了這個難題! 錯誤很簡單:在CreateEditGroup.js我宣佈一個已被稱爲組變量和對象組名爲

var Group = function (group) 
{ 
    var self = this; 
    self.GroupID = ko.observable(gruppo ? gruppo.GroupID : 0).extend({ required: true }); 
    self.Name = ko.observable(gruppo ? gruppo.Name : '').extend({ required: true }); 
}; 

我已經修改了與另一名該功能通過對象的名稱和最後的作品!

var Group = function (gruppo) 
{ 
    var self = this; 
    self.GroupID = ko.observable(gruppo ? gruppo.GroupID : 0).extend({ required: true }); 
    self.Name = ko.observable(gruppo ? gruppo.Name : '').extend({ required: true }); 
}; 

謝謝大家的幫忙!

0

我相信你有一個大寫錯誤。

data-bind="with : Group" 

應該

data-bind="with : group" 
+0

它說「組」是undefined :( –