MVC動的ドロップダウンリスト付きフォームの編集 - 初期値の設定方法

Question

MVC、C＃およびEntity Frameworkを使用しています。 私のモデル上のオブジェクトは、次のとおりです。

州 -------- ID、名前

市 ------- ID、名前、STATEID

TheObject ---- Id、Name、StateId、CityId

TheObjectの編集フォームを作成したいと思います。 Editフォームには2つのドロップダウンリストStateとCityが動的に作成され、CityリストはState Listでの選択に依存します。 問題は、ドロップダウンリストが正しく入力されていることですが、編集フォームが開いているとき、これらの2つのドロップダウンリストは空の状態にあり、編集されたオブジェクトの実際の値は選択されていません。

<div class="form-group"> 
     @Html.LabelFor(u => u.State, new { @class = "control-label col-md-2" }) 
     <div class="col-md-10"> 
      @Html.DropDownListFor(u => u.State, 
      new SelectList(ViewBag.State, "Id", "Name"), 
      "Choose State", 
      new { @class = "form-control", @onchange = "selectCities()" }) 
      @Html.ValidationMessageFor(u => u.State, "", new { @class = "text-danger" }) 
     </div> 
    </div> 

    <div class="form-group"> 
     @Html.LabelFor(u => u.City, new { @class = "control-label col-md-2" }) 
     <div class="col-md-10"> 
      @Html.DropDownListFor(u => u.City, 
    new SelectList(Enumerable.Empty<SelectListItem>(), "Id", "Name"), 
      "Choose City", 
      new { @class = "form-control" }) 
      @Html.ValidationMessageFor(u => u.City, "", new { @class = "text-danger" }) 
     </div> 
    </div> 

function selectCities() { 
    debugger; 
    var stateId = $("#State").val(); 
    $.ajax({ 
     url: '/Home/selectCities', 
     type: 'POST', 
     datatype: 'application/json', 
     contentType: 'application/json', 
     data: JSON.stringify({ stateId: +stateId }), 
     success: function (result) { 
      $("#City").html(""); 
      $("#City").append 
      ($('<option></option>').val(null).html("---choose City---")); 
      $.each($.parseJSON(result), function (i, cty) 
      { $("#City").append($('<option></option>').val(cty.Id).html(cty.Name)) }) 

     }, 
     error: function() { alert("Error !") }, 
    }); 
} 

コントローラの部分的なコードは、このです：

編集ビューのための部分的なコードは、このです実際

private void Fill_StateDropDownList() 
    { 
     var st = from d in db.States 
        orderby d.Name 
        select d; 
     ViewBag.State = st.ToList(); 
    } 

    [HttpPost] 
    public ActionResult selectCities(string stId) 
    { 

     List <City> lstcity = new List <City>(); 
     int stateiD = Convert.ToInt32(stId); 
     lstgrupet = (from d in db.Citys 
        where d.StateID==stateiD 
       select d).ToList(); 
     string result= JsonConvert.SerializeObject(lstgrupet, Formatting.Indented, 
     new JsonSerializerSettings { ReferenceLoopHandling = ReferenceLoopHandling.Ignore}); 
     return Json(result, JsonRequestBehavior.AllowGet); 
    } 

public ActionResult Edit(int? id) 
    { 
     if (id == null) 
     { 
      return new HttpStatusCodeResult(HttpStatusCode.BadRequest); 
     } 
     TheObject obj = db.TheObjects.Find(id); 
     if (obj == null) 
     { 
      return HttpNotFound(); 
     } 
     Fill_StateDropDownList()    
     return View(obj); 
    } 

    [HttpPost, ActionName("Edit")] 
    [ValidateAntiForgeryToken] 
    public ActionResult EditPost(int? id) 
    { 
     if (id == null) 
     { 
      return new HttpStatusCodeResult(HttpStatusCode.BadRequest); 
     } 
     var theobjectToUpdate = db.TheObjects.Find(id); 

     if (TryUpdateModel(theobjectToUpdate, "", 
      new string[] { "Name","StateId","CityId" })) 
     { 
       try 
       { 
        db.SaveChanges(); 
        return RedirectToAction("Index"); 
       } 
       catch (Exception) 
       { 
        ModelState.AddModelError("", "Error."); 
       } 

     } 
     Fill_StateDropDownList() 
     return View(theobjectToUpdate); 
    } 

Answer 1

SelectListと呼ばれるパラメータを有する構築物を有するselectedValue

今あなたはそれを行う方法を知っておくべきです

in編集の表示

Answer 2

すでに保存されている州と都市の値があります。保存された状態IDに基づいて都市のサブセットをロードし、そのコレクションを使用して都市のドロップダウンをレンダリングするだけです

DropDownListForヘルパーメソッドは、ビューの限りSELECTエレメントから対応するオプションを選択しますモデルのCityプロパティ値は、オプションのvalue属性値のいずれかと一致します。

public ActionResult Edit(int? id) 
{ 
    if (id == null) 
    { 
     return new HttpStatusCodeResult(HttpStatusCode.BadRequest); 
    } 
    TheObject obj = db.TheObjects.Find(id); 
    if (user == null) 
    { 
     return HttpNotFound(); 
    } 
    Fill_StateDropDownList() 
    FillCities(obj.State);   
    return View(obj); 
} 
private void FillCities(int stateId) 
{ 
    ViewBag.CityList = db.Cities 
         .Where(g => g.StateId== stateId) 
         .Select(f => new SelectListItem() { 
                  Value = f.Id.ToString(), 
                  Text = f.Name }) 
         .ToList(); 
} 

ビューへの調整

var cityList = new List<SelectListItem>(); 
if (ViewBag.CityList != null) 
{ 
    cityList =ViewBag.CityList as List<SelectListItem>; 
} 
@Html.DropDownListFor(u => u.City, cityList , "Choose City") 

別のオプションを確認します（状態ドロップダウンの値に基づいて都市を取得する準備ができて文書）、ページの読み込みにAJAX呼び出しをすることです。