Выбираемые изображения «кнопок» с ASP.NET MVC

Question

Я пытаюсь создать страницу, которая содержит форму с одним полем, представленным списком изображений.Пользователь выберет одно из изображений, введет дополнительную информацию и нажмет кнопку, чтобы отправить данные обратно на сервер.

Мне удалось создать список, используя оператор for-each с элементами div.обеспечение правильного расположения и потока.Я рассмотрел использование подключаемого модуля jQuery Selectable для управления выбором из списка, выделения выделенного элемента и т. Д., Но застрял в том, как я отправляю выбранную информацию обратно на сервер.

Сначала яНужен способ встраивания идентификатора для каждого элемента в HTML.Затем мне нужно отправить значение выбранного элемента на сервер при отправке формы.

Я на правильном пути или движусь в неправильном направлении?Как я могу сделать эту работу?

Answer 1

Я пока не могу проголосовать :( - но ты мой герой. Отличное решение.

Если это кому-нибудь поможет, то одна небольшая настройка.

Добавление:

cancel: "a"

рядом с фильтром позволит ссылкам в выбранных элементах по-прежнему работать

Answer 2

Не уверен, что это лучший способ сделать это, но после того, как я наткнулся на это в течение многих часов, вот что я придумал:

<style type="text/css">
    .ui-selected
    {
        background-color:Yellow;
    }
</style>

<script type="text/javascript">
    $(function () {
        $("#buttons").selectable(
        {
            filter: "div",
            selected: function (e, ui) {
                var value = $(ui.selected).children("input").first().val();

                $("#SelectedValue").val(value);
            }
        });
    });
</script>

<% using (Html.BeginForm())
   { %>
    <%= Html.Hidden("SelectedValue") %>
<% } %>

<div id="buttons">
    <% foreach (var item in Model.Items)
       { %>
        <div class="image_button_large"
             style="float:left;"
             title="<%= Html.Encode(item.Name) %>"
             >
            <div class="button_image">&nbsp;</div>
            <%= Html.Encode(item.Name) %>
            <%= Html.Hidden("itemId", item.ID) %>
        </div>
    <% } %>
</div>