Question

我使用了切换技术，但我不喜欢它。

<div class="btn-group col-sm-2 col-md-2 col-lg-2">
    <label>Patient Type</label>
    <button class="form-control btn btn-primary dropdown-toggle"  data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" name="Transaction">
        Choose Type
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li href="#corp-toggle" value="Walk-In" data-toggle="collapse">
            Walk-In
        </li>
        <li href="#corp-toggle" value="Corporate" data-toggle="collapse">
            Corporate
        </li>
    </ul>
</div>
<div id="corp-toggle" class="collapse col-sm-5 col-md-5 col-lg-5">
    <label>Please Specify your Company:</label>
    <button class="form-control btn btn-primary dropdown-toggle"  data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" name="Transaction">
        Choose Company
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li href="#corp-toggle" value="Walk-In" data-toggle="collapse">
            Walk-In
        </li>
        <li href="#corp-toggle" value="Corporate" data-toggle="collapse">
            Corporate
        </li>
    </ul>
</div>

Answer 1

谢谢你们！我已经用JS解决了这个问题。之前的初始问题是如果从下拉列表中选择是Walk-In，那么另一个drop将被隐藏。如果选择是“公司”，则可以看到另一个下拉列表。

JS代码是

function show(frm) {
        if (frm.Transaction.value == "Corporate") {
            document.getElementById("hide").style.visibility = "visible";
            document.getElementById("show").style.visibility = "visible";
        }else{
        document.getElementById("show").style.visibility = "hidden";
        document.getElementById("hide").style.visibility = "hidden";
        }
    }

我从第一个下拉表单中调用了该函数：

select class="form-control"  Name="Transaction" onClick="show(this.form)

然后叫：

id="show" style="visibility:hidden"

从第二个下拉表单

有没有办法使用Bootstrap显示/隐藏来自不同下拉列表的另一个下拉列表？

1 个答案: