Как проверить выбранное значение из нескольких полей выбора с использованием одинаковых атрибутов (ID или Class)?

Question

Как проверить выбранное значение из нескольких полей выбора с использованием одинаковых атрибутов (ID или класс)?.

Здравствуйте, решатели проблем, я изо всех сил пытаюсь разработать лучший сценарий проверки для мои варианты множественного выбора раскрывающегося списка. Итак, у меня есть функция формы, которая может вставлять столько, сколько я хочу. Dynami c поле выбора, в котором данные генерируются из базы данных MySQL при каждом нажатии кнопки.

См. Ниже анимацию GIF.

введите здесь описание изображения

Это мой jQuery код для создания элементов формы добавления / удаления:

$(document).on('click', '#add', function() {
            var data = '<tr><td width="40" align="center">'+window.globalCounter+'</td><td width="350"><select data-select="jenis_layanan" name="id_jenis_layanan['+window.globalCounter+']" id="id_jenis_layanan'+window.globalCounter+'" data-id="'+window.globalCounter+'" class="form-control required input-group" data-live-search="true" data-msg-required="Pilih layanan">'+ambil_data_jenis_layanan(window.globalCounter)+'</select></td><td width="70"><input type="text" name="kode_jenis_layanan['+window.globalCounter+']" id="kode_jenis_layanan" data-id="'+window.globalCounter+'" class="form-control input-sm" placeholder="Kode" readonly></td><td width="100"><input type="text" name="tarif_jenis_layanan['+window.globalCounter+']" id="tarif_jenis_layanan" data-id="'+window.globalCounter+'" class="form-control input-sm" placeholder="Tarif" readonly></td><td width="80"><input type="text" name="satuan_jenis_layanan['+window.globalCounter+']" id="satuan_jenis_layanan" data-id="'+window.globalCounter+'" class="form-control input-sm" placeholder="Satuan" readonly></td></td><td width="110"><input data-text="berat_jumlah" type="text" name="berat_jumlah['+window.globalCounter+']" id="berat_jumlah'+window.globalCounter+'" data-id="'+window.globalCounter+'" class="form-control required number input-sm" placeholder="Berat/Jumlah" data-msg-required="Wajib diisi" data-msg-number="Harus angka"></td></td><td width="150"><input type="text" name="subtotal['+window.globalCounter+']" id="subtotal'+window.globalCounter+'" data-id="'+window.globalCounter+'" class="form-control input-sm" placeholder="Subtotal" readonly></td><td width="40" align="center"><button type="button" class="btn btn-danger btn-sm" id="delete"><i class="glyphicon glyphicon-remove"></i></button></td></tr>';
    
            tableForm.find('tbody').append(data);
            window.globalCounter++;
    });

Это функция для получения типов услуг от CodeIgniter:

// ambil data jenis layanan = retrieve type of laundry services 
function ambil_data_jenis_layanan(cnt = 0) {
    $.ajax({
        type: 'POST',
        url: "<?php echo base_url('CucianMasuk/ambil_data_jenis_layanan');?>",
        data: {},
        dataType: 'JSON',
        cache: false,
        success: function(response) {
            $('select#id_jenis_layanan'+cnt).html('');
            var option = '<option value="">Pilih Jenis Layanan</option>';
            for (var i = 0; i < response.length; i++) {
                option += '<option value="'+response[i]['id_jenis_layanan']+'">'+response[i]['nama_jenis_layanan']+'</option>';
            }
            $('select#id_jenis_layanan'+cnt).append(option).selectpicker('refresh');
        }
    });
}

Это код для заполнения опций выбора данными:

public function ambil_detail_jenis_layanan() {
            $sql = $this->m_jenis_layanan->jenis_layanan($this->input->post('id'));
            echo json_encode(['kode_jenis_layanan' => $sql['kode_jenis_layanan'], 'tarif_jenis_layanan' => $sql['tarif_jenis_layanan'], 'satuan_jenis_layanan' => $sql['satuan_jenis_layanan']]);
    }

Этот текущий код для проверки выбранного значения из каждого Dynami c сгенерированные параметры выбора:

// mengambil data jenis layanan berdasarkan pilihan pelanggan
        // https://stackoverflow.com/questions/45803813/jquery-select-box-multiple-option-get-value-and-match-values
        $(document).on('change', 'select[data-select=jenis_layanan]', function(){
            var dataid = $(this).attr('data-id'),
            id = $(this).val(),
            arr = [],
            jenisLayanan = [];
        
            $.each($('select[data-select=jenis_layanan] option:selected'), function(){
                arr.push($(this).val());
                jenisLayanan.push($(this).text());
            });
                    
            var values = $('select[data-select=jenis_layanan]').map(function() {
                return this.value;
            }).toArray();
        
            var hasDups = !values.every(function(v,i) {
                return values.indexOf(v) == i;
            });
        
            if(hasDups){
                    // if found duplicate selected values from 
                    // each select options, display such message
                    // later on planned to put in Bootstrap Modal 
                    // for more professional look
                alert('Sorry mate, this service already listed into the form: ' + jenisLayanan.join(', ') + '\n');
                return false;
            } else {
                    // if each selected values are not same from each select elements
                    // get data via AJAX and put in assigned HTML form elements
                    // and set the cursor focus to the berat_jumlah input box to let the user enter the weight of the laundry of number of clothes being laundry
                $.ajax({
                    type: 'POST',
                    url: "<?php echo base_url('CucianMasuk/ambil_detail_jenis_layanan');?>",
                    data: {id:id},
                    dataType: 'JSON',
                    cache: false,
                    success: function(response) {
                        tableForm.find('tbody tr td input#kode_jenis_layanan[data-id='+dataid+']').attr('value', response.kode_jenis_layanan);
                        tableForm.find('tbody tr td input#tarif_jenis_layanan[data-id='+dataid+']').attr('value', response.tarif_jenis_layanan);
                        tableForm.find('tbody tr td input#satuan_jenis_layanan[data-id='+dataid+']').attr('value', response.satuan_jenis_layanan);
                        tableForm.find('tbody tr td input#berat_jumlah'+dataid).focus();
                    }
                });
            }
        });

Наконец, мне нужно сохранить все данные в базе данных, но я застрял при проверке выбранных элементов. Большое спасибо всем, кто может помочь.