Понимание того, как DropDownListFor работает в MVC3 - PullRequest
Новая
       33

Понимание того, как DropDownListFor работает в MVC3

3 голосов
/ 24 февраля 2011

Я новичок в MVC3 и работаю на небольшом сайте, используя EF и «Code First». Я пытаюсь сделать несколько вещей, связанных с выпадающим списком, и мне интересно, как это лучше всего сделать. Я хочу, чтобы пользователь мог выбрать правило из выпадающего списка, и в зависимости от того, какое правило было выбрано, я бы хотел, чтобы на странице была метка для отображения имени правила (без публикации). Мне также нужно иметь возможность отправить выбранное правило на следующую страницу. Я еще не добавил все необходимые поля в представление, потому что действительно не знаю, как оно должно работать. Как мне попытаться сделать это?

У меня есть моя модель: 

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

Моя ViewModel: 

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

1 Ответ

4 голосов
/ 24 февраля 2011

Я хочу, чтобы пользователь мог выбрать правило из выпадающего списка, и в зависимости от того, какое правило было выбрано, я бы хотел, чтобы на странице была метка для отображения имени правила (без публикации)

Вам понадобится JavaScript здесь. JQuery идеально подходит для работы. Я хотел бы начать с предоставления детерминированного идентификатора для раскрывающегося списка, потому что если вы запустите это представление внутри шаблона, к идентификатору могут быть добавлены префиксы, которые разрушат наши селекторы идентификаторов JavaScript (см. Ниже): 

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

затем укажите контейнер, который получит выбранное значение: 

<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);
    });
});

Мне также нужно иметь возможность отправить выбранное правило на следующую страницу.

Вы можете поместить свой выпадающий список в форму 

@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 получит выбранное значение.

...