了解 DropDownListFor 如何在 MVC3 中工作 [英] Understanding how DropDownListFor is working in MVC3

问题描述

我是 MVC3 的新手，一直在使用 EF 和代码优先"的小型站点上工作.我正在尝试在处理下拉列表的视图中做一些事情，并且想知道处理它们的最佳方法是什么.我希望用户能够从下拉列表中选择规则，并且根据选择的规则，我希望页面上的标签显示规则名称(不发布).我还需要能够将所选规则发送到下一页.我还没有将所有必要的字段添加到视图中，因为我真的不知道它应该如何工作.我应该如何尝试这样做?

I'm new to MVC3 and have been working on a small site using EF and 'Code First'. I'm trying to do a few things in a view dealing with a drop down list and am wondering what the best way to go about them is. I want a user to be able to select a rule from the dropdownlist, and depending upon which rule was selected, I would like a label on the page to show the rule name (without posting). I also need to be able to send the selected rule onto the next page. I haven't added all of the necessary fields to the view yet because I'm really at a loss on how it should work. How should I go about trying to do this?

我有我的模型:

public class D1K2N3CARule
{
    public int ID { get; set; }
    [Required]
    public int Name { get; set; }
    [Required]
    public string Rule { get; set; }

    public D1K2N3CARule(int name, string rule)
    {
        Name = name;
        Rule = rule;
    }
    public D1K2N3CARule()
    {
        Name = 0;
        Rule = "";
    }
}

我的视图模型:

public class D1K2N3CARuleViewModel
{
    public string SelectedD1K2N3CARuleId { get; set; }
    public IEnumerable<D1K2N3CARule> D1K2N3CARules { get; set; }
}

我的控制器:

    public ActionResult Index()
    {
        var model = new D1K2N3CARuleViewModel
        {
            D1K2N3CARules = db.D1K2N3DARules
        };

        return View(model);
    }

和我的观点:

'@model CellularAutomata.Models.D1K2N3CARuleViewModel

@{
    ViewBag.Title = "Index";
}
<asp:Content id="head" contentplaceholderid="head" runat="server">
<script type="text/javascript">
</script>
</asp:Content>
<h2>Index</h2>

<table>
    <tr>
        <td>
            @Html.DropDownListFor(
                x => x.D1K2N3CARules,
                new SelectList(Model.D1K2N3CARules, "ID","Rule")
            )
        </td>
    </tr>
</table>'

推荐答案

我希望用户能够从下拉列表中选择规则，并且根据选择的规则，我希望页面上的标签显示规则名称(不发布)

I want a user to be able to select a rule from the dropdownlist, and depending upon which rule was selected, I would like a label on the page to show the rule name (without posting)

您将需要在这里使用 javascript.jQuery 将非常适合这项工作.我首先会为下拉列表提供一个确定性的 id，因为如果你在模板中运行这个视图，可能会在 id 中添加前缀，这会破坏我们的 javascript id 选择器(见下文):

You will need javascript here. jQuery would be perfect for the job. I would start by providing a deterministic id for the dropdown because if you run this view inside a template there could be prefixes added to the id which would ruin our javascript id selectors (see below):

@Html.DropDownListFor(
    x => x.D1K2N3CARules,
    new SelectList(Model.D1K2N3CARules, "ID", "Rule"),
    new { id = "ruleDdl" }
)

然后提供一些接收选定值的容器:

then provide some container which will receive the selected value:

<div id="ruleValue" />

最后在一个单独的 javascript 文件中订阅下拉列表的更改事件并使用选定的值/文本更新容器:

$(function() { // subscribe for the change event of the dropdown $('#ruleDdl').change(function() { // get the selected text from the dropdown var selectedText = $(this).find('option:selected').text(); // if you wanted the selected value you could: // var selectedValue = $(this).val(); // show the value inside the container $('#ruleValue').html(selectedText); }); });

<块引用>

我还需要能够将所选规则发送到下一页.

I also need to be able to send the selected rule onto the next page.

您可以将下拉列表放在表单中

You could put your dropdown inside a form

@using (Html.BeginForm("NextPage", "Foo"))
{
    @Html.DropDownListFor(
        x => x.D1K2N3CARules,
        new SelectList(Model.D1K2N3CARules, "ID","Rule")
    )    
    <input type="submit" value="Go to the next page" />
}

并且 NextPage 控制器操作将接收选定的值.

and the NextPage controller action will receive the selected value.

这篇关于了解 DropDownListFor 如何在 MVC3 中工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！