淘汰賽不工作

我是新來的網絡編程，並試圖實現Knockout聯繫表單到我的網站我使用MVC 4 Razor構建。我直接從Knockout的網站上看到了這個例子，並在JSFiddle中測試了我的更改;一切都很好。但是當我將代碼放入我的cshtml中時，它將不會拾取Knockout代碼。我對正在發生的事情感到不知所措。任何幫助？因爲有許多我不知道，因此細節將是有益的。在cshtml上的Knockout聯繫網格之後有一個BeginForm助手。這是一個問題嗎？淘汰賽不工作

的Javascript：AddTeamMember.js

var initialData = [ 
    { 
     name: "Danny", email: "[email protected]", phone: "(555) 121-2121", dept: "Print" 
    }, 
    { 
     name: "Sensei", email: "[email protected]", phone: "(555) 432-3466", dept: "AMS" 
    } 
    ]; 

    var ContactsModel = function (contacts) { 
     var self = this; 
     self.contacts = ko.observableArray(ko.utils.arrayMap(contacts, function (contact) { 
      return { name: contact.name, email: contact.email, phone: contact.phone, dept: contact.dept }; 
     })); 

     self.addContact = function() { 
      self.contacts.push({ 
       name: "", 
       email: "", 
       phone: "", 
       dept: "" 
      }); 
     }; 

     self.removeContact = function (contact) { 
      self.contacts.remove(contact); 
     }; 

     self.addPhone = function (contact) { 
      contact.phones.push({ 
       type: "", 
       number: "" 
      }); 
     }; 

     self.removePhone = function (phone) { 
      $.each(self.contacts(), function() { this.phones.remove(phone) }) 
     }; 

     self.save = function() { 
      self.lastSavedJson(JSON.stringify(ko.toJS(self.contacts), null, 2)); 
     }; 

     self.lastSavedJson = ko.observable("") 
    }; 

    ko.applyBindings(new ContactsModel(initialData));

CSHTML：

@{ 
    ViewBag.Title = "Register"; 
} 
<script src="~/Scripts/jquery-1.8.2.min.js"></script> 
<script src="~/Scripts/knockout-2.2.0.js" type="text/javascript"></script> 
<script src="~/MyJS/AddTeamMember.js"></script> 

<hgroup class="title"> 
    <h1>@ViewBag.Title.</h1> 
    <h2>@ViewBag.Message</h2> 
</hgroup> 

<div class="registerForm"> 
    <div class='memInfoForm'> 

     <h2>Contacts</h2> 
     <div id='contactsList'> 
      <table class='contactsEditor'> 
       <tr> 
        <th>Name</th> 
        <th>Email</th> 
        <th>Phone</th> 
        <th>Dept</th> 
       </tr> 
       <tbody data-bind="foreach: contacts"> 
        <tr> 
         <td> 
          <input data-bind='value: name' /> 
          <div><a href='#' data-bind='click: $root.removeContact'>Delete</a></div> 
         </td> 
         <td><input data-bind='value: email' /></td> 
         <td><input data-bind='value: phone' /></td> 
         <td><input data-bind='value: dept' /></td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 

     <p> 
      <button data-bind='click: addContact'>Add a contact</button> 
      <button data-bind='click: save, enable: contacts().length > 0'>Save to JSON</button> 
     </p> 

     <textarea data-bind='value: lastSavedJson' rows='5' cols='60' disabled='disabled'> </textarea> 

    </div> 


    @using (Html.BeginForm("Register", "Register", FormMethod.Post, new { id = "registerForm" })) 
...

來源

2014-03-30 Hope

這一行，必須執行時您DOM已準備就緒。

ko.applyBindings(new ContactsModel(initialData));

從KO網站報價：

要激活淘汰賽，下面一行添加到模塊：
ko.applyBindings(myViewModel); 
您可以把腳本塊在HTML的底部文檔，或者您可以將它放在頂部，並將內容包裝到 DOM準備好的處理程序中，例如jQuery的$函數。

http://knockoutjs.com/documentation/observables.html

來源

2014-03-30 20:33:05 alsafoo

啊！這是問題。我不明白 - 謝謝！ – Hope

很高興能夠幫助。 – alsafoo

淘汰賽不工作

回答

相關問題