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

查看:93
本文介绍了了解DropDownListFor是如何在MVC3工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是新来MVC3,并一直在使用EF和'code首先上一个小网站的工作。我试图做几件事情在处理下拉列表视图,我想知道什么是最好的方式去了解他们的是。我希望用户能够选择从DropDownList的规则,并根据选择的是哪一规则在的,我想在页面上的标签显示规则名称(不含发布)。我还需要能够对选定的规则发送到下一页。因为我在它应该如何工作的亏损我真的我还没有添加了所有必要的字段到视图呢。我应该如何去努力做到这一点?

我有我的模型:

 公共类D1K2N3CARule
{
    公众诠释ID {搞定;组; }
    [需要]
    公众诠释名称{;组; }
    [需要]
    公共字符串规则{搞定;组; }    公共D1K2N3CARule(INT名,字符串规则)
    {
        名称=名称;
        规则=规则;
    }
    公共D1K2N3CARule()
    {
        名= 0;
        规则=;
    }
}

我的视图模型:

 公共类D1K2N3CARuleViewModel
{
    公共字符串SelectedD1K2N3CARuleId {搞定;组; }
    公共IEnumerable的< D​​1K2N3CARule> D1K2N3CARules {搞定;组; }
}

我的控制器:

 公众的ActionResult指数()
    {
        VAR模型=新D1K2N3CARuleViewModel
        {
            D1K2N3CARules = db.D1K2N3DARules
        };        返回查看(模型);
    }

和我的观点:

 '@模型CellularAutomata.Models.D1K2N3CARuleViewModel@ {
    ViewBag.Title =指数;
}
< ASP:内容ID =头contentplaceholderid =头=服务器>
<脚本类型=文/ JavaScript的>
< / SCRIPT>
< / ASP:内容>
< H2>指数< / H><表>
    &所述; TR>
        &所述; TD>
            @ Html.DropDownListFor(
                X => x.D1K2N3CARules,
                新的SelectList(Model.D1K2N3CARules,ID,规则)
            )
        < / TD>
    < / TR>
< /表>'


解决方案

  

我希望用户能够选择从DropDownList的规则,并根据选择的是哪一规则在的,我想在页面上的标签显示规则名称(不含发布)


您将在这里需要的JavaScript。 jQuery的将是完美的人选。我会通过为下拉提供一个确定性的ID开始,因为如果你运行一个模板内这种观点有可能被添加到ID prefixes这会毁了我们的JavaScript ID选择(见下文):

  @ Html.DropDownListFor(
    X => x.D1K2N3CARules,
    新的SelectList(Model.D1K2N3CARules,ID,规则),
    新{ID =ruleDdl}

然后提供一些容器,将接收所选值:

 < D​​IV ID =ruleValue/>

终于在一个单独的JavaScript文件认购下拉列表的变化事件,并更新容器与所选值/文本:

  $(函数(){
    //认购下拉的变化事件
    $('#ruleDdl')。改变(函数(){
        //从下拉列表中选定的文本
        VAR selectedText = $(本).find('选项:选择)文本();        //如果你想选择的值你可以:
        // VAR了selectedValue = $(本).VAL();        //显示容器内的值
        $('#ruleValue')HTML(selectedText);
    });
});


  

我还需要能够对选定的规则发送到下一页。


您可以把您的下拉列表中选择表单中

  @using(Html.BeginForm(下一页,富))
{
    @ Html.DropDownListFor(
        X => x.D1K2N3CARules,
        新的SelectList(Model.D1K2N3CARules,ID,规则)
    )
    <输入类型=提交值=转到下一页/>
}

和下一页控制器动作将获得选择的值。

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?

I've got my model:

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 = "";
    }
}

My ViewModel:

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

My Controller:

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

        return View(model);
    }

and my View:

'@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)

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" />

and finally in a separate javascript file subscribe for the change event of the dropdown list and update the container with the selected value/text:

$(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" />
}

and the NextPage controller action will receive the selected value.

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

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆