JQueryUI Dialog在JS文件中不起作用

时间:2011-10-02 06:30:09

标签: jquery asp.net jquery-ui

我有调用Ajax的JQuery代码,为了重用相同的代码,我将代码放在.JS文件中。

以下是该方案。

1)我的aspx页面中有超链接控件和div控件。 div控件用于显示JQueryUI对话框消息。

2)我有JS文件接收超链接对象和div对象的引用

3)在JS文件中我通过JQuery Ajax插入记录,它运行良好,但问题是它没有显示JQuery UI对话

代码

在Aspx文件中

<asp:HyperLink ID="hlInsertRecord" runat="server" Text="Insert Record" Font-Bold="true" />

<div id="pnlInsertRecordMsg" title="Insert Record"></div>

在Aspx.cs文件中(javascript函数的绑定参考)

string strInsertRecord = "InsertRecord(" + hlInsertRecord.ClientID + ",pnlInsertRecordMsg);return false;";
            hlInsertRecord.Attributes.Add("onclick", strInsertRecord);

请注意:autoOpen:true我已经通过取消注释打开对话框来检查我的代码 在.JS文件中

function InsertRecord(hlInsertRecord, pnlInsertRecordMsg) {
    $(document).ready(function () {

        //--------Message Box Start-------------------
        // increase the default animation speed to exaggerate the effect
        $.fx.speeds._default = 900;
        $(function () {
            $(pnlInsertRecordMsg.id).dialog({
                autoOpen: true,
                resizable: false,
                show: "highlight",
                hide: "fade"
            });

            //            $(hlInsertRecord.id).click(function () {
            //                $(pnlInsertRecordMsg.id).dialog("open");
            //                return false;
            //            });
        });
        //--------Message Box End-------------------



        pnlInsertRecordMsg.innerHTML = "Please wait, we are sending your request...";
        $.ajax({
            type: "POST",
            url: hlInsertRecord.href,
            success: OnInsertRecordSuccess,
            error: OnInsertRecordFail
        });
        //});

        function OnInsertRecordSuccess(response) {
            hlInsertRecord.innerHTML = "Record Inserted";
            pnlInsertRecordMsg.innerHTML = response;
            setTimeout(function () { $(pnlInsertRecordMsg.id).dialog("close"); }, 2000);
        }

        function OnInsertRecordFail(response) {
            pnlInsertRecordMsg.innerHTML = "Oops we are unable to send your request.  Please try again!!!";
            setTimeout(function () { $(pnlInsertRecordMsg.id).dialog("close"); }, 10000);
        }

    });
}

1 个答案:

答案 0 :(得分:1)

我没理解你为什么使用这个$(pnlInsertRecordMsg.id)
我认为这里应该 $('#pnlInsertRecordMsg')。对话框
如果我错了,请纠正我。