从ASP.NET MVC下的jquery生成的弹出窗口提交表单

我试图复制类似于StackOverflow上'标记'功能的东西，其中用户点击'删除'链接。然后他们会显示一个弹出窗口（使用jQuery），提示他们为什么要删除该项目。通过一系列单选按钮以及“其他”文本框，向他们展示了一些预定义的选项。他们必须在提交表单之前选择其中一个选项，然后再执行一些服务器操作，然后最初的弹出消失（并且我会在几个位置操纵一些文本）。从ASP.NET MVC下的jquery生成的弹出窗口提交表单

我已经得到了弹出窗口，并且我在这个弹出窗口中提供了一个带有各种选项的窗体，但是我不确定如何处理这个窗体的发布。如果我将它视为一种正常形式，当用户在弹出窗口中单击提交按钮时，它将不会执行任何ajax功能，而是发布到我的控制器操作方法之一，然后我需要（服务器端）重定向回我的页面，以查看更改。

在AJAX类型场景中，通常如何处理弹出窗口中的数据集合？任何人都可以提供任何例子吗？我看不出“标志”功能是如何做到的。

来源

2012-07-05 marcusstarnes

您可以使用内置的MVC AJAX帮助程序。大致如下......

声明一些AJAX选项：

@{ 
    AjaxOptions ajaxOpts = new AjaxOptions { UpdateTargetId = "target" }; 
}

然后使用AJAX BeginForm方法声明表单：

@using (Ajax.BeginForm("GetData", ajaxOpts)) 
{ 
    @* Here you put your form data. I'm guessing your popup could just be a DIV that gets positioned and made visible *@ 


}

你的目标，更新，当AJAX请求回来只是一个简单的DIV：

<div id="target"> 
    @* The output of your GetData controller method will end up here *@ 
    @Html.Action("GetData", new { model = Model }) 
</div>

然后在你的控制器中有东西在返回包含您的数据的部分视图：

public PartialViewResult GetData(ViewModel model) 
    { 
    // Do some stuff here to fetch some data 
    // ViewModel will be whatever your view model is called 

    return this.PartialView("GetData", model); 
    }

这是获取AJAX工作的基础知识。如果您想要将HTML发回浏览器并更新页面的不同位，您必须添加一个jQuery函数，通过为AjaxOptions的OnComplete参数指定一个函数来获取AJAX帮助程序。

来自您的部分视图的数据可能会包含一些隐藏的HTML块，您可以在浏览器中的其他位置移动该块。

不幸的是，MVC AJAX帮助程序只支持一个UpdateTargetId。

编辑补充

你需要在你的web配置文件来设置此在的appSettings：

<add key="UnobtrusiveJavaScriptEnabled" value="true"/>

您还需要包括在HTML输出jQuery的扩展名（也许在你的_Layout.cshtml文件？）：

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>

来源

2012-07-05 14:49:30

您可以重写表单的提交行为，然后将序列化的表单结果发送到AJAX帖子中的服务器。

$('#myForm').submit(function() { 

    $.ajax({ 
     url: "MyPage.aspx", 
     type: "POST", 
     data: $(this).serialize(), 
     dataType: "text" 
    }); 

    return false; 
});

来源

2012-07-05 14:26:59

从ASP.NET MVC下的jquery生成的弹出窗口提交表单

回答

相关问题