如何在C#ASP.NET剃刀mvc中获得下拉列表

本文关键字:下拉列表 mvc 剃刀 C#ASP NET | 更新日期: 2023-09-27 18:26:25

我相信很多人都遇到过类似的问题,但我已经仔细阅读了我能找到的每一个线程,它仍然无法工作。如有任何帮助,我们将不胜感激。

以下网页背后的想法:

因此,下拉菜单会自动从数据库中的值中填充(它确实这样做了),然后当用户选择特定值时,页面会做出响应,例如使用消息框等

型号:

public class Countries
{
    public int CountriesId { get; set; }
    public string Name { get; set; }
}
public class ViewModel
{
    // This property will be populated with the selected Countries's ID when user posts the form
    public int SelectedCountriesId { get; set; }
    // After form submission, this property will hold the selected Countries's name
    public string CountriesName { get; set; }
    // Option Label for DropDownList
    public string OptionLabel { get; set; }
    public class ItemListModelViewModel
    {
        // All the Countriess which will be in the list
        public IEnumerable<Countries> CountriesList { get; set; }
    }
    /// <summary>
    /// SelectListViewModel: name indicates that select list items are collected as list of SelectListItem type
    /// </summary>
    public class SelectListViewModel 
    {
        // This will hold a constructed selectlist with Countries items
        public SelectList CountriesList { get; set; }
    }
    public class SelectListItemViewModel 
    {
        // All the Countriess which will be in the list
        public IEnumerable<SelectListItem> CountriesList { get; set; }
    }

控制器:

[HttpPost]
public ActionResult Index(CurrentInventoryModel m)
{

    var Countries = Help.GetCountries();

    m.CountriesList = Countries;

    m.CountriesName = Countries.Where(c => c.CountriesID == m.SelectedCountriesID).FirstOrDefault().Name;
    return View(m);
}

Html:

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
        <div class="display-field" align="left">
            <select name="mydropdown">
                @foreach (var lLMMI in lIM)
                {
                    <option value="@lLMMI.Key.Product.PCode">@locItem.Key.Loc.N (@lLMMI.Key.Loc.Code)</option>}
            </select>
            <br /><br />
        </div>
    <input type='submit' value='Submit' />
}

我想修复这个下拉框,因为我无法让它将选定的下拉值传递到消息框。如何做到这一点?

如何在C#ASP.NET剃刀mvc中获得下拉列表

型号:

[Required(ErrorMessage = "You must select a country")]
[Display(Name = "Country")]
public int SelectedCountriesId { get; set; }
public string CountryName { get; set; }
public SelectList CountriesList { get; set; }

控制器:

var listOfCountries = Help.GetCountries();
m.CountriesList = new SelectList(listOfCountries, "id", "coutry_name");

视图:

<div class="editor-field">
    @Html.DropDownListFor(model => model.SelectedCountriesId, 
                        (IEnumerable<SelectListItem>)model.CountriesList, 
                        "-- Select a country --")
    @Html.ValidationMessageFor(model => model.SelectedCountriesId)
</div>

您必须将onChange事件添加到您的选择中:

<select name="mydropdown" id="mydropdown" onchange="onChange()">

添加一个javascript函数来处理您获得所选值的位置,并将其作为参数传递给Action:

function onChange() {
    var item = document.getElementById("mydropdown").value;
    $.post('@Url.Content("ActionName")',
        { "item": item });
}

如果要显示具有选定值的系统消息框:

function onChange() {
    var item = document.getElementById("mydropdown").value;
    alert(item);
}