如何在 DropDownList1_SelectedIndexChanged 上淡入引导模式？答案

【问题标题】：How to fadein bootstrap modal on DropDownList1_SelectedIndexChanged?如何在 DropDownList1_SelectedIndexChanged 上淡入引导模式？
【发布时间】：2015-04-12 11:04:53
【问题描述】：

When selected DropDownList1, the bootstrap modal gets fade out on DropDownList1_SelectedIndexChanged.

<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
    aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header" style="border: none">
                <div class="three-login">
                    <div class="three-login-head">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                            ×</button>
                        <h4>
                            The Fastest Car Insurance Premium Calculator</h4>
                        <span></span>
                    </div>
                </div>
            </div>
            <!-- /.modal-header -->
            <div class="modal-body">

<div class="row">
        <div class="col-md-4" style="margin-top: 10px; text-align: right">
            Car Brand
        </div>
        <div class="col-md-7 outer-addon1 left-addon">
            <div class="form-group">
                <div class="input-group">
                    <span class="input-group-addon" style="background-color: #00aeff; border-color: #00aeff;">
                        <i class="fa fa-bitcoin" style="color: #fff"></i></span>
                    <asp:DropDownList ID="ddlbrand" runat="server" class="showbtn" CssClass="form-control" 
                        AutoPostBack="True" onselectedindexchanged="ddlbrand_SelectedIndexChanged">
                    </asp:DropDownList>

                </div>
            </div>
        </div>
        <div class="col-md-1">
        </div>
    </div>
    <div class="row">
        <div class="col-md-4" style="margin-top: 10px; text-align: right">
            Car Model
        </div>
        <div class="col-md-7 outer-addon1 left-addon">
            <div class="form-group">
                <div class="input-group">
                    <span class="input-group-addon" style="background-color: #00aeff; border-color: #00aeff;">
                        <i class="fa fa-car" style="color: #fff"></i></span>
                    <asp:DropDownList ID="ddlmodels" runat="server" CssClass="form-control" 
                        AutoPostBack="True" onselectedindexchanged="ddlmodels_SelectedIndexChanged">
                    </asp:DropDownList>
                </div>
            </div>
        </div>
        <div class="col-md-1">
        </div>
    </div>
</div>
        </div>
    </div>
    <!-- /.modal-body -->
</div>

当我选择汽车品牌的第一个下拉列表时，模态会淡出，在这种情况下，模态不应淡出

JavaScript 代码

<script type="text/javascript">
    $(document).ready(function () {
        $('#<%=ddlbrand.ClientID%>').select(function () {
            $('#myModal').addClass('in').removeClass('hide');

        });
    });
</script>

【问题讨论】：

在 SO 中写问题时，关闭 capslock 并关闭 autopostback 以使 JS 执行工作。
我希望自动回发是真的，如果 js 不工作，那么他们是另一种方式吗？ @ArindamNayak

标签： javascript asp.net twitter-bootstrap

【解决方案1】：

我得到了我的答案，我认为这对其他人会有所帮助

此代码是在 ddlbrand_SelectedIndexChanged 上用 c# 编写的代码如下

protected void ddlbrand_SelectedIndexChanged(object sender, EventArgs e)
{
    if (ddlbrand.SelectedIndex != 0)
    {
        Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowModal",  "$('#myModal').modal('show');", true);
    }
}

【讨论】：