Jquery dialogue box with ASP.Net button control

Question

I'm calling this function from code-behind after getting successful result in datatable.

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>

Code-behind

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

This piece of code works in IE but not in google chrome and Firefox. Will be glad if someone focuses at my mistake.

can you explain how are you calling jQuery from code behind. — Arjun Vachhani
– Arjun Vachhani, Commented Sep 19, 2013 at 16:45
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "ReportPossibilities", "ReportPossibilities()", true); — rach
– rach, Commented Sep 19, 2013 at 17:45

rach · Accepted Answer · 2013-09-19 19:50:21Z

1

As I am using 1.10 version of Jquery ui, I added following code and it worked on all browsers.

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

            });

        });

answered Sep 19, 2013 at 19:50

rach

6792 gold badges8 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Jquery dialogue box with ASP.Net button control

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related