2017-01-01 8 views
0

マルチアイテムドロップダウンリストを使用しており、以下のようなデータベースのアイテムを埋め込んでいます。これは最初にうまく動作しますが、他のドロップダウンからの選択に基づいて、他の値を追加してください。jqueryでドロップダウンマルチアイテムリストアイテムを追加/削除する方法

$('#PID').multiselect({ 
    columns: 1, 
    placeholder: 'Select project' 
}); 

私はドロップダウンの値を変更できません。だれでも助けてくれますか?

私は以下のリンクを参照しました。

http://www.codexworld.com/multi-select-dropdown-list-with-checkbox-jquery/

私は、次のような何か試してみました:あなたは、コードの下に使用して複数選択ドロップダウンをアンロードし、それを再初期化することができます

$("#PID").append('<option value="option5">Option ' + ++count + '</option>'); 
$("#PID").multiselect('refresh'); 
+0

あなたがしようと、あなたがすることができないことにより、あなたは何を意味するかについて、より詳しく説明することができ、「ドロップダウンの値を変更?」あなたが実行しようとしているアクションは何ですか?それはどういう仕組みですか? – Tinfoilboy

答えて

0

を:

$('#PID').multiselect('unload'); 

ます。また、コードの下に使用してリロードすることができます。

$('#PID').multiselect('reload'); 

他のオプションについてはhereをご確認ください。

1

デモリンクhttp://www.designchemical.com/blog/index.php/jquery/create-add-remove-select-lists-using-jquery/

<form> 
    <fieldset> 

    <select name="selectfrom" id="select-from" multiple size="5"> 
     <option value="1">Item 1</option> 
     <option value="2">Item 2</option> 
     <option value="3">Item 3</option> 
     <option value="4">Item 4</option> 
    </select> 

    <a href="JavaScript:void(0);" id="btn-add">Add &raquo;</a> 
    <a href="JavaScript:void(0);" id="btn-remove">&laquo; Remove</a> 

    <select name="selectto" id="select-to" multiple size="5"> 
     <option value="5">Item 5</option> 
     <option value="6">Item 6</option> 
     <option value="7">Item 7</option> 
    </select> 

    </fieldset> 
</form> 

jQueryのコード

$(document).ready(function() { 

    $('#btn-add').click(function(){ 
     $('#select-from option:selected').each(function() { 
       $('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>"); 
      $(this).remove(); 
     }); 
    }); 
    $('#btn-remove').click(function(){ 
     $('#select-to option:selected').each(function() { 
      $('#select-from').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>"); 
      $(this).remove(); 
     }); 
    }); 

}); 
関連する問題