jquery - 如何在 jQuery UI 对话框中加载页面

标签 jquery razor

我正在尝试在 jQuery 对话框中加载另一个页面。我已经看过很多文章(包括下面的文章)。看来公认的技术是:

$(function () {
        $(document).ready(function () {
                var d1= $('#dialog-import').dialog({
                resizeable: false,
                height: 600,
                modal: true,
                autoOpen: false,
                buttons: {
                    'My button1': function () {
                        $(this).dialog('close');
                    },
                    Cancel: function () {
                        $(this).dialog('close');
                    }
                }
            });

            d1.load('/DataSets/ImportSpreadsheet/91D55CAC-6C2C-46EE-8730-0DBFE26D1D92').dialog('open'); 

        });
    });

这将打开对话框,包括完整的内容和我的两个对话框按钮,但是,这两个对话框按钮不起作用(我无法单击它们)。

代码的其他替代方案,例如:

 $('#dialog-import').load('/DataSets/ImportSpreadsheet/' + a, function () {
                $('#dialog-import').dialog('open');
            });

导致 Google 开发者控制台出现此错误:

Uncaught TypeError: Object [object Object] has no method 'dialog' 

我一定是错过了一些愚蠢的事情。不过,我真的仔细看了一遍,没有任何运气。

谢谢。

这就是我正在尝试做的事情,尝试了他们的建议但没有成功:

jQuery Modal dialog onclick

dialog in jQuery

how to load a page with jquery ui dialog

Load another page in the dialog

Jquery dialog to open another page

最佳答案

事实证明,问题是我试图加载一个包含 header、body、html 元素的完整页面。 jQuery 不喜欢这样。

我找到了两种可能的解决方案:

  1. 使用 C# MVC 部分 View 。确保分部 View 不包含 header、html 等元素。使用原始问题中的代码可以正常工作。

  2. 使用 iFrame 元素,并加载您要查找的页面并更改 src 属性,如下面的代码所示。

    $('#selector').click(function () {
    $('#dialog-import').attr('src','/DataSets/ImportSpreadsheet/...'); $('#dialog-import').dialog('open');
    });

尽管如此,我还是对这么多人说他们不必担心 header/body 标签感到困惑,就像这篇文章隐含地说:ASP.NET Mvc jquery ui dialog as view or partialview?

我将继续研究,但遇到我同样问题的人可能会发现这很有用。

关于jquery - 如何在 jQuery UI 对话框中加载页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13574847/

相关文章:

jquery - 从 jQueryui Autocomplete 调用获取 HTTP 状态代码

javascript - 使用javascript滚动时,如何使导航栏中的当前书签菜单自动突出显示?

content-type - 如何设置 WebMatrix/Razor 响应的内容类型?

asp.net-mvc-3 - asp.net MVC 模型如何生成输入名称?

c# - MVC3模型数据分离

javascript - 将键盘焦点设置为 <div>

javascript - 将数据加载到我不知道列的数据表中

jQuery mouseleave 如果下一个悬停 id 不等于 'X' 则删除

c# - 使用 Html.Action 将参数传递给局部 View

asp.net-mvc-3 - 将 asp.net mvc 3 + Razor 与 Ajax 和 jquery 结合使用