使用asp.net的jQuery UI对话框 - 对象不支持属性或方法'对话'

时间:2016-10-12 20:44:31

标签: javascript asp.net jquery-ui master-pages jquery-ui-dialog

我有一个使用母版页的aspx页面,当我尝试使用jQuery UI对话框时,它给了我一些问题。

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<link href="/Styles/SiteFramePage.css" rel="stylesheet" type="text/css" media="Screen"/>
<link href="Styles/ArrivalTemplate.css" rel="stylesheet" type="text/css" />
<link href="Styles/jquery-ui-1.12.1.css" rel="Stylesheet" type="text/css" />
<style type="text/css">
    .DisabledCheckout
    {
        background-color:Gray;
        color:Black;
        Width:100%;
        font-weight:bold;
    }
    body.waiting
    {
        cursor: wait;
    }
    .no-close .ui-dialog-titlebar-close {
        display: none;
    }
</style>

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.js"></script>
<script type="text/javascript" src="Scripts/jquery-ui-1.12.1.js"></script>
<script src="Scripts/SMS_JClient.js" type="text/javascript"></script>

对话框的我的div如下:

<div id="ChckDgtDialog" title="Enter Check Digit">
     <table>
        <tr>
            <td id="ChckDgtDialogError"></td>
        </tr>
        <tr>
            <td id="ChckDgtDialogPrompt">Please enter the check digit on the container.</td>
        </tr>
        <tr>
            <td align="center"><input type="text" id="ChckDgtDialogTextBox" size="50" onkeypress="isChckDgtDialogSubmit(event)" /></td>
        </tr>
    </table>
</div>

我还在页面底部有一个脚本,它将div设置为对话框。

$("#ChckDgtDialog").dialog({
        autoOpen: false,
        dialogClass: "no-close",
        width: 425,
        modal: true,
        buttons: {
            "Ok": checkDigitValidate,
            Cancel: function () {
                var dialogbox = $('#ChckDgtDialog');
                $(dialogbox).dialog("close");
            }
        },
        open: function () {
            stopTimer();
        }
    } );

Content1中有一个较长的脚本标记,$(window).load()上的脚本标记将获取数据并构建带按钮的表。在该脚本块中,有以下语句可以打开对话框:

$(":button").click(function () {

Option = $(this).text();

if (Option == "Check In") {

    $("#ChckDgtDialog").dialog("open");

}
if (Option == "Check Out") {

    $("#ChckDgtDialog").dialog("open");
}});

(还有其他逻辑使if语句更具目的性,试图只显示与问题相关的内容) 但是,单击按钮时,我们会收到错误:对象不支持属性或方法“对话框”。

我觉得奇怪的是,当我们在页面底部的脚本中设置对话框的所有属性时,没有问题。我可以告诉这部分是有效的,因为在页面上看不到div,如果我删除它是。这似乎是范围的一些问题,但我已经尝试移动在$(window).load()内设置对话框属性的部分,因为理论上,不应该在那时加载jquery ui脚本,但是我得到了在我试图打开对话框之前就出现错误。

有关为何点击按钮我们没有对话框的任何想法?我是jquery的新手,我想知道是否有一些主页或asp.net的东西可能会搞乱一些东西?

1 个答案:

答案 0 :(得分:0)

我认为,如果你在页面onload函数中放置对话框初始化代码,那将解决问题。