Laravel Batch Update Data Based on Checked Checkboxes Error

I have a table that has checkboxes on the left column that looks like this :

Table

What I want to try to do is assign a surveyor name using the select option in a modal to the surveyor column for all of the checked rows.

Modal

If I checked the first 4 rows of the table and then click the "Try Assign", it will only fill the last checked row (4th row), not all of the checked rows. I think I've already used Foreach in my Controller so I don't know yet what is wrong with my code.

Result

This is my modal code :

<div class="modal fade" id="city-modal" aria-hidden="true">
<div class="modal-dialog modal-md">
    <div class="modal-content">
        <div class="modal-header">
            <h4 class="modal-title" id="CityModal"></h4>
        </div>
        <div class="modal-body">
            <form action="javascript:void(0)" id="CityForm" name="CityForm" class="form-horizontal" method="POST" enctype="multipart/form-data">
                <input type="hidden" name="id" id="id">
                <div class="form-group">
                    <label for="name" id="labelname" class="col-sm-2 control-label">Name</label>
                    <div class="col-sm-12">
                        <input type="text" class="form-control" id="name" name="name" placeholder="Enter City Name" maxlength="50">
                    </div>
                </div>
                <div class="form-group">
                    <label for="name" id="labelpopulation" class="col-sm-2 control-label">Population</label>
                    <div class="col-sm-12">
                        <input type="text" class="form-control" id="population" name="population" placeholder="Enter City Population" maxlength="50">
                    </div>
                </div>
                <div class="form-group">
                    <label id="labelsurveyor" class="col-sm-2 control-label">Surveyor</label>
                    <div class="col-sm-12">
                        <select class="form-control select2" id="surveyor_id" name="surveyor_id"                                    ">
                            <option value="">--Select Surveyor--</option>
                            @foreach($users as $surveyor)
                            <option value="{{ $surveyor->id }}">
                                {{$surveyor->name}}
                            </option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-primary" id="btn-save">Save changes</button>
                </div>
            </form>
        </div>
        <div class="modal-footer">
        </div>
    </div>
</div>

This is my JavaScript code for assigning the surveyor:

$(document).on('click', '.try-assign', function(e) {
    var cityId = [];
    var svrid;

    $('.checkbox:checked').each(function() {
        cityId.push($(this).val());
        console.log(cityId);
    });

    if (cityId.length > 0) {
        $.ajax({
            type: "PUT",
            url: "{{ url('try-assign') }}",
            data: {
                cityId,
                svrid
            },
            dataType: "json",
            success: function(res) {
                $('#CityModal').html("Assign Surveyor");
                $('#city-modal').modal('show');
                $('#labelname').attr('hidden', true);
                $('#labelpopulation').attr('hidden', true);
                $('#labelsurveyor').attr('hidden', false);
                $('#id').val(res.id);
                $('#name').val(res.name).attr('hidden', true);
                $('#population').val(res.population).attr('hidden', true);
                $('#surveyor_id').val(res.surveyor_id).attr('disabled', false);
                $('#surveyor_id').trigger('change');
                svrid = res.surveyor_id;
            }
        });
    } else {
        alert('Please select atleast one row');
    }
});

This is my tryAssign() function on the Controller :

public function tryAssign(Request $request)
{
    $cityId = $request->cityId;
    $svrid = $request->svrid;
    foreach ($cityId as $key => $value) {
        $city = City::find($value);
        $city->surveyor_id = $svrid;
        $city->update();
    }

    return Response()->json($city);
}

And, this is my route :

Route::put('try-assign', [CityController::class, 'tryAssign']);