선택한 플러그인을 사용하는 HTML에서 드롭 다운 선택을 변경할 수 없습니다.

다음은 내 webapp의 html 스 니펫입니다. .commtype의 선택에 따라 .commmethod의 선택된 값을 변경하려고하는데 일반적인 기술이 모두 작동하지 않습니다.

html 스 니펫 아래에는 내 jquery가 있습니다.

<div class="form-group">
    <div class="col-sm-4">
    <select style="display: none;" class="combobox form-control chzn-done" id="commtype" name="CommunicationTypeId">
         <option value="-1">Select one...</option>
         <option value="401">Phone</option>
         <option value="403">Fax</option>
         <option value="404">Email</option>
         <option value="402">Postal</option>
    </select>
    <div style="width: 513px;" class="chzn-container chzn-container-single" id="commtype_chzn">
        <a href="javascript:void(0)" class="chzn-single" tabindex="-1">
          <span>Select one...</span>
        </a>
        <div class="chzn-drop" style="left: -9000px; width: 511px; top: 43px;">
         <ul class="chzn-results">
              <li id="commtype_chzn_o_0" class="active-result result-selected" style="">Select one...</li>
              <li id="commtype_chzn_o_1" class="active-result" style="">Phone</li>
              <li id="commtype_chzn_o_2" class="active-result" style="">Fax</li>
              <li id="commtype_chzn_o_3" class="active-result" style="">Email</li>
              <li id="commtype_chzn_o_4" class="active-result" style="">Postal</li>
         </ul>
        </div>
     </div>
</div>
<div class="form-group">
    <div class="col-sm-4">
    <select style="display: none;" class="combobox form-control chzn-done" id="commmethod" name="CommunicationMethodId">
        <option value="-1">Select one...</option>
        <option value="2">Slow</option>
        <option value="5">Fast</option>
        <option value="4">Fasted</option>
        <option value="1">Slowest</option>
        <option value="3">Slower</option>
    </select>
    <div style="width: 513px;" class="chzn-container chzn-container-single" id="commmethod_chzn">
      <a href="javascript:void(0)" class="chzn-single" tabindex="-1">
        <span>Select one...</span>
      </a>
      <div class="chzn-drop" style="left: -9000px; width: 511px; top: 43px;">
       <ul class="chzn-results">
           <li id="commmethod_chzn_o_0" class="active-result result-selected" style="">Select one...</li>
           <li id="commmethod_chzn_o_1" class="active-result" style="">Slow</li>
           <li id="commmethod_chzn_o_2" class="active-result" style="">Fast</li>
           <li id="commmethod_chzn_o_3" class="active-result" style="">Fasted</li>
           <li id="commmethod_chzn_o_4" class="active-result" style="">Slowest</li>
           <li id="commmethod_chzn_o_5" class="active-result" style="">Slower</li>
        </ul>
     </div>
 </div>

commmethod의 선택된 값을 설정하는 Jquery 코드는 양식 제출시 유효성 검증 중에 항목이 처리되는 데 필요한 다른 값을 변경하지 않습니다. (jquery 이후의 스 니펫 참조)

<script type="text/javascript">
    $("#commtype").change(function () {
        //I do get the correct selected value here
        var theselected = $('#commtype >option:selected').text();

        switch (theselected) {
            case "Phone":
                $("#commmethod").val(2);
                break; 
            case "Fax":
                $("#commmethod").val(5);
                break;
            case "Email":
                $('#commmethod').val(4);
                break;
            case "Postal":
                $('#commmethod').val(1);
                break;
            default:
                $('#commmethod').val(1);
                break;
        }

        $("#commmethod").trigger("liszt:updated");
    });
</script>

따라서 전환 후 # commmethod.val을 출력하면 원하는 값을 얻지 만 위의 html에서 다음 요소 (--->로 표시)는 필요에 따라 업데이트되지 않습니다.

<div style="width: 513px;" class="chzn-container chzn-container-single" id="commmethod_chzn">
    <a href="javascript:void(0)" class="chzn-single" tabindex="-1">
--->    <span>Select one...</span>
    </a>
    <div class="chzn-drop" style="left: -9000px; width: 511px; top: 43px;">
       <ul class="chzn-results">
           <li id="commmethod_chzn_o_0" class="active-result result-selected" style="">Select one...</li>
--->       <li id="commmethod_chzn_o_1" class="active-result" style="">Slow</li>
           <li id="commmethod_chzn_o_2" class="active-result" style="">Fast</li>
           <li id="commmethod_chzn_o_3" class="active-result" style="">Fasted</li>
           <li id="commmethod_chzn_o_4" class="active-result" style="">Slowest</li>
           <li id="commmethod_chzn_o_5" class="active-result" style="">Slower</li>
        </ul>
     </div>
 </div>

드롭 다운을 사용하여 commmethod를 선택하면 위의 값이 해당 값으로 업데이트되고 선택된 commmethod 목록 항목의 클래스가 결과 선택으로 추가됩니다.

***** Update ***** jquery 선택한 플러그인이 이벤트에 대한 업데이트를 수행하고 있음을 나타냅니다. 드롭 다운을 올바르게 업데이트하기 위해 stackoverflow를 조사하고 있지만 아직 솔루션을 찾지 못했습니다.

모든 도움에 감사드립니다. 감사합니다.