0

我正在尝试在本教程中实现弹出的联系我们对话框：http: //www.matthidinger.com/archive/2011/02/22/Progressive-enhancement-tutorial-with-ASP-NET-MVC-3-和-jQuery.aspx

我有一个运行良好的解决方案的工作版本。

在尝试将其集成到我自己的解决方案中时，我遇到了问题。

我在我的脚本目录中创建了一个contactdialog.js 文件：

    /// <reference path="jquery-1.6.2.min.js"/>
/// <reference path="jquery-ui-1.8.11.js"/>
$.ajaxSetup({ cache: false });

$(document).ready(function () {
    $(".openDialog").live("click", function (e) {
        e.preventDefault();

        $("</div>")
        .addClass("dialog")
        .attr("id", $(this)
        .attr("data-dialog-id"))
        .appendTo("body")
        .dialog({
            title: $(this).attr("data-dialog-title"),
            close: function () { $(this).remove() },
            modal: true
        })
        .load(this.href);
    });

    $(".close").live("click", function (e) {
        e.preventDefault();
        $(this).closest(".dialog").dialog("close");
    });
});

然后在我看来，我接近顶部：

<script src="~/Scripts/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
<script src="~/Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script>
<script src="~/Scripts/contactdialog.js" type="text/javascript"></script>

再往下：

@Html.ActionLink("Contact Us", "ContactUs", "Home", null, new { @class = "openDialog", data_dialog_id = "emailDialog", data_dialog_title = "Contact Us"})

现在我的链接成功进入了 javascript 函数，并且似乎添加类 OK。但是，当它到达 .dialog 函数时，它会引发以下异常：“对象不支持属性或方法对话框”

这似乎表明 jquery-UI 尚未加载。
但是我不知道为什么？如果我在 Chrome 中加载页面并检查页面源，则 jquery-ui-1.8.11.js 的链接可以愉快地打开。

4

2 回答 2

1

我已更改为使用捆绑：

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")        
@Scripts.Render("~/bundles/contact")

由于目前完全超出我的原因，这已经让它进入​​了生活，现在正在呈现对话！

于 2012-09-05T10:05:07.457 回答
1

一些提示：

jqueryUI 是否被另一个局部视图加载（这就是为什么您会在开发人员工具中看到它被加载）但是调用 .dialog 的 JS 正在以不同的局部视图呈现？

尝试将 jqueryUI 放在主/布局视图中？

于 2012-09-04T18:28:12.447 回答