MVC4使用一个模型创建注册页面

Question

我没有一个很好的例子，主要是因为我只是对它进行了修改，到目前为止，我的代码只是一个混乱的gobble-dee-gook混杂的混乱。我很茫然，需要一些帮助或建议。这是我需要的：

我正在创建一个模拟注册表格仅用于学习目的。作为我的例子，我使用了工作申请表。一页有申请人的个人信息，如姓名，年龄，性别和教育程度。第二页允许他们选择他们希望申请的职位，并允许他们提供技能列表。我有一个model设置为将data和save设置为database。第一页将有一个ajax下一个按钮用第二个页面表单替换第一个页面表单。第二页有两个按钮，返回和提交（很简单），也是ajax-y。我现在的问题是从两个表单中获取data以保存model中的一个entry。有没有人有一个简单的例子或链接，我可以研究这种情况？或者甚至可能还有其他方法来解决这个问题？这将不胜感激！！ :)

型号

public int Id { get; set; } 

    [Required(ErrorMessage = "First name Req")] 
    [Display(Name = "First name")] 
    public string First { get; set; } 

    [Required(ErrorMessage = "Last name Req")] 
    [Display(Name = "Last name")] 
    public string Last { get; set; } 

    [Required(ErrorMessage = "Age Req")] 
    [Range(18, 75, ErrorMessage = "Age Range of {1}-{2}")] 
    public int Age { get; set; } 

    [Required(ErrorMessage = "Please Select Gender")] 
    public string Gender { get; set; } 

    [Required(ErrorMessage = "Education Level Req")] 
    public string Education { get; set; } 

    public string Position { get; set; } 

    public string Skills { get; set; } 

控制器

[HttpGet] 
    public PartialViewResult Apply1() 
    { 
     var model = db.Applications.Find(id); 
     if (model != null) 
     { 
      return PartialView("_Apply1", model); 
     } 
     return PartialView("_Apply1"); 
    } 

    [HttpPost] 
    public PartialViewResult Apply1(Application app) 
    { 
     if (Request.IsAjaxRequest()) 
     { 
      if (db.Applications.Where(a => a.First.ToLower() == app.First.ToLower() && a.Last.ToLower() == app.Last.ToLower() && a.Age == app.Age && a.Gender == app.Gender && a.Education == app.Education).Count() == 0) 
      { 
       app.Position = "x"; 
       db.Applications.Add(app); 
       db.SaveChanges(); 
      } 
      else 
      { 
       app = db.Applications.Single(a => a.First.ToLower() == app.First.ToLower() && a.Last.ToLower() == app.Last.ToLower() && a.Age == app.Age && a.Gender == app.Gender && a.Education == app.Education); 
      } 

      PosList(); //This is a helper Method, get's values for a dropdown list 
      id = app.Id; 
      var model = db.Applications.Find(id); 
      return PartialView("_Apply2", model); 
     } 

     return PartialView("_Apply1", app); 
    } 

    [HttpGet] 
    public PartialViewResult Apply2() 
    { 
     var model = db.Applications.Find(id); 
     if (model != null) 
     { 
      return PartialView("_Apply2", model); 
     } 
     return PartialView("_Apply2"); 
    } 

    [HttpPost] 
    public PartialViewResult Apply2(Application app) 
    { 


     if (ModelState.IsValid) 
     { 
      db.Entry(app).State = EntityState.Modified; 
      db.SaveChanges(); 
      ModelState.Clear(); 
      return PartialView("_Success"); 
     } 

     PosList(); 
     return PartialView("_Apply2", app); 
    } 

首先查看

@model SiPrac.Models.Application 

@using (Ajax.BeginForm("Apply1", new AjaxOptions() 
{ 
InsertionMode = InsertionMode.Replace, 
UpdateTargetId = "appForm" 
})) 
{ 
@Html.AntiForgeryToken() 

<div class="editor-label"> 
    @Html.LabelFor(model => model.First) 
</div> 
<div class="editor-field"> 
    @Html.EditorFor(model => model.First) 
    @Html.ValidationMessageFor(model => model.First) 
</div> 
<div class="clear"></div> 

<div class="editor-label"> 
    @Html.LabelFor(model => model.Last) 
</div> 
<div class="editor-field"> 
    @Html.EditorFor(model => model.Last) 
    @Html.ValidationMessageFor(model => model.Last) 
</div> 
<div class="clear"> 

<input class="btn" type="submit" value="Next" /> 
} 

第二视图

@using (Ajax.BeginForm("Apply2", new AjaxOptions() 
{ 
InsertionMode = InsertionMode.Replace, 
UpdateTargetId = "appForm" 
})) 
{ 
@Html.AntiForgeryToken() 

<div class="editor-label"> 
    @Html.LabelFor(model => model.Position) 
</div> 
<div class="editor-field"> 
    @Html.DropDownListFor(model => model.Position, (IEnumerable<SelectListItem>)ViewData["selectPos"]) 
</div> 
<div class="clear"></div> 

<input class="btn" type="submit" value="Submit" /> 
} 

Answer 1

好吧我会尽量缩短这一点。因此，假设你已经知道如何，形式之间切换，因为我知道你根据你的问题，你必须形成这样的：

<form id="form1"> 
    @Html.EditorFor(model => model.First) 
    // rest of the fields goes here 
</form> 
<form id="form2"> 
    @Html.EditorFor(model => model.Position) 
    // rest of the fields goes here 
    <button id="submitAll">Submit</button> 
</form> 

那假设你有按键来回切换的意见。该submitAll按钮触发回发动作控制器方法，并通过这样的价值：

function submitAllFields() { 
    var o = { 
     // list properties here similar to your model property name 
     // and assign values to them 
     First: $("#First").val(), 
     Position: $("#Position").val() 
    }; 
    $.post('@Url.Action("apply2")', { app: o }, function(result) { 
     // do something here 
    }); 
} 

然后，您需要一种方法来接受所有输入：

[HttpPost] 
public PartialViewResult Apply2(Application app) 
{ 
    if (ModelState.IsValid) 
    { 
     db.Entry(app).State = EntityState.Modified; 
     db.SaveChanges(); 
     ModelState.Clear(); 
     return PartialView("_Success"); 
    } 
    // do something here 
}