2012-09-18 2 views
2

내 페이지에 jQuery Chosen을 사용하고 있으며 새 옵션을 선택할 때마다 기능을 실행하고 싶습니다. 이 함수는 부모 div에있는 자식 div을 모두 숨긴 다음 선택한 옵션에 해당하는 것을 표시합니다.jQuery Chosen : AJAX 호출에서 변경 이벤트가 발생하지 않습니다.

HTML :

<select id="settings-select" data-placeholder="Choose&hellip;" class="chzn-select"> 
    <option value="setting1">Option 1</option> 
    <option value="setting2">Option 2</option> 
    <option value="setting3">Option 3</option> 
    <option value="setting4">Option 4</option> 
    <option value="setting5">Option 5</option> 
    <option value="setting6">Option 6</option> 
</select> 

<div id="settings-tabs"> 
    <div id="setting1" class="tab">...</div> 
    <div id="setting2" class="tab">...</div> 
    <div id="setting3" class="tab">...</div> 
    <div id="setting4" class="tab">...</div> 
    <div id="setting5" class="tab">...</div> 
    <div id="setting6" class="tab">...</div> 
</div> 

JS :

var settingsShow = function(){ 
    var showPanel = $("#settings-select").find('option:selected').val(); 
    $("#settings-tabs .tab").hide(); 
    $("#" + showPanel).fadeIn("fast"); 
    alert(showPanel); 
} 

$(document).ready(function(){ 
    $("#settings-tabs .tab").hide(); 
    $("#settings-select").chosen().change(settingsShow); 
}); 

이 모든 좋은 지금까지 작동합니다 - 선택한 항목, settingsShow가 호출 변경 될 때 (및 경고 표시가 그냥이 확인) . 여기

$("#settings-select").val("setting1").trigger("liszt:updated"); 
settingsShow(); 

문제입니다 : : 선택한 옵션은 이전에 선택한 옵션을 선택하면, 완성 된 AJAX 호출에 의해 변경되면

지금, 나는 또한이 완료되면 선택한 옵션을 변경하는 AJAX 호출이 더 이상 변경 이벤트를 발생시키지 않습니다.

  1. 선택 "옵션 2": 예를 들어 표시 경고 "옵션 2"
  2. AJAX 호출을 수행 완료시 "옵션 1"및 표시 경고 "옵션 1"
  3. 선택 "옵션 2"를 선택합니다 : 아무것도

나는 그것이 내가 대신 정상 select를 사용하는 경우 잘 작동 특히 때문에 선택된에 문제가 알고있다 (위의 3 단계에서, 나는 내가해야처럼, "옵션 2"라는 경고를 얻을 것이다) 발생하지 않습니다. 그러나 볼 수 있듯이 .trigger("liszt:updated")을 사용하여 AJAX 호출이 선택한 옵션을 변경하면 select을 업데이트하므로이 옵션이 작동하지 않는 이유는 알 수 없습니다.

답변

1

이것은 Chosen 0.9.8 (현재 릴리스 버전)의 적법한 버그입니다. cutting-edge version (공식 출시되지 않음)으로 업데이트되었으며 다른 변경 사항없이 문제가 바로 잡혔습니다.

관련 문제