Question

在对话框中快速显示视图，然后对话框消失，视图在主体中再次可见，就好像将禁用javascript一样。

我错了什么？我只想在控制器中调用Create动作的对话框中显示Create视图。

索引视图：

@{
    Layout = null;   
 }

 <script type="text/javascript">

    $(function () {
        $('#dialog').dialog({
            autoOpen: false,
            width: 300,
            resizable: false,
            title: 'Create Template',
            modal: true,
            open: function(event, ui) {               
                $(this).load("@Url.Action("Create")");
            },
            buttons: {
                "Close": function () {
                    $(this).dialog("close");
                }
            }
        });

        $('#CreateTemplate').click(function ()
        {
            $('#dialog').dialog('open');
        });
    });

<div id="dialog" title="Create Template" style="overflow: hidden;"></div>
<div id="MenuBarDiv">   
    <a id="CreateTemplate" href="..\Template\Create">Create Template</a>
</div>
<div id="LeftDiv">
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod
    teimata sanctus est Lorem
    ipsum dolor sit amet.
</div>
<div id="RightDiv">
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod
    tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero
    eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea

</div>
<div class="clear">
</div>

控制器：

  [HttpGet]
    public ActionResult Create()
    {
      return View("Create");
    }

Answer 1

在锚点击处理程序中，您没有取消默认操作，因此浏览器只需重定向到锚点的href，而不会留下任何时间让对话框显示。如果您想要停留在同一页面上，则需要通过返回false来取消此默认操作：

$('#CreateTemplate').click(function () {
    $('#dialog').dialog('open');
    return false;
});

另外，请确保Create.cshtml部分已取消布局（Layout = null）或让您的创建操作返回PartialView而不是View，以避免获得对话框内的完整布局。

您的代码的另一个改进是替换以下硬编码锚：

<a id="CreateTemplate" href="..\Template\Create">Create Template</a>

使用html帮助程序，以确保它生成适当的URL，尊重您的路由配置：

@Html.ActionLink(
    "Create Template",             // linkText
    "Create",                      // actionName
    "Template",                    // controllerName
    null,                          // routeValues
    new { id = "CreateTemplate" }  // htmlAttributes
)

PartialView在jquery对话框中持续一秒钟

1 个答案: