MVC 3: всплывающее окно jQuery, которое загружается только при выборе определенного выпадающего значения

Question

Я создал Ajax.BeginForm, который на основе значения в раскрывающемся меню должен либо публиковать значения в actionresult, либо открыть модальное всплывающее окно, которое будет содержать список элементов флажков и кнопку отправки.Это то, что у меня есть на данный момент:

        <div class="examplepanel">
            @using (Ajax.BeginForm("PostExample", new AjaxOptions() { UpdateTargetId = "ExamplePopupContainer", HttpMethod = "Post" })) 
            {
                <p>
                    @Html.Label("Exampletype: ", "ExampleTypes", "LabelTitle")<br />
                    @Html.DropDownListFor(m => m.ExampleTypes, Model.ExampleTypes, new { @id = "ExampleType" })
                </p>
                <p>
                    @Html.Label("Example comments: ", "ExampleComments", "LabelTitle")<br />
                    @Html.TextAreaFor(m => m.ExampleComments, Model.ExampleComments)
                </p>
                <p>
                    @Html.SubmitButton("Confirm", 0, "button")
                </p>
            }
        </div>

Таким образом, результатом действия может быть:

[HttpPost]
    public ActionResult PostExample(string ExampleTypes, string ExampleComments)
    {
    ...
    }

Любые идеи / примеры того, как я мог бы это сделать, будут высоко оценены.

Спасибо.

Answer 1

Ниже могут быть полезны следующие шаги.

1.Связать событие раскрытия выпадающего меню (надеюсь, вы создаете приложение MVC с помощью jquery)

$("#ExampleType").change(function(e){

//TODO: Client Business Logic

});

2.Списать внизслучаи, которые будут отвечать за открытие диалогового окна / всплывающего окна jquery.Используйте диалоговое окно jquery или другой плагин jquery для открытия всплывающего окна.

Используйте приведенный ниже синтаксис для открытия всплывающего окна.

$(<popup control id>).dialog('open')

3. Перечислите другие случаи, которые отвечают за отправку данных в действие(сервер).Используйте jquery ajax для отправки данных на сервер

Используйте приведенный ниже синтаксис для отправки данных на сервер.

$.post()

Псевдокод:

$("#ExampleType").change(function(e){
    var list_Of_Values_For_Opening_Popup_Window = ['value1','value2']; // or array of integers

    var value = $("OPTION:selected", $(this)).val();
    var is_Need_To_Post_Data = true;
    for(var i=0;i<list_Of_Values_For_Opening_Popup_Window .length;i++)
    {
         if(value==list_Of_Values_For_Opening_Popup_Window[i])//use case sensitive comparison if required.
                {
                   is_Need_To_Post_Data =false;
                   break;
                }
    }
    if(is_Need_To_Post_Data )
    {
       //TODO: Post data to server with ajax call
    }
    else
    {
       //TODO: open popup window
    }

});