동적으로 채워진 선택 옵션에서 '선택됨'트리거

Question

javascript + jQuery를 사용하는 다른 select 요소의 값에 따라 동적으로 채울 요소가 있습니다. 선택한 '옵션'옵션을 감지하는 '용지'선택 문제가 있습니다. 동적으로 추가되기 때문에 변경 사항을 감지하고 'selected'속성을 수동으로 강제 설정해야합니까?

<select name="pricing" id="pricing"> 
    <option value="Standard White">Standard White</option> 
    <option value="Classic Paper">Classic Paper</option> 
    <option value="Designer Paper">Designer Paper</option> 
    <option value="Premium Paper">Premium Paper</option> 
</select> 
<select name="paper" id="paper"></select> 

그리고 '#pricing'변경 때 실행되는 자바 스크립트 함수 : 여기

마크 업의

function paperPopulate() { 
    var type = $('#pricing').val(); 
    var standardPaper = ['Standard White', 'Smelly White']; 
    var classicPaper = ['Ivory Gloss', 'Silly Gloss']; 
    var designerPaper = ['White Smooth', 'White Garbage']; 
    var premiumPaper = ['Glacier Faucet', 'Desert Stink']; 
    var data = ''; 
    var papers = {Standard:standardPaper, Classic:classicPaper, Designer:designerPaper, Premium:premiumPaper}; 
    $.each(papers, function(term, papers) { 
     if (type.indexOf(term) !== -1) { 
      for (var i in papers) data += '<option value="'+ papers[i] +'">'+ papers[i] +'</option>'; 
     } 
    }); 

    $('#paper').html(data); 
} 

속성이 결코 추가하지 않기 때문에이 서버 측 코드 나는 가게에 실행 양식 데이터는 '용지 선택'이 선택한 것을 결코 감지하지 못합니다.

편집 : 자바 스크립트를 두 번 확인한 후, 페이지 자체에서 옵션이 선택되었음을 알지만 속성은 표시되지 않습니다. 여기서 중요한 문제는 서버 측 코드 (VB.NET)가 선택된 값을 볼 수 없다는 것입니다.

Answer 1

select 요소에서 옵션을 선택하지 않으면 기본적으로 첫 번째 옵션이 선택되고 양식을 제출할 때 양식 데이터와 함께 게시됩니다.

선택한대로 옵션을 설정하려면 val() jQuery 메서드를 사용하여 선택 옵션의 값을 전달하여 선택합니다.

$('#paper').val('valueToSelect'); 

Answer 2

jQuery에서이를 수행하는 훨씬 좋은 방법이 있습니다. #paper이 선택 목록이라고 가정하면 다음과 같이 작동해야합니다.

$("#paper").empty(); 

$.each(papers, function(term, papers) { 
    if (type.indexOf(term) !== -1) { 
     for (var i in papers) { 
      //you can select the option here if needed 
      $("#paper").append(
       $("<option>", { value : papers[i], text : papers[i] }) 
      ); 
     }    
    } 
}); 

//you can also set the selected value here 
$("#paper").val("...");