Question

我已经在这方面工作了一段时间，需要帮助。目前我有2个内容列表。我希望能够从一个列表中选择内容并将其移动到第二个列表中。为此，我希望能够选择一个或多个内容，然后单击移动内容的按钮。我无法让实际的移动功能正常工作。我的代码来自我在互联网上找到的一个例子“http://www.virtuosoft.eu/code/bootstrap-duallistbox/”，是第二个例子。

这是我的2个列表和按钮代码：

  <div class="btn-group buttons">
    <button title="Move selected" type="button" class="btn move btn-default" "demo2"></button>
  </div>
  <select style="height: 197px;" name="duallistbox_demo2_helper1" class="form-control" id="bootstrap-duallistbox-nonselected-list_duallistbox_demo2" multiple="multiple">
    <option value="option7">Option 7</option>
    <option value="option8">Option 8</option>
    <option value="option9">Option 9</option>
    <option value="option0">Option 10</option>
    <option value="option0">Option 11</option>
    <option value="option0">Option 12</option>
  </select>


  <div class="btn-group buttons">     
  <button title="Remove selected" type="button" class="btn remove btn-default"></button>     
  </div>
  <select style="height: 197px;" name="duallistbox_demo2_helper2" class="form-control" id="bootstrap-duallistbox-selected-list_duallistbox_demo2" multiple="multiple">
  <option value="option2">Option 2</option>
  <option value="option3" selected="selected">Option 3</option>
  <option value="option4">Option 4</option></select>

这是我的JS ：

// move list content
var demo2 = $('.demo2').bootstrapDualListbox({
  nonSelectedListLabel: 'Non-selected',
  selectedListLabel: 'Selected',
  preserveSelectionOnMove: 'moved',
  moveOnSelect: false,
  nonSelectedFilter: 'ion ([7-9]|[1][0-2])'
});

Answer 1

以下js应该适用于您的第一个选择框。请确保选择合适的元素。

var demo2 = $('#bootstrap-duallistbox-nonselected-list_duallistbox_demo2').bootstrapDualListbox({
  nonSelectedListLabel: 'Non-selected',
  selectedListLabel: 'Selected',
  preserveSelectionOnMove: 'moved',
  moveOnSelect: false,
  nonSelectedFilter: 'ion ([7-9]|[1][0-2])'
});

如何从列表中移动内容

1 个答案: