2014-05-18 4 views
0

jQuery multiselect (jquery.multiselect.js)를 사용하고 있습니다.다중 선택의 모든 옵션에 이벤트 처리기를 추가하는 방법은 무엇입니까?

<select id ="dtDomain" title="Basic example" multiple="multiple" name="example-basic" size="3" style="width:160px"> 
     <option value="option1">Option 1</option> 
     <option value="option2">Option 2</option> 
     <option value="option3">Option 3</option> 
    </select> 

그리고 어떻게 다중 선택 초기화하기 위해서 다음과 같은 코드를 사용 : HTML 태그는 다음과 같이이다

$(function(){ 
    $("#dtDomain").multiselect({ 
     noneSelectedText: "select Ranges", 
     checkAllText: "select all", 
     uncheckAllText: 'select none', 
     selectedList:4, 
     minWidth:100 
    }); 
}); 

가 지금은 모든 <option>에 대한 이벤트 처리기를 추가 할을 이벤트 핸들러가 트리거됩니다 <option>이 선택되거나 선택 취소 된 경우 이를 위해, 나는 다음과 같은 코드를 시도 :

//get the checked option and print them 
$('#dtDomain').on('change', function() { 
    var array_of_checked_values = this.multiselect("getChecked").map(function(){ 
     return this.value; 
    }).get(); 
    alert(array_of_checked_values) 

}) 

을하지만 위의 코드는 잘 작동하지 않은 것 같습니다 그 event.Who이 몇 가지 조언을 줄 수 잡을 수있는이 방법은? 고맙습니다 !

+0

다중 선택 –

+0

@EhsanSajjad에서 사용할 수있는 이벤트가있을 것입니다 이벤트를 사용할 수 있습니까? 나는 적절한 사건을 찾지 못했습니다. 어떠한 제안? – ysfseu

+0

플러그인의 API 내에서 ''의 변경 핸들러를 사용하지 않고 작업해야합니다. 플러그인이 이벤트 액세스를 제공하지 않으면 다른 플러그인을 사용하십시오 – charlietfl

답변

0

이 시도 : 아래

var $callback = $("#dtDomain"); 

$("#dtDomain").multiselect({ 
    click: function(event, ui){ 
     $callback.text(ui.value + ' ' + (ui.checked ? 'checked' : 'unchecked')); 
    }, 
    beforeopen: function(){ 
     $callback.text("Select about to be opened..."); 
    }, 
    open: function(){ 
     $callback.text("Select opened!"); 
    }, 
    beforeclose: function(){ 
     $callback.text("Select about to be closed..."); 
    }, 
    close: function(){ 
     $callback.text("Select closed!"); 
    }, 
    checkAll: function(){ 
     $callback.text("Check all clicked!"); 
    }, 
    uncheckAll: function(){ 
     $callback.text("Uncheck all clicked!"); 
    }, 
    optgrouptoggle: function(event, ui){ 
     var values = $.map(ui.inputs, function(checkbox){ 
     return checkbox.value; 
     }).join(", "); 

     $callback.html("Checkboxes " + (ui.checked ? "checked" : "unchecked") + ": " + values); 
    } 
}); 

확인 :

http://www.erichynds.com/examples/jquery-ui-multiselect-widget/demos/#callbacks