更新列表<select>从另一个<select multiple>使用jquery

-1

我试图更新<select>元素，当我从另一<select multiple>使用jQuery选择一个或多个值。这里是我多select：更新列表<select>从另一个<select multiple>使用jquery

<select class="form-control" multiple> 
    <option value="1">company 1</option> 
    <option value="2">company 2</option> 
    <option value="3">company 3</option> 
    <option value="4">company 4</option> 
</select>

来源

2017-04-19 Tevfik Xung

请提高您的问题。添加你试图完成这个的代码 –

我希望这是你在找什么，

$('select#first').change(function() { 
 
    $("select#second option:not(:first-child)").remove(); 
 
    $(this).find("option:selected").each(function() { 
 
    $("select#second").append($(this).clone()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<select id="first" class="form-control" multiple> 
 
    <option value="1">company 1</option> 
 
    <option value="2">company 2</option> 
 
    <option value="3">company 3</option> 
 
    <option value="4">company 4</option> 
 
</select> 
 
<select name="second" id="second"> 
 
    <option value=''>Select 2</select> 
 
</select>

来源

2017-04-19 11:41:10

谢谢你，那种我一直在寻找的东西 –

-2

如果你想通过从服务器端有关的多个选择框中选择的值，那么你可以进行AJAX操作和结果插入到另一个选择框获取数据更新选择选项，这些选项将被更新。

来源

2017-04-19 11:27:24

也许你可以发布一些代码来显示OP如何做到这一点？ “你可以通过解决这个问题来解决这个问题”不是很有帮助 – Artless

检查这个脚本https://jsfiddle.net/gpb5wx8h/5/

的Jquery：

function chooseItems(item, placeholder){ 
     $(item).change(function() { 
      var item = $(this); 

      console.log(typeof(item.val())); 
      if(typeof item.val() == 'object'){ 
      $.each(item.val(), function(i,v){ 
       var selectedItem = item.find('option[value="'+ v +'"]'), 
        selectedText = selectedItem.text(); 

       selectedItem.detach(); 
       $(placeholder).append('<option value="' + v +'">' + selectedText + '</option>') 

      }) 
      } 
     }) 
} 
$(document).ready(function() { 
    chooseItems('.choose-role','.placeholder-role'); 
    chooseItems('.placeholder-role','.choose-role'); 
})

HTML：

<select class="form-control choose-role" multiple> 
    <option value="1">company 1</option> 
    <option value="2">company 2</option> 
    <option value="3">company 3</option> 
    <option value="4">company 4</option> 
</select> 
<select class="form-control placeholder-role" multiple> 
</select>

来源

2017-04-19 11:43:52

更新列表<select>从另一个<select multiple>使用jquery

回答

相关问题