Twitter bootstrap 使用带敲除的引导按钮下拉列表

Twitter bootstrap 使用带敲除的引导按钮下拉列表,twitter-bootstrap,knockout.js,Twitter Bootstrap,Knockout.js,我正在尝试使用bootstrap与knockout的完美结合。不幸的是,下拉列表是使用链接而不是构建的,而knockout引导没有任何帮助的处理程序 我已经能够使所有样式正常工作(按钮类型、图标、选中/取消选中)。但是,我仍然无法使单击功能正常工作: <div class="btn-group"> <!-- Change button type based on status --> <button type="button" class="btn btn-sma

我正在尝试使用bootstrap与knockout的完美结合。不幸的是,下拉列表是使用链接而不是
构建的,而knockout引导没有任何帮助的处理程序

我已经能够使所有样式正常工作(按钮类型、图标、选中/取消选中)。但是,我仍然无法使单击功能正常工作:

<div class="btn-group">
<!-- Change button type based on status -->
<button type="button" class="btn btn-small dropdown-toggle" data-bind="css: {'btn-default' : status().statusName=='Matched', 'btn-danger' : status().statusName=='None', 'btn-info' : status().statusName=='Set'}" data-toggle="dropdown">

  <!-- Add Glyph based on status -->
  <span class="glyphicon" data-bind="css: {'glyphicon-ok' : status().statusName=='Matched', 'glyphicon-remove' : status().statusName=='None', 'glyphicon-list' : status().statusName=='Set'}"></span> <span data-bind="text: status().statusName"> </span> <span class="caret"></span>
</button>

<!-- Loop for status -->
<ul class="dropdown-menu" role="menu" data-bind="foreach: $root.availableStatus">
  <!-- Disable item if selected -->
  <li data-bind="css: {'disabled' : statusName==$parent.status().statusName}">
    <!-- Not working -->
    <a href="#" data-bind="click: $root.updateStatus"><span class="glyphicon" data-bind="css: {'glyphicon-ok' : statusName=='Matched', 'glyphicon-remove' : statusName=='None', 'glyphicon-list' : statusName=='Set'}"></span> <span data-bind="text: statusName"></span></a>]

  • ]
我不知道它是否能帮助你(我在你的小提琴上看不到参考文献):

按钮下拉列表要求功能正常

 <a href="#" data-bind="click: $parent.status">...</a>

复制步骤
  • 去掉
    $root
    上的
    updateStatus
    函数。你不需要它来完成这个简单的任务

  • 单击
    事件绑定到
    $parent.status

    我们希望调用当前
    文章
    上的
    状态
    函数(a
    ko.observable
    )。在定义锚定点时,上下文父对象是
    文章
    ,因此您希望使用
    $parent.status
    。当前上下文是被单击的
    $root.availableStatus
    的元素,它是将传递给
    status
    函数的参数

     <a href="#" data-bind="click: $parent.status">...</a>
    
    
    

  • 它是小型引导js的一部分。你可以在非最小值中看到它。