jquery - 別の選択フィールドで値がすでに選択されているかどうかを確認します

Question

すべて、私は次の選択ボックスを持っています：

<select class="event_selection" name="Event[]" id="Event_<?php echo $i; ?>" > 
    <option value="original">Select Event...</option> 
    <option value="1">One</option> 
    <option value="2">Two</option>
</select>

私のフォームにはこれらがいくつかあります。ユーザーがドロップダウンから値を選択するとき、同じクラスを持つ別の選択でその値がまだ選択されていないことを確認したいと思います。

これを行う簡単な方法はありますか？もしそうなら、私を正しい方向に向けていただけませんか？

ありがとう！

Answer 1

 $("select.event_selection").change(function(){
    if ($(this).val() == $("select.event_selection").not(this).val()) {
        // match found
        alert('You have already selected this value');
        $(this).val('original'); //sets this back to original        
    }
 });

Answer 2

任意の値を 2 回選択できないようにしました。

var $coll = $( '.event_selection' ).on( 'change', function () {
    $coll.children().prop( 'disabled', false );
    $coll.each(function () {
        var val = this.value;
        if ( val === 'original' ) return;
        $coll.not( this ).children( '[value="' + val + '"]' ).prop( 'disabled', true );
    });
});

ライブデモ: http://jsfiddle.net/QVbQ6/2/

---

var $coll = $( '.event_selection' );

$( '#timeline_table' ).on( 'change', '.event_selection', function () {

    // my code
    $coll.children().prop( 'disabled', false );
    $coll.each(function () {
        var val = this.value;
        if ( val === 'original' ) return;
        $coll.not( this ).children( '[value="' + val + '"]' ).prop( 'disabled', true );
    });

    // your other code...

});

Answer 3

$(".event_selection").change(function(){
 if($(".event_selection:selected[value=" + $(this).val() + "]").length > 1) {
  // there are more than one select with this class and same value, do whatever you need
 }
});