带有ASP.Net按钮控件的Jquery对话框

时间:2013-09-19 16:39:45

标签: c# jquery

我在数据表中获得成功结果后,从代码隐藏中调用此函数。

的JavaScript

function ReportPossibilities() {
    $(document).ready(function () {
        var dlg = $('#ctl00_ContentPlaceHolder1_pnlReportDetails').dialog({
            show: 'slide',
            hide: 'blind',
            modal: true,
            minHeight: 150,
            minWidth: 600
        });
        $(".ui-dialog-titlebar").hide();
        dlg.parent().appendTo($("form:first"));
    });
}

ASPX

<asp:Panel ID="pnlReportDetails" runat="server" style=" display:none;">
<table>
<tr>
    <td style="padding: 4px; font-weight: bold; font-family: Arial, Helvetica, sans-serif;
            font-size: .78em; font-variant: normal;" colspan="3">
                <asp:Label ID="lblMsg" runat="server"></asp:Label>
    </td>
</tr>
<tr>
    <td></td>
    <td colspan="3">
        <div id="ReportDetails">
            <asp:GridView ID="gvReportDetails" runat="server" AutoGenerateColumns="False" DataKeyNames="ReportID,ExistingColumnID" CssClass="box-table-a" Height="50px" BorderColor="Black" BorderWidth="1px">
                <RowStyle CssClass="row_odd" />
                <AlternatingRowStyle CssClass="row_even" />
                <Columns>
                    <asp:BoundField DataField="ReportId" Visible="false" />
                    <asp:BoundField DataField="ExistingColumnID" Visible="false" />
                    <asp:TemplateField HeaderText="Report Name">
                        <ItemTemplate>
                            <asp:CheckBox runat="server" ID="cbSelect" />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Report Name">
                        <ItemStyle CssClass="ItemPixel" />
                        <ItemTemplate>
                            <asp:Label ID="lbReportName" runat="server" Text='<%#Bind("ReportName")%>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Existing Column">
                        <ItemStyle CssClass="ItemPixel" />
                        <ItemTemplate>
                            <asp:Label ID="lbExtCol" runat="server" Text='<%#Bind("ExistingCalc")%>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
            <ajaxToolkit:RoundedCornersExtender Corners="All" Radius="4" TargetControlID="Panel2" ID="RoundedCornersExtender1" runat="server" />
        </div>
    </td>
</tr>
<tr>
    <td align="center" colspan="3">
        <asp:Button ID="btnSubmitRptDetails" runat="server" Text="Submit" OnClick="btnSubmitRptDetails_Click" />
    </td>
</tr>
</table>
</asp:Panel>

代码隐藏

   Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "ReportPossibilities", "ReportPossibilities()", true);

这段代码适用于IE,但不适用于Google Chrome和Firefox。如果有人专注于我的错误,会很高兴。

1 个答案:

答案 0 :(得分:1)

当我使用1.10版本的Jquery ui时,我添加了以下代码,它适用于所有浏览器。

  $(document).ready(function () {
            var dlg = $('#ctl00_ContentPlaceHolder1_pnlReportDetails').dialog({
                show: 'slide',
                hide: 'blind',
                modal: true,
                minHeight: 150,
                appendTo: "form:first", // added 
                minWidth: 600

            });

        });