绑定和级联下拉列表MVC 3

我的看法是绑定和级联下拉列表MVC 3

<div id="Countryy"> 
     <div class="editor-label"> 
     @Html.LabelFor(model => model.Country, "Country") 
    </div> 
    <div class="editor-field"> 
     @Html.DropDownList("Country", String.Empty) 
     @Html.ValidationMessageFor(model => model.Country) 
    </div> 
    </div> 

    <div id="Statess"> 
    <div class="editor-label"> 
     @Html.LabelFor(model => model.State, "State") 
    </div> 
    <div class="editor-field"> 
     @Html.DropDownList("State", String.Empty) 
     @Html.ValidationMessageFor(model => model.State) 
    </div> 
    </div> 


    <div id="Cityy"> 
    <div class="editor-label"> 
     @Html.LabelFor(model => model.City, "City") 
    </div> 
    <div class="editor-field"> 
     @Html.DropDownList("City", String.Empty) 
     @Html.ValidationMessageFor(model => model.City) 
    </div> 
    </div

我的控制器

public ActionResult Edit(int id) 
    { 
     Student student = db.Students.Single(s => s.ID == id); 


     ViewBag.Country = new SelectList(db.Couns, "ID", "CountryName", student.Country); 
     ViewBag.State = new SelectList(db.States.Where(d => d.CountryID.Equals(student.Country)), "StateID", "StateName", student.State); 
     ViewBag.City = new SelectList(db.Cities.Where(x => x.StateID.Equals(student.State)), "CityID", "CityName", student.City); 


     return View(student); 
    }

块引用

我的问题是我怎么能级联的国家，州和城市下拉列表。当我想要编辑数据时，会生成此视图。从数据库中保存的数据将被修改并绑定到控件ols，但是当用户更改国家下拉列表的数值时，也应该根据它填充国家/地区下拉列表。我有国家，州和城市3个不同的表格，其中包含所需的pk和fk

来源

2012-09-01 siddharth

当发生国家下拉更改事件时，您必须调用ajax，并且您必须填写相关的下拉列表。 –

@KundanSinghChouhan如何制作ajax调用。我newbe你可以给我一个例子plz – siddharth

找到[this]（http://www.codeproject.com/Articles/41828/JQuery-AJAX-with-ASP-NET-MVC）文章。 –

以下是国家和地区的解决方案在使用Ajax的MVC中状态级联下拉列表： -
通过控制器保留视图包进行第一次下拉式绑定，对于第二次下拉式，我们可以使用JavaScript/Jquery根据所选国家/地区填充值。
下面CSHTML页面上使用的代码：

 <div class="editor-label"> 
       @Html.LabelFor(m => m.Country) 
      </div> 
      <div class="editor-field"> 
       @Html.DropDownListFor(model => model.Country, new SelectList(Model.Country,  "Value", "Text"), "Select Contry", new { onchange = "CountryChange()" }) 
      </div> 
      <div class="editor-label"> 
      @Html.LabelFor(m => m.State) 
      </div> 
      <div class="editor-field"> 
      @Html.DropDownList("state","Select State") 
      </div>

我们使用“CountryChange（）” JavaScript函数来获取并填写根据国家变化的状态下拉数据。以下是JavaScript函数的实现。指定

<script language="JavaScript" type="text/JavaScript"> 
    function CountryChange() { 
     var url = '@Url.Content("~/Account/GetState")'; 

     var ddlsource = "#Country"; 
     var ddltarget = "#State"; 
     if ($(ddlsource).val() != "") { 
      $.ajaxSetup({ cache: false }); 
      $.getJSON(url, { Sel_Country: $(ddlsource).val() }, function (data) { 
       $(ddltarget).empty(); 
       $("#State").append("<option value=''>Select State</option>"); 
       $.each(data, function (index, optionData) { 
       $("#State").append("<option value='" + optionData.Value + "'>" +  optionData.Text + "</option>"); 
       }); 
      }); 
     } 
     else { 
      $("#State").empty(); 
      $("#State").append("<option value=''>Select State</option>"); 
     } 
    } 
</script>

这里JSON URL“〜/帐户/ GETSTATE”是方法“GETSTATE”中的“帐户”控制器可用来检索数据和JSON格式传递数据。

 public JsonResult GetState (string Sel_Country) 
     { 
     CountryService db = new CountryService(); 
     JsonResult result = new JsonResult(); 
     var vStateList = db.GetStateList(Convert.ToInt64(Sel_Country)); 
     result.Data = vStateList.ToList(); 
     result.JsonRequestBehavior = JsonRequestBehavior.AllowGet; 
     return result; 
     }

来源

2012-09-03 09:13:09 RL89

绑定和级联下拉列表MVC 3

回答

相关问题