如何解决MVC 3:仅在选择特定的下拉值时加载的jQuery弹出窗口
| 我创建了一个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\",\"button\")
</p>
}
</div>
因此,动作结果可能是:
[HttpPost]
public ActionResult PostExample(string ExampleTypes,string ExampleComments)
{
...
}
我将如何解决这个问题的任何想法/示例将不胜感激。
谢谢。
解决方法
以下步骤可能会有所帮助。
1.绑定下拉菜单的on change事件(希望您正在使用jquery构建MVC应用)
$(\"#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
}
});