ASP.NET MVC3：部分ビューとメインビューの相互作用

Question

私は連絡先を部分的に見ています。現在のところ、インデックスビューは、連絡先の詳細についてこの部分ビューを示しています。編集したデータを保存するには、パーシャルビューの中に保存ボタンがあります。編集されたデータを保存している間、年齢の検証があります。これはうまく動作しています。

ユーザーが年齢を編集して保存するたびに、メインビューに対応する星占い予測を表示する必要があります。どのように達成するのですか？

public class ContactEntity 
{ 
    public int ContactID { get; set; } 
    public string ContactName { get; set; } 

    [Range(18, 50, ErrorMessage = "Must be between 18 and 50")] 
    public int ContactAge { get; set; } 
} 

public class AgeHoroscope 
{ 
    public int Age { get; set; } 
    public string HoroscopePrediction { get; set; } 
} 

//ホームコントローラー

namespace MYContactEditPartialViewTEST.Controllers 
{ 
public class HomeController : Controller 
{ 

    List<AgeHoroscope> horoList = new List<AgeHoroscope>() 
    { 
     new AgeHoroscope{Age=16,HoroscopePrediction="You are confused"}, 
     new AgeHoroscope{Age=26,HoroscopePrediction="You are very brilliant"}, 
     new AgeHoroscope{Age=27,HoroscopePrediction="You are practical"} 
    }; 

    public ActionResult Index() 
    { 
     AgeHoroscope selectedHoro = horoList[1]; 
     return View(selectedHoro); 
    } 

    } 
} 

//問い合わせコントローラー

namespace MYContactEditPartialViewTEST.Controllers 
{ 
public class ContactController : Controller 
{ 

    public PartialViewResult MyContactDetailEdit() 
    { 
     Thread.Sleep(500); 
     return PartialView(GetContact()); 
    } 


    [HttpPost] 
    public PartialViewResult MyContactDetailEdit(string conatcclick) 
    { 
     //Save to database 
     Thread.Sleep(500); 
     return PartialView(GetContact()); 
    } 


    private ContactEntity GetContact() 
    { 
     ContactEntity contactEntity = new ContactEntity(); 
     contactEntity.ContactID = 1; 
     contactEntity.ContactName = "Lijo"; 
     contactEntity.ContactAge = 26; 
     return contactEntity; 
    } 

} 
} 

//Index.cshtml

@model MYContactEditPartialViewTEST.AgeHoroscope 
@{ 
ViewBag.Title = "Index"; 
} 

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript">  </script> 



<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 

<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 

<h2> 
    Index</h2> 

<div> 
<a>Your age is <b>@Html.DisplayFor(x => x.Age) </b>and the prediction is <b>" @Html.DisplayFor(x => x.HoroscopePrediction) 
    " </b></a> 
<br /> 
</div> 
<div style="border: 3px solid Teal"> 
@Html.Action("MyContactDetailEdit", "contact") 
</div> 

// MyContactDetailEdit.cshtml

@model MYContactEditPartialViewTEST.ContactEntity 


@using (Html.BeginForm()) 
{ 
@Html.ValidationSummary(true) 

<h3>MyContactDetailEdit PARTIAL</h3> 

<div> 
@Html.HiddenFor(x => x.ContactID) 
<br /> 
<div style="font-weight:bold"> 
    Name: 
    <br /> 
</div> 
@Html.DisplayFor(x => x.ContactName) 
<br /> 
<br /> 
<div style="font-weight:bold"> 
    Age 
    <br /> 
</div> 
@Html.EditorFor(x => x.ContactAge) 
@Html.ValidationMessageFor(model => model.ContactAge) 
<br /> 
<br /> 
</div> 

<input type="submit" id="saveButton" value="Save" /> 

} 

READING

1. ASP.Net MVC Passing multiple parameters to a view

2. ASP.Net MVC 3 RC2, Partial Views Form Handling

Answer 1

私はアヤックスのポストを行い、その後、変更するjQueryのを使用したいと思います親ビュークライアント側で直接

Answer 2

これを行うには、新しいViewModelを作成する必要があります。このViewModelに（IndexViewModel.cs）この（私はこれを推測している）のようなものになります。

あなたは、あなたのコントローラのindexアクション（およびビュー）でそれを使用したい

public class IndexViewModel 
{ 
    public int ContactID { get; set; } 
    public string ContactName { get; set; } 
    public int ContactAge { get; set; } 
    public string HoroscopePrediction { get; set; } 
} 

を：

@model MYContactEditPartialViewTEST.IndexViewModel 

ContactEntityとAgeHoroscope（またはLinqなど）間の結合でHoroscopePredictionを作成し、インデックスの各行を完全なオブジェクト（連絡先と星座を示す）として表示するという考えがあります。

Answer 3

「HomeController」と「Index」アクションにデータが投稿されるため、Viewで年齢を変更すると変更が反映されます。

次のようにホームコントローラーを変更しようとすると、正常に動作します。

1）AgeHoroscopeのリストを持つ代わりに、年齢と予測の辞書を持つことができます。

2）HttpGetとHttpPostの2つのインデックスアクションを次のように作成します。

public class HomeController : Controller 
{ 

    Dictionary<int, string> AgePred = new Dictionary<int, string>() 
    { 
    {16,"You are confused"}, 
    {26,"You are very brilliant"}, 
    {27,"You are practical"} 
    }; 

    [HttpGet] 
    public ActionResult Index() 
    { 
     AgeHoroscope selectedHoro = new AgeHoroscope() { Age = 26 }; 
     selectedHoro.HoroscopePrediction = AgePred[selectedHoro.Age]; 
     return View(selectedHoro); 
    } 
    [HttpPost] 
    public ActionResult Index(AgeHoroscope model,ContactEntity entity) 
    { 
     model.Age = entity.ContactAge; 
     model.HoroscopePrediction = AgePred[entity.ContactAge]; 
     return View(model); 
    } 

}