时间戳

首页 > 解决方案 > jquery modal 不显示与 asp.net 母版页

jquery - jquery modal 不显示与 asp.net 母版页

问题描述

我正在尝试使用以下代码显示 jquery 模式弹出窗口：

 protected void gvGroupSummary_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            try
            {
                int index = Convert.ToInt32(e.CommandArgument);
                if (e.CommandName.Equals("detail"))
                {
                    int code = Convert.ToInt32(gvGroupSummary.DataKeys[index].Value.ToString());
                    IEnumerable<DataRow> query = from i in dt.AsEnumerable()
                                                 where i.Field<int>("GroupID").Equals(code)
                                                 select i;
                    DataTable detailTable = query.CopyToDataTable<DataRow>();
                    DetailsView1.DataSource = detailTable;
                    DetailsView1.DataBind();
                    System.Text.StringBuilder sb = new System.Text.StringBuilder();
                    sb.Append(@"<script type='text/javascript'>");
                    sb.Append("$('#detailModal').modal('show');");
                    sb.Append(@"</script>");
                    ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "DetailModalScript", sb.ToString(), false);
                }

            }
            catch (Exception ex)
            {
                System.Console.Error.Write(ex.Message);
            }
        }

HTML 是：

 <!-- Detail Modal Starts here-->
    <div id="detailModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="myModalLabel">Detailed View</h3>
        </div>
        <div class="modal-body">
            <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                <ContentTemplate>
                    <asp:DetailsView ID="DetailsView1" runat="server" CssClass="table table-bordered table-hover" BackColor="White" ForeColor="Black" FieldHeaderStyle-Wrap="false" FieldHeaderStyle-Font-Bold="true" FieldHeaderStyle-BackColor="LavenderBlush" FieldHeaderStyle-ForeColor="Black" BorderStyle="Groove" AutoGenerateRows="False">
                        <Fields>
                            <asp:BoundField DataField="GroupID" HeaderText="Group ID" />
                            <asp:BoundField DataField="GroupCode" HeaderText="Group Code" />
                            <asp:BoundField DataField="GroupName" HeaderText="Group Name" />
                            <asp:BoundField DataField="GroupType" HeaderText="Group Type" />
                              <asp:BoundField DataField="PreviousEstimateCosts" HeaderText="Previous Estimate Costs" />
                             <asp:BoundField DataField="TotalEstimates" HeaderText="Total Estimate Costs" />
                             <asp:BoundField DataField="PreviousEstimateVariance" HeaderText="Previous Estimate Variance" />
                             <asp:BoundField DataField="TotalActuals" HeaderText="Total Actual Costs" />
                             <asp:BoundField DataField="EstimateActualVariance" HeaderText="Estimate Actual Variance" />
                             <asp:BoundField DataField="EstimateActualVariancePct" HeaderText="Estimate Actual Variance PCT" />
                             <asp:BoundField DataField="FinancialYear" HeaderText="Financial Year" />
                             <asp:BoundField DataField="HasComments" HeaderText="Comments" />
                        </Fields>
                    </asp:DetailsView>
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="gvGroupSummary" EventName="RowCommand" />
                </Triggers>
            </asp:UpdatePanel>
            <div class="modal-footer">
                <button class="btn btn-info" data-dismiss="modal" aria-hidden="true">Close</button>
            </div>
        </div>
    </div>
    <!-- Detail Modal Ends here -->

我已经在没有母版页的情况下测试了代码，它可以工作。当我使用母版页并单击“详细信息”按钮时，主页会变暗，但不会出现弹出窗口。在研究了这个问题之后，看来问题出在这部分，但我不知道如何改变它：

 sb.Append(@"<script type='text/javascript'>");
                    sb.Append("$('#detailModal').modal('show');");
                    sb.Append(@"</script>");
                    ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "DetailModalScript", sb.ToString(), false);

任何帮助将非常感激！

标签： jqueryasp.netmodal-dialog

解决方案

试试这个 VB.NET 版本

Dim sb As StringBuilder = New StringBuilder()
sb.Append("$(document).ready(function() {$('#Your_Modal').modal();});")
ScriptManager.RegisterClientScriptBlock(Me, [GetType](), "none", sb.ToString, True)

推荐阅读