bootstrap模式中的asp下拉列表不会改变值

时间:2014-06-18 16:04:59

标签: c# asp.net twitter-bootstrap

我正在使用asp.net和bootstrap v3开发一个Web应用程序。在我的页面上,有一个模式,其中包含两个twxt框和一个asp下拉列表。 我的问题是下拉列表SelectedIndexChanged没有触发。当我将一个下拉列表放在Modal之外时,其SelectedIndexChanged会毫无问题地触发。 我为Page和DDL设置了EnableViewState =“true”。我还设置了AutoPostBack =“True”。 注意: 页面回发当我更改模式中DDL中的选定项目但它没有转到SelectedIndexChanged事件,因为我已经设置了一个断点并且它不起作用。 我还注意到DDL的HTML(选项,选择)也是为第一个元素设置(Selected =“Selected”)属性。

这就是我加载DDL的方式

protected void Page_Load(object sender, EventArgs e)
{
    if(!isPostBack)
{
      DataSet ds2 = MainModule.GetTableSQLBySP(new Dictionary<string, string>(), "SP_Stand_GetSectorTypes");
    ddlMdlAreaInvitedSecType.DataSource = ds2.Tables[0];
    ddlMdlAreaInvitedSecType.DataValueField = "Set_ID";
    ddlMdlAreaInvitedSecType.DataTextField = "Set_LongName";
    ddlMdlAreaInvitedSecType.DataBind();    }

}

这是模态代码

 <div class="modal fade" id="modalAreaInvitedSearch" style="margin-top: 155px" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel2">Please enter product data  </h4>
            </div>
            <div class="modal-body" style="height:auto">

                <input type="text" class="form-control" placeholder="MM" style="display: none" runat="server" id="Text1" />
                <div class="form-group">
                    <label for="inputEmail1" class="col-lg-3 control-label">Short Name</label>
                    <div class="col-lg-8">
                        <asp:TextBox   enableviewstate="true" class="form-control " runat="server" id="txtMdlAreaInvitedShortName" />
                    </div>

                </div>

                <div class="form-group">
                    <label for="inputEmail1" class="col-lg-3 control-label">Long Name</label>
                    <div class="col-lg-8">
                        <asp:TextBox   enableviewstate="true" class="form-control " runat="server" id="txtMdlAreaInvitedLongName" />
                    </div>

                </div>
                <div class="form-group">
                    <label for="inputEmail1" class="col-lg-3 control-label">Sector Type</label>
                    <div class="col-lg-8">
                        <asp:DropDownList EnableViewState="true" class="form-control" OnSelectedIndexChanged="ddlMdlAreaInvitedSecType_SelectedIndexChanged"  AutoPostBack="true" runat="server" ID="ddlMdlAreaInvitedSecType" />
                    </div>

                </div>


                <asp:UpdatePanel runat="server" ID="updatePanel2" UpdateMode="Conditional">
                    <ContentTemplate>
                        <asp:GridView ID="grdMdlAreaInvitedResult" runat="server" HorizontalAlign="Center"
                            AutoGenerateColumns="false" AllowPaging="true"
                            DataKeyNames="Sec_Id" CssClass="table table-hover table-striped table-bordered centerGridHead">
                            <Columns>
                                <asp:TemplateField HeaderText="" ShowHeader="false" ItemStyle-Width="17%">
                                    <ItemTemplate>
                                        <%--<asp:LinkButton id="btnRemove" runat="server" CausesValidation="false" Text="<i aria-hidden='true' class='icon-plus'></i>" CssClass="btn btn-info btn-xs "/>--%>
                                        <asp:CheckBox ID="chkGrdMdlAreaInvitedResult" runat="server"   CssClass="btn btn-primary btn-xs  " />
                                    </ItemTemplate>
                                </asp:TemplateField>
                                <asp:BoundField DataField="Sec_Id" HeaderText="Sec_Id" Visible="false" />
                                <asp:BoundField DataField="Sec_ShortName" HeaderText="Sector" />
                                <asp:BoundField DataField="Sec_LongName" HeaderText="Sector Long Name" />
                                <asp:BoundField DataField="Sec_Id_Master" HeaderText="Sec_Id_Master" Visible ="false" />
                            </Columns>
                        </asp:GridView>
                    </ContentTemplate>
                    <Triggers>

                        <asp:AsyncPostBackTrigger ControlID="btnMdlAreaInvitedSearch" EventName="Click" />
                       <%--  <asp:AsyncPostBackTrigger ControlID="ddlMdlAreaInvitedSecType" EventName="SelectedIndexChanged" />--%>
                    </Triggers>

                </asp:UpdatePanel>





            </div>
             <div class="modal-footer">
                  <div class="form-group">

                    <div class="col-lg-12">

                        <asp:Button ID="btnMdlAreaInvitedClear" OnClientClick="clickCodeBtn()" runat="server"   class="btn btn-primary  col-lg-2" Text="Clear"></asp:Button>

                        <asp:Button ID="btnMdlAreaInvitedGet"  OnClientClick="clickCodeBtn()" runat="server" OnClick="btnMdlAreaInvitedGet_Click" class="btn btn-primary  col-lg-2" Text="Get"></asp:Button>
                        <asp:Button ID="btnMdlAreaInvitedSearch" UseSubmitBehavior="false"  runat="server" OnClick="btnMdlAreaInvitedSearch_Click" class="btn btn-primary  col-lg-2" Text="Search"></asp:Button>

                        <asp:Button ID="btnMdlAreaInvitedClose"  OnClientClick="clickCodeBtn()" runat="server" class="btn btn-primary  col-lg-2" Text="Close"></asp:Button>

                    </div>

                </div>
            </div>

这就是我打开模态的方式

 function popAreaInvitedSearch() {

        $('#modalAreaInvitedSearch').appendTo('body').modal({

            show: true,

            keyboard: false,

            backdrop: 'static'

        });

    }

任何帮助将不胜感激。

2 个答案:

答案 0 :(得分:1)

我和Fancybox有类似的问题,结果是当Modal加载时,它会提取HTML并将其注入主ASP.NET Form的DIV 外部。 / p>

要在Fancybox中更正此问题,我会覆盖Fancybox源代码以在表单中注入Modal。

我首先使用Firebug检查页面,并确定Bootrap模态实际所在的位置。如果它在表单之外,您将需要弄清楚如何在ASP.NET控件事件中呈现它以正确触发,您可以使用Modal javascript配置选项进行配置。

希望能让你走上正确的道路。

答案 1 :(得分:0)

您是否尝试过将DDL放入UpdatePanel? DDL很可能现在总是会导致回发。这可能是不可取的。