Ajax JQuery令人厌恶的模态对话框mvc3

时间:2012-02-15 07:32:19

标签: jquery ajax asp.net-mvc-3 modal-dialog

我正在编辑popup中的一些内容:

public class HomeController : Controller {
    //
    // GET: /Home/

    public ActionResult Index() {
        return View();
    }

    public ActionResult Show() {
        return PartialView("ShowControl");
    }

}

Index.cshtml

<!DOCTYPE html>
<html>
<head>
    @{
        ViewBag.Title = "Index";
    }
    <link rel="icon" type="image/png" href="@Url.Content("~/Content/Images/favicon.png")" />
    <link href="@Url.Content("~/Content/jquery-ui.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-1.6.4.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.8.16.custom.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
    @Ajax.ActionLink("Show", "Show", new AjaxOptions
{
    UpdateTargetId = "modal-dialog-container",
    InsertionMode = InsertionMode.Replace
})
<div id="modal-dialog-container">
</div>
</body>
</html>

ShowControl.cshtml

<script src="@Url.Content("~/Scripts/jquery.bgiframe-2.1.2.js")" type="text/javascript" />
<script type="text/javascript">
$(function () {
    $("#dialog").dialog({
        height: 200,
        width: 250,
        modal: true,
        resizable: false,
    });
});
</script>
<div id="dialog" title="Ttile">
@using (Ajax.BeginForm("Show", "Home", FormMethod.Post, new AjaxOptions { 
 UpdateTargetId = "modal-dialog-container",
InsertionMode = InsertionMode.Replace
})) {
        <p>
            Content</p>
        <p>
            <input type="submit" value="Submit" />
            @Html.ActionLink("Go Home", "Index")
        </p>
 }
</div>

问题是按下提交将重新创建新的模态对话框,并且不会破坏旧的模式对话框。 如何解决这个问题。

提前致谢。

0 个答案:

没有答案