2012-08-09 96 views
1

張貼背視圖模型而不是模型MVC的我有以下代碼:如何利用基因敲除

Index.cshtml:

@using System.Web.Script.Serialization 
@model MvcApplication3.ViewModels.PersonViewModel 

<script src="../../Scripts/knockout-2.1.0.js" type="text/javascript"></script> 
    <!-- This is a *view* - HTML markup that defines the appearance of your UI --> 
<form data-bind="submit: save"> 

    <p>First name: <input data-bind="value: firstName" /></p> 
    <p>Last name: <input data-bind="value: lastName" /></p> 

    <table> 
     <thead> 
      <tr> 
         <th>Name</th> 
        </tr> 
     </thead> 
     <tbody data-bind="foreach: activities"> 
      <tr> 
       <td><input data-bind="value: Name" /></td> 
      </tr>  
     </tbody> 
    </table> 

    <button type="submit">Submit</button> 
</form> 

<script type="text/javascript"> 

    var initialData = @Html.Raw(new JavaScriptSerializer().Serialize(Model)); 

    // This is a simple *viewmodel* - JavaScript that defines the data and behavior of your UI 
    var viewModel = { 
     firstName : ko.observable(initialData.Person.FirstName), 
     lastName : ko.observable(initialData.Person.LastName), 
     activities : ko.observableArray(initialData.Person.Activities), 

     save: function() { 
      $.ajax({ 
       type: "POST", 
       url: "/Home/Index", 
       data: ko.toJSON(viewModel), 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       success: function(data) { 
        $("#resultCount").html(data); 
       } 
      }); 
     } 
    } 

    // Activates knockout.js 
    ko.applyBindings(viewModel); 

</script> 

的HomeController:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 
using Ahb.Insite.HerdRegistration.WebUI; 
using MvcApplication3.Models; 
using MvcApplication3.ViewModels; 

namespace MvcApplication3.Controllers 
{ 
    public class HomeController : Controller 
    { 
     public ActionResult Index() 
     { 
      var person = new Person {FirstName = "John", LastName = "Cool"}; 

      person.Activities = new List<Activity> { new Activity { Name = "Skiing" } }; 

      var personViewModel = new PersonViewModel (person); 

      return View(personViewModel); 
     } 

     [HttpPost] 
     public ActionResult Index(Person person) 
     { 
      //Save it 

      return View(); 
     } 
    } 
} 

PersonViewModel:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using MvcApplication3.Models; 

namespace MvcApplication3.ViewModels 
{ 
    public class PersonViewModel 
    { 
     public Person Person { get; set; } 
    } 
} 

Basica lly它做了什麼是它提供了一個人的名字,姓氏和他們參與列表中的任何活動的名稱的可編輯模板。

因此,該人通過personViewModel發送。

我想在此做出的改變是,不是發回一個人,而是想將該人發回到personViewModel中。

有誰知道如何更改代碼以促進此?

+0

您應該考慮使用ajax請求加載數據,而不是將其注入到視圖中。也把所有的JavaScript放在一個單獨的文件,谷歌不顯眼的JavaScript。 – Anders 2012-08-09 11:14:46

+0

不同意單獨的ajax請求 - 這會生成實際不需要的附加請求。 – 2013-01-08 06:23:13

回答

3

這取決於你PersonViewModel,但如果是這樣的:

class PersonViewModel 
{ 
    public Person Person { get; set; } 
    // other properties 
} 

然後,它爲改變

data: ko.toJSON(viewModel), 

data: ko.toJSON({ Person: viewModel, // Other properties }), 

希望這有助於簡單。

+0

謝謝,運作良好。 – AnonyMouse 2012-08-09 10:50:41