我正在尝试在我的 ASP.NET MVC 应用程序中使用 JQuery UI Dialog 插件。我的问题是当我加载页面时,Chrome 控制台在 jquery-ui-min.js 文件中给出以下错误。
JQuery UI Dialog - Uncaught TypeError: Cannot call method 'getTitleId' of undefined
我正在我的布局页面中加载所有 js 和 css 文件。以下是我的 JQuery 对话框事件。
$('.button').live('click', function () {
$('.dialog').dialog('open');
});
$('.dialog').dialog({
autoOpen: false,
buttons: {
'Ok': function () {
$(this).dialog('close');
}
}
});
这两个事件位于一个单独的 .js 文件中,该文件也加载到布局页面中。(此文件加载正确,已调试。)
在我的部分视图中,我有以下一段 html 用于对话框。
<input type="button" value="Add Value" class="button" />
<div class="dialog">
I am dialog.
</div>
当我删除对话框的 JQuery 事件时,错误消失了。
有任何想法吗 ?提前致谢。
编辑 :
下面是我的布局页面中的标签内部。
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title </title>
<link href='http://fonts.googleapis.com/css?family=Cuprum' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="../../Scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-ui.min.js"></script>
<link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../../Scripts/plugins/spinner/jquery.mousewheel.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/spinner/ui.spinner.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wysiwyg/jquery.wysiwyg.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wysiwyg/wysiwyg.image.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wysiwyg/wysiwyg.link.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wysiwyg/wysiwyg.table.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/jquery.flot.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/jquery.flot.orderBars.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/jquery.flot.pie.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/excanvas.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/jquery.flot.resize.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/tables/jquery.dataTables.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/tables/colResizable.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/forms.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/autogrowtextarea.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/autotab.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.validationEngine-en.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.validationEngine.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.dualListBox.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/chosen.jquery.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.maskedinput.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.inputlimiter.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/other/calendar.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/other/elfinder.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/uploader/plupload.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/uploader/plupload.html5.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/uploader/plupload.html4.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/uploader/jquery.plupload.queue.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.progress.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.jgrowl.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.tipsy.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.alerts.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.colorpicker.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wizards/jquery.form.wizard.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wizards/jquery.validate.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.breadcrumbs.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.collapsible.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.ToTop.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.listnav.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.sourcerer.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.timeentry.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.prettyPhoto.js"></script>
// This is the file in which my dialog events are located.
<script type="text/javascript" src="../../Scripts/custom.js"></script>
<meta name="viewport" content="width=device-width" />
</head>