JQuery对话框无法从C#打开

时间:2013-12-28 18:56:11

标签: c# javascript jquery asp.net dialog

我在使用C#codebehind打开JQuery Dialog时遇到问题。它适用于我所做的其他页面,但在这个页面上它不起作用。 我已经尝试了thisthisthisthis。但是我错过了一些东西。

基本上,左边是一个带有GridView的表,右边是带有图像按钮的计数器。我要做的是向用户显示一个对话框,确认他是否想在点击停止按钮(btnZerar)时重置计数器。

我在#StopDialogConfirm上放了一个断点,它只在加载页面时才会到达,但是单击该按钮时没有到达。没有javascript错误。

关注我的代码示例:

ASPX:

<asp:Content ID="scriptsHeader" ContentPlaceHolderID="FeaturedContent" runat="server">
<script type="text/javascript" src="/Scripts/Pages/EstudeCiclos.js"></script>
<script type="text/javascript" src="/Scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.20.min.js"></script>
</asp:Content>
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">    
<asp:UpdatePanel ID="updPanelEstudeCiclos" UpdateMode="Conditional" runat="server"> <ContentTemplate>
...
                <div>
                    <asp:ImageButton ID="btnPlay" runat="server" OnClick="btnPlayClick" ImageUrl="~/Images/play.jpg" Height="40px" Width="40px" AlternateText="Começar a contar o tempo" />
                    <asp:ImageButton ID="btnPause" runat="server" OnClick="btnPauseClick" ImageUrl="~/Images/pause.jpg" Height="40px" Width="40px" AlternateText="Parar tempo" />
                    <asp:ImageButton ID="btnZerar" runat="server" OnClick="btnZerarClick" ImageUrl="~/Images/stop.jpg" Height="40px" Width="40px" AlternateText="Zerar tempo" />
                    <asp:ImageButton ID="btnSalvar" runat="server" OnClick="btnSalvarClick" ImageUrl="~/Images/save.jpg" Height="40px" Width="40px" AlternateText="Salvar tempo" />
                </div>
...
    <div>
        <asp:Button ID="btnStop" runat="server" OnClick="btnStop_Click" Style="display: none;" ClientIDMode="Static" />
    </div>
</ContentTemplate> </asp:UpdatePanel>

CodeBehind - 代码注释掉了我尝试过的东西。当我尝试打开警报时,它可以正常工作。

    private void OpenQuestionDialog(string functionName, string question)
    {
        string s = "$(function(){$('#" + functionName + "').dialog('open').text('" + question + "');});";

        //ScriptManager.RegisterStartupScript(Page, this.GetType(), "Dialog", s, true);

        ScriptManager requestSM = ScriptManager.GetCurrent(this);
        if (requestSM != null && requestSM.IsInAsyncPostBack)
        {
            ScriptManager.RegisterClientScriptBlock(this,
                                                    typeof(Page),
                                                    Guid.NewGuid().ToString(),
                                                    s,
                                                    true);
        }
        else
        {
            ClientScript.RegisterClientScriptBlock(typeof(Page),
                                                   Guid.NewGuid().ToString(),
                                                   s,
                                                   true);
        }
    }


    protected void btnZerarClick(object sender, EventArgs e)
    {
        OpenQuestionDialog("StopDialogConfirm", "Are you sure you want to reset the counter?");
    }

脚本(EstudeCiclos.js):

$(function () {
$('#StopDialogConfirm').dialog({
    autoOpen: false,
    width: 450,
    modal: true,
    buttons: {
        "Não": function ()
        {
            $(this).dialog("close");
        },
        "Sim": function ()
        {
            $(this).dialog("close");
            $('#btnStop').click();
        }
    }
});
});

请帮忙!谢谢!

2 个答案:

答案 0 :(得分:0)

可能的问题是RegisterClientScriptBlock生成的脚本是在页面的开头添加的,因此可能是没有加载或初始化相应的jQuery库。

有几种可能的尝试:

  1. 请改用RegisterStartupScript,因为它是在加载页面后执行的。如果在窗口onload方法中初始化jquery,这仍然可能无效。

  2. 将要执行的方法添加到window.onload或内部pageLoad方法,而不是直接在页面中。

  3. (我的偏好)将按钮执行代码更改为完全客户端。如果您只是打开一个弹出窗口并且页面上不需要任何内容​​,则没有理由执行完整的回发。

答案 1 :(得分:0)

这需要在document.ready function

function FlceSaveConfirmation() {
            $(function () {
                $("#dialog-flce").dialog({
                    resizable: false,
                    height: 200,
                    modal: true,
                    buttons: {
                        Ok: function () {

                            $("#tabs").tabs('option', 'enable', [4, 5, 6]);
                            FlceCeLevelInfo();
                            $(this).dialog("close");
                            //SelectParticularTab();
                        }
                    }
                });
            });
        }

在代码背后

Page . ClientScript . RegisterStartupScript ( this . GetType ( ) , "CallMyFunction" , "FlceSaveConfirmation()" , true );