jquery를 사용하여 드롭 다운 목록에서 값을 추가/제거하는 방법

Question

같은 값을 가진 2 개의 드롭 다운 목록이 있으며 그 값은 데이터베이스 값으로 채워집니다. 내가 해결하려고하는 문제는 양식을 제출할 때 2 개의 드롭 다운 상자가 같은 값을 가질 수 없다는 것입니다. POST 값은 달라야합니다.

사용자가 드롭 다운 상자 A에서 옵션 A를 선택한 경우 드롭 다운 상자 B에서 옵션 A를 제거하고 싶습니다. 그런 다음 사용자가 드롭 다운 상자 A에서 옵션 B를 선택하면 옵션 A를 다시 넣을 수 있습니다. 드롭 다운 상자 B와 드롭 다운 상자 B에서 제거 할 새 값 옵션 B를 선택합니다.

나는이 작업을 수행하는 데 몇 가지 다른 방법을 시도했으며, 가장 가까운 코드는 다음과 같습니다. 이 비트는 내가 페이지가로드 .....

$(document).ready(function() { 
    $.dropdownAcache = { 
     val : "", 
     val1 : "", 
    }; 

    $('#id_A').ready(function() { 
     var optionval = $('#id_A').val(); 
     $.dropdownAcache.val = $('#id_A').val(); 
     $('#id_B > option[value=' + optionval + ']').remove(); 
    }); 

    $('#id_A').click(function() { 
     var optionval = $('#id_A').val(); 
     $.dropdownAcache.val1 = $('#id_A').val(); 
     $('#id_B > option[value=' + optionval + ']').remove(); 
     $('#id_B').append$(dropdownAcache.val); 
     $.dropdownAcache.val = $.dropdownAcache.val1; 
    }); 

....하지만이해야 할 것 같다 모두가 결코 드롭 다운 상자 B의 값을 제거 없지만이 다시 값을 추가 할 때 원하는 것을. 그것은이다 사실 아주 우스꽝 스럽지만 드롭 다운 상자 B에 아무런 가치도 없는데 모든 진지함에서 누군가가이 작업을하도록 도울 수 있습니까?

건배 - 올리

Answer 1

'변경'이벤트를 사용해야합니다. 또한, 당신이 어떤 용도로 사용하지, 두 번째 .ready() 콜백을 필요로하지 않는 목록은 값이 다시 추가됩니다 않을 이유에 관해서는 당신이 불행하게도 오타 .append$(dropdownAcache.val);에 놓여있다 (

$.dropdownAcache = {  
    val : "", 
    val1 : "" 
}; 

$(document).ready(function() { 

    var optionval = $('#id_A').val(); 
    $.dropdownAcache.val = $('#id_A').val(); 
    $('#id_B > option[value="' + optionval + '"]').remove(); 

    $('#id_A').change(function() { 
     optionval = $('#id_A').val(); 
     $.dropdownAcache.val1 = optionval; 
     $('#id_B > option[value="' + optionval + '"]').remove(); 
     $('#id_B').append($.dropdownAcache.val); 
     $.dropdownAcache.val = $.dropdownAcache.val1; 
    }); 
}); 

(첫 번째 .ready()는 것을 처리))