Как адаптировать дополнение выпадающего списка Javascript к полученным данным базы данных Javascript AJAX?

В настоящее время у меня есть строка с двумя выпадающими списками, и первое раскрывающееся меню влияет на то, что во втором раскрывающемся списке, используя AJAX javascript: Room Types > Rooms of that type

И у меня есть AJAX javascript, чтобы добавить еще одну строку Room types > rooms.

Но случается так, что когда я добавляю еще одну строку выпадающих списков, когда я изменяю значение самого первого раскрывающегося списка в первой строке, это влияет на все последующие выпадающие списки на других строках.

Изображение выпадающих списков с первым раскрывающимся списком, затрагивающим все остальные выпадающие списки:

Как я могу добавить, что добавленные выпадающие списки также влияют на те, которые находятся рядом с ним?

create.blade.php(Javascript AJAX код для извлечения информации из базы данных):

    $('select[name="type"]').on('change', function() {
        var id = $(this).val();
        if(id) {
            $.ajax({
                url: '/myform/ajax/'+id,
                type: "GET",
                dataType: "json",
                success:function(data) {
                    $('select[name="rooms_id[]"]').empty();
                    $.each(data, function(key, value) {
                        $('select[name="rooms_id[]"]').append('<option value="'+ key +'">'+ value +'</option>');
                    });
                }
            });
        }else{
            $('select[name="rooms_id[]"]').empty();
        }
    });

в том же файле - код AJAX для добавления раскрывающегося списка:

    $('.add1').click(function () {
        var n = ($('.resultbody1 tr').length - 0) + 1;
        var tr = '<tr><td class="no">' + n + '</td>' +
                '<td> <div class="form-group"><select class="form-control" id="type" name = "type"> @foreach($roomtypes as $p)<option value="{{$p['id']}}">{{ $p['room_type']}}</option>@endforeach</select></div></td>' +
                '<td><div class="form-group"><select class="form-control" id="room" name = "rooms_id[]" style="width:300px" ></select></div></td>' +
                '<td><input class="input" name="price" id="price" type="text" value="-" readonly></td>' +
                '<td><div class="form-group row"><div class="col-10"><input class="form-control" type="number" value="0" id="example-number-input" name="pax"></div></div></td>'+
                '<td><span id="amount"></span></td>'+
                '<td><input type="button" class="btn btn-danger delete" value="x"></td></tr>';
        $('.resultbody1').append(tr);
    });
    $('.resultbody1').delegate('.delete', 'click', function () {
        $(this).parent().parent().remove();
    });

HTML-код из того же кода:

<td>
                                         <div class="form-group">
                                            <select class="form-control" id="type" name = "type" >
                                            @foreach($roomtypes as $p)
                                                <option value="{{$p['id']}}">{{ $p['room_type']}}</option>
                                            @endforeach
                                            </select>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="form-group">
                                            <select class="form-control" id="room" name = "rooms_id[]" style="width:300px" >
                                            </select>
                                        </div>
                                    </td>

>

Коды контроллера:

 public function myform()
    {
        $type = DB::table("room_types")
                ->pluck("room_type","id");
        return view('myform',compact('type'));
    }

public function myformAjax($id)
{
    $room = Room::get()
                ->where("room_types_id",$id)
                ->pluck("room_number","id");
    return json_encode($room);
}

public function myformAjax2($id)
{
    $type = DB::table("room_types")
                ->pluck("price","id");
    return json_encode($type);
}

web.php

Route::get('myform',array('as'=>'myform','uses'=>'InquiriesController@myform'));
Route::get('myform/ajax/{id}',array('as'=>'myform.ajax','uses'=>'InquiriesController@myformAjax'));
Route::get('myform/ajax2/{id}',array('as'=>'myform.ajax2','uses'=>'InquiriesController@myformAjax2'));
Route::get('myform/ajax3/{id}',array('as'=>'myform.ajax3','uses'=>'InquiriesController@myformAjax3'));