当dropdownlist内部触发选定的索引更改事件时,Bootstrap模式关闭

时间:2014-07-13 21:00:32

标签: asp.net twitter-bootstrap modal-dialog

我在Bootstrap模式中有一个ASP.NET图表。

一切正常,直到我在里面添加一个下拉列表,每次我在下拉列表中选择一个新项目时,所选项目更改事件触发,Boostrap模式关闭,事件如果事件中没有代码。

这是modal bootstrap html:

<div class="modal fade" id="modalCantidadReservasMensuales" tabindex="-1" role="dialog"
    aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">
                    Cantidad reservas mensuaCantidad reservas mensuales
                </h4>
            </div>
            <div class="modal-body">
                <asp:DropDownList ID="ddlAñoCantidadReservasMensuales" runat="server" OnSelectedIndexChanged="ddlAñoCantidadReservasMensuales_SelectedIndexChanged"
                    AutoPostBack="True">
                </asp:DropDownList>
                <asp:Chart ID="Chart2" runat="server" Width="441px">
                    <Series>
                        <asp:Series Name="test1">
                        </asp:Series>
                    </Series>
                    <ChartAreas>
                        <asp:ChartArea Name="ChartArea1">
                        </asp:ChartArea>
                    </ChartAreas>
                </asp:Chart>
            </div>
        </div>
    </div>
</div>

1 个答案:

答案 0 :(得分:0)

这主要是因为您在控件中将autopostback proprty设置为true,这将导致选定索引更改事件的整页回发。

解决问题,您可以将您的正文内容放入更新面板。

<div class="modal fade" id="modalCantidadReservasMensuales" tabindex="-1" role="dialog"
    aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">
                    Cantidad reservas mensuaCantidad reservas mensuales
                </h4>
            </div>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <div class="modal-body">
                            <asp:DropDownList ID="ddlAñoCantidadReservasMensuales" runat="server" OnSelectedIndexChanged="ddlAñoCantidadReservasMensuales_SelectedIndexChanged">
                            </asp:DropDownList>
                            <asp:Chart ID="Chart2" runat="server" Width="441px">
                                <Series>
                                    <asp:Series Name="test1">
                                    </asp:Series>
                                </Series>
                                <ChartAreas>
                                    <asp:ChartArea Name="ChartArea1">
                                    </asp:ChartArea>
                                </ChartAreas>
                            </asp:Chart>
                        </div>
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>
    </div>
</div>

代码背后:

    protected void ddlAñoCantidadReservasMensuales_SelectedIndexChanged(object sender, EventArgs e)
    {
        //youre code here ...

        UpdatePanel1.Update();
    }