Bootstrap Modal无法与asp.net Web应用程序一起使用

如何解决Bootstrap Modal无法与asp.net Web应用程序一起使用

因此，我在asp.net中有一个Web表单。在该Web表单上，有一个GridView。当用户单击gridview上的视图详细信息时，我希望一个模式弹出窗口显示该类别中的商店列表。我一直在尝试不同的东西，但是模态没有出现。下面是我的前端代码：

            <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

            <asp:UpdatePanel ID="UpdatePanel1" runat="server">

                <ContentTemplate>

                    <div id="DetailsModal" class="modal fade" role="dialog">

                        <div class="modal-dialog">

                            <div class="modal-content">

                                <div class="modal-header">
                                    <asp:Label ID="lblHead" runat="server" Text="List of stores:" CssClass="h4"></asp:Label>
                                </div>

                                <div class="modal-body">

                                    <asp:Table ID="tblJobs" runat="server" CssClass="tblStoresView" GridLines="Both" CellPadding="6" CellSpacing="6" Visible="False">
                                        <asp:TableRow runat="server">

                                            <asp:TableCell runat="server">
                                                <asp:Label ID="Label1" runat="server" Text="Store Name"></asp:Label>
                                            </asp:TableCell>

                                            <asp:TableCell runat="server">
                                                <asp:Label ID="lblPost" runat="server" Text=""></asp:Label>
                                            </asp:TableCell>

                                        </asp:TableRow>

                                        <asp:TableRow runat="server">

                                            <asp:TableCell runat="server">
                                                <asp:Label ID="Label2" runat="server" Text="Floor"></asp:Label>
                                            </asp:TableCell>

                                        </asp:TableRow>

                                        <asp:TableRow runat="server">

                                            <asp:TableCell runat="server">
                                                <asp:Label ID="Label5" runat="server" Text="Store number"></asp:Label>
                                            </asp:TableCell>

                                            <asp:TableCell runat="server">
                                                <asp:Label ID="lblType" runat="server" Text=""></asp:Label>
                                            </asp:TableCell>

                                        </asp:TableRow>

                                </asp:Table>

                                </div>

                                <div class="modal-footer">
                                    <asp:Button ID="BtnView" CssClass="button" runat="server" Text="View" Visible="False" OnClick="BtnView_Click" />
                                </div>

                            </div>

                        </div>

                    </div>

                </ContentTemplate>

            </asp:UpdatePanel>

我正在尝试查看网格的selectindexchanged事件的模式。我使用的代码如下：

protected void gridStores_SelectedIndexChanged(object sender,EventArgs e)
        {
            tblStores.Visible = true;
            BtnView.Visible = true;
            GridViewRow row = gridStores.SelectedRow;

            conn = new SqlConnection();
            conn.ConnectionString = connString;
            sqlcmd = conn.CreateCommand();

            string query = "select * from [stores] where cat = @cat";

            sqlcmd = new SqlCommand(query,conn);
            sqlcmd.Parameters.AddWithValue("@cat",row.Cells[1].Text);

                conn.Open();

                da = new SqlDataAdapter(sqlcmd);
                ds = new DataSet();
                da.Fill(ds,"StoresProject");
                dt = ds.Tables[0];

                foreach (DataRow dr in dt.Rows)
                {
                    lblName.Text = dr["store name"].ToString();
                    lblFloow.Text = dr["floor"].ToString();
                    lblNumber.Text = dr["store number"].ToString();

                }
        }

有人可以告诉我为什么不显示模式弹出窗口吗？我究竟做错了什么？任何帮助将不胜感激。谢谢！

更新：我尝试通过使用W3Schools中的简单模板来显示不带任何网格和后端C＃代码的模式。模态仍然根本不会弹出。

解决方法

所以我解决了我的问题。我突然想到，如果我在chrome的控制台窗口中输入$(#DetailsModal).modal()，则会出现模式。因此，我应该尝试在网站中以相同的方式调用它。
因此，我在页面末尾写了一个javascript函数：

<script>

        function openModal(){
        $('#DetailsModal').modal();
        }

    </script>

在后面的代码中，我使用了：

ScriptManager.RegisterStartupScript(this.Page,this.GetType(),"script","openModal();",true);

然后，当我尝试打开模式时，它使用正确的数据正确显示。
感谢所有抽出时间提出建议的人。