Question

我有一个Bootstrap下拉列表，该列表与Knockout绑定到一些数据并且按预期工作。但是，当我在下拉列表中选择一个项目时，我希望能够将其显示为下拉文本。

的javascript：

getchar()

HTML：

<script type="text/javascript">
    $(".dropdown-menu li a").click(function () {

        $(this).parents(".btn-group").find('.selection').text($(this).text());
        $(this).parents(".btn-group").find('.selection').val($(this).text());

    });
</script>

P.S。我在这里搜索类似的问题，如下所示，但那里发布的答案似乎不起作用：

How to Display Selected Item in Bootstrap Button Dropdown Title

How to display selected item in the title of the bootstrap dropdown list ? and how to display selected item on a javascript alert box?

Answer 1

你可以做这样的事情

<script id="TillGroups" type="text/html">
    <label for="ddm">Till group:</label>
    <div id="ddm" class="btn-group">
        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                <span data-bind="text: selectedValue"></span>
                <span class="caret"></span>
        </button>
        <ul class="dropdown-menu" role="menu" data-bind="foreach: StockCount.ReadTillGroupsValue">
        <li><a role="menuitem" tabindex="-1" href="#" data-bind="text: Name, click: $root.selectGroupValue"></a></li>
    </ul>
    </div>
</script>

将数据绑定点击处理程序添加到li项

<li><a role="menuitem" tabindex="-1" href="#" data-bind="text: Name, click: $root.selectGroupValue"></a></li>

并在视图模型中，将observable定义为

self.selectedValue = ko.observable("")

和点击处理程序

self.selectGroupValue = function(group){
    self.selectedValue(group.Name)
};

在Bootstrap下拉按钮中显示所选项目

1 个答案: