2014-11-07 6 views
2

jQuery selectize 플러그인을 사용하여 양식을 작성 중입니다. 이제 선택 상자에서 모든 옵션을 선택하고 을 선택하는 방법을 빌드하려고합니다.선택을 사용하여 모든 옵션을 선택하는 방법?

$('#select_all').click(function() { 

      $('#project_user_ids option').prop('selected', true); 

      $('#project_user_ids').selectize(); 

     }); 

그것은 모든 옵션을 선택하기 위해 노력하고 있지만,이 선택 박스에 표시되지 않습니다 :

은 내가 사용하는 코드입니다. 옵션을 "새로 고침"하고 선택한 옵션을 상자에 표시하는 방법이 필요합니다.

어떻게하면됩니까?

답변

0

selectize plugin을 사용하여 모든 옵션을 동적으로 선택하려면 먼저 플러그인을 초기화하고 해당 인스턴스를 가져와야합니다.

setValue() 메서드를 사용하여 컨트롤 값을 변경할 수 있습니다. 예 : selectize.setValue(['value1', 'value2']);

setValue()를 사용하면 간단한 방법을 사용하여 모든 값을 밑줄 또는 로다 시로 설정할 수 있습니다. , "모든 선택"기능에 대한 해결 방법으로

var $projectUserIds = $('#project_user_ids').selectize(); // Selectize plugin initialization 
var selectize = $projectUserIds[0].selectize; // Get selectize instance 

$('#select_all').click(function() { 
    selectize.setValue(_.keys(selectize.options)); // Set all selectize options using setValue() method 
}); 
0

을 당신은 ctrl+a에 대한 JS 기능을 사용할 수 selectize.setValue(_.keys(selectize.options));

전체 코드는이과 같아야합니다.

$('#my-select').keyup(function(e) { 
    if (e.ctrlKey == true) { 
     if (e.keyCode == 65 || e.keyCode == 97){ 
     var el = el=$('#my-select')[0].selectize; 
     var optKeys = Object.keys(el.options); 
     optKeys.forEach(function (key, index) { 
      el.addItem(key); 
     }); 
     } 
    } 
    }); 
:

는 I 활성 항목 어레이에 대한 모든 가능한 옵션을 추가 기능이 만들어