如何從列表中移動內容

如果您已經在此工作了一段時間並且需要幫助，目前，我有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])' 
});

來源

2014-12-05 TheGarrett

@TheGarrett你好，請[github上（https://github.com/istvan-ujjmeszaros/bootstrap-duallistbox/blob/master/demo/index.html） – kuldipem 2014-12-05 09:12:56

從strart經過吧.. 。你的eI得到了來自 – TheGarrett 2014-12-05 09:14:48

的JS問題，你的代碼是你使用了錯誤的類語法'''class =「btn move btn-default」「demo2」'''，它應該是'''class =「btn移動btn-default demo2「'''。 – kuldipem 2014-12-05 09:16:50

以下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])' 
});

來源

2014-12-05 09:14:43 kuldipem

仍然無法正常工作。我只能從列表中選擇1個項目，但選擇多個內容並且移動功能仍然不起作用 – TheGarrett 2014-12-05 09:19:48

如何從列表中移動內容

回答

相關問題