显示列表后选择DropDownList值Razor

问题描述：

我一直在这工作了一段时间，我知道如何解决它使用JQuery，但我需要解决这个只是使用服务器端代码，我在Razor View 事情是：显示列表后选择DropDownList值Razor

我有一个@Html.DropDownlist显示美国的一些国家，并且一旦点击DropDownList的国家之一，然后我想显示一些城市属于使用其他DropDownList选择的国家，我不是确定如何使用Razor syntax从选定字段获取值，然后在选择一个州时显示属于其他DropDownList中的州的城市，我使用SelectList并且我有要绑定城市......我展示了DropDownList中的所有国家正在工作。这里是我的代码：

这些只是两个班，我使用，以填补一些属性的SelectList：

public States(int id, string name, List<string> list) 
     { 
      StateID = id; 
      Name = name; 
      Cities = list; 
     } 
     public int StateID { get; set; } 
     public string Name { get; set; } 
     public List<string> Cities { get; set; } 
    } 


    public static class Fill 
    { 
     public static List<States> GiveMeStates() 
     { 
      List<States> li = new List<States>() { 
      new States(1, "Alabama",new List<string> {"Adamsville", "Addison", "Anderson","Anniston", "Arab" }), 
      new States(2,"Alaska", new List<string> {"Anchorage","Juneau","Fairbanks","Sitka"}), 
      new States(3,"Arizona", new List<string> { "Avondale", "Benson", "Besbee"}) 
      }; 
      return li; 
     } 
    }

而现在这是我的Razor视图：

@using RazorMVC.Models; 

@{ 
    List<States> aux = Fill.GiveMeStates(); 
    SelectList states = new SelectList(aux, "StateID", "Name"); 
} 
<form> 
    @Html.DropDownList("ddlStates", states); 

</form>

您需要张贴您的表单到一个方法，重定向到另一种方法，显示基于选定状态的城市（并将选定状态的值传递给该方法） –

为什么你不要不想使用'JQuery'？我认为绑定多级'下拉式'JQuery是不错的选择，没有任何回传到页面！ –

@StephenMuecke谢谢你的想法，我明白你的意思，但是如何发布我的表单，从下拉列表中选择一个元素并且不需要提交按钮？这可能没有使用提交按钮？我不知道如何做到这一点，只是使用C＃和剃刀语法，再次感谢:) – AlexGH

答

如果您绝对不想使用javascript/jQuery，则可以提交表单（使用选定的状态ID），并根据发布的状态ID获取状态并显示该状态。

假设您想在同一视图中显示所选状态的城市。

@{ 

    var stateId = Request.QueryString["ddlStates"] as string; 
    List<States> aux = Fill.GiveMeStates(); 
    SelectList states = new SelectList(aux, "StateID", "Name"); 
    List<SelectListItem> cities = new List<SelectListItem>(); 
    if (!String.IsNullOrEmpty(stateId)) 
    {  
    var state = aux.FirstOrDefault(f => f.StateID == Convert.ToInt32(stateId)); 
    if (state != null) 
    { 
     cities = state.Cities 
         .Select(x => new SelectListItem {Value = x, Text = x}).ToList(); 
    } 
    } 
} 
<label>Select a state and hit submit </label> 
@using (Html.BeginForm("Index", "Home", FormMethod.Get)) 
{ 
    @Html.DropDownList("ddlStates", states) 
    <label>Cities < /label> 
    @Html.DropDownList("City", cities) 
    <input type="submit" /> 
}

我个人更喜欢在剃须刀视图中不放置很多C＃代码。我通常创建一个视图模型并使用它来传递视图中所需的值。因此，您在视图中看到的大部分代码都在我的操作方法中。如果您更喜欢使用jQuery/javascript（为什么不？），您可以听第一个下拉列表的更改事件，获取选定的选项值并通过ajax调用将其发送到服务器。让您的服务器操作方法以json格式返回状态，并且您的ajax metod的回调可以解析json数据并更新城市下拉列表。这是一个sample开始

显示列表后选择DropDownList值Razor

相关推荐