JSFiddle - React, Tailwind, and code Playground

by sedran

HTML

<select id="firstSelect"></select> and 
<select id="secondSelect"></select>

JavaScript

$(document).ready(function () {
    // Seçilebilecek tüm olası değerler
    var valueSet = ["Ali", "Veli", "Serdar", "Mehmet", "Ebru", "Ayşe", "Fatma", "Mert", "İlyas"];

    // Şu an seçili olan değerler
    var value1 = valueSet[0],
        value2 = valueSet[1];

    // Herhangi bir değer seçildiği zaman select 
    // boxları refresh etmeye yarayan fonksiyon
    var refreshSelectBoxes = function () {
        $("#firstSelect").html("");
        $("#secondSelect").html("");

        // bkz: jQuery.each 
        // http://api.jquery.com/jQuery.each/
        $.each(valueSet, function (index, value) {
            // ikinci select'de seçili olan değeri birincide gösterme
            if (value != value2) {
                var $option = $('<option />').attr('value', value).html(value).appendTo("#firstSelect");
                if (value == value1) {
                    // seçili olan değere selected özelliğini ekle.
                    $option.attr('selected', 'selected');
                }
            }

            // birinci select'de seçili olan değeri ikincide gösterme
            if (value != value1) {
                var $option = $('<option />').attr('value', value).html(value).appendTo("#secondSelect");
                if (value == value2) {
                    // seçili olan değere selected özelliğini ekle.
                    $option.attr('selected', 'selected');
                }
            }
        });
    };

    refreshSelectBoxes();

    // Birinci select'in değeri değişince
    $("#firstSelect").change(function () {
        // Değeri al, kaydet
        value1 = $(this).val();
        // ve select boxları yeniden yükle
        refreshSelectBoxes();
    });

    // İkinci select'in değeri değişince
    $("#secondSelect").change(function () {
        // Değeri al, kaydet
        value2 = $(this).val();
        // ve select boxları yeniden yükle
        refreshSelectBoxes();
    });
});