使用c#获取asp.net中的Bootstrap下拉复选框列表选中值的选项

时间:2013-10-20 09:23:50

标签: c# jquery twitter-bootstrap

我正在一个网站上工作,我需要在下拉列表中使用复选框表示许多项目。 因为我使用bootstrap下拉复选框列表:

    <head id="Head1" runat="server">
    <title></title>
    <!-- Include Twitter Bootstrap and jQuery: -->
    <link rel="stylesheet" href="css/bootstrap-3.0.0.min.css" type="text/css" />
    <link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css" />
    <link rel="stylesheet" href="css/prettify.css" type="text/css" />

    <script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>
    <script type="text/javascript" src="js/bootstrap-3.0.0.min.js"></script>
    <script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
    <script type="text/javascript" src="js/prettify.js"></script>

</head>
<body>
    <form id="form1" runat="server">
        <div>

            <asp:DropDownList ID="ddlItems" multiple="multiple" runat="server">
                <asp:ListItem value="cheese">Cheese</asp:ListItem>
                <asp:ListItem value="tomatoes">Tomatoes</asp:ListItem>
                <asp:ListItem value="mozarella">Mozzarella</asp:ListItem>
                <asp:ListItem value="mushrooms">Mushrooms</asp:ListItem>
                <asp:ListItem value="pepperoni">Pepperoni</asp:ListItem>
                <asp:ListItem value="onions">Onions</asp:ListItem>

            </asp:DropDownList>

            <asp:Button ID="sub" runat="server" OnClick="sub_Click" Text="submit" />
        </div>
    </form>
    <script type="text/javascript">
        $('#ddlItems').multiselect({
            buttonClass: 'btn btn-default btn-sm'
        });
    </script>
</body>
</html>

现在我必须点击按钮才能获得所有选中的项目。 因为我尝试但我没有得到物品..

2 个答案:

答案 0 :(得分:2)

您可以使用此方法......

<script type="text/javascript">
$(function() {
$('#chkveg').multiselect({
includeSelectAllOption: true
});
$('#btnget').click(function() {
 alert($('#chkveg').val());})
});
</script>

答案 1 :(得分:1)

我希望这对你有所帮助。使用下拉列表中的复选框选择多个选项。             jQuery在下拉列表中选中Checkbox的多个选项                                                                               起司       番茄       奶酪       蘑菇       意大利辣味香肠       洋葱     

    

<script type="text/javascript">
$(function() {
$('#chkveg').multiselect({
includeSelectAllOption: true
});
$('#btnget').click(function() {
 alert($('#chkveg').val());})
});
</script>
</div>
</form>
</body>

你会得到这样的输出:

jQuery multi select dropdown with0 checkboxes