我有一个30 - 80个输入的多选复选框，我为这个表单编写了Ajax代码，一旦选中复选框，它就会将记录发送到数据库。选择第25条或第26条记录后出现问题，错误是说值重复，但每个输入的值是唯一的。错误日志中提到的值是第一个选中的复选框的值。
我想实现的是，一旦复选框被点击，它应该保存在数据库中，一旦复选框被取消选中，记录应该从数据库中删除。
超文本：

<input type="checkbox" onClick="toggle(this)" /> Toggle All<br/>
                                        @foreach ($counties as $county)
                                            <li>
                                                <input class="checkIt" type="checkbox" id="cnty_id" name="cnty_id"
                                                value="{{ $county->id }}" @foreach($jct_fr_cnty as $jct) @if($jct->cnty_id == $county->id) checked @endif @endforeach>
                                                {{ $county->county }}
                                            </li>
                                        @endforeach

AJAX ：

$('.checkIt').bind('click', function() {
    if($(this).is(":checked")) {
        console.log("Checked");
        $.ajax({
        type: "POST",
        url: '{{ url('company/assignment/interstate/cntys') }}',
        data: $("#cntyselectform").serialize()
    }).done(function( result ) {
        console.log(result);
    });
    } else {
        console.log("Unchecked");
        $.ajax({
        type: "DELETE",
        url: '{{ url('company/assignment/interstate/cntysrem') }}',
        data: $("#cntyselectform").serialize()
    })
}
});

主计长

public function postcntyinterstate(Request $request)
{
    jct_fr_cnty::create([
        'cmp_id' => $request->cmp_id,
        'cnty_id' => $request->cnty_id,
        'svc_id' => $request->svc_id
    ]);

    return response()->json(['success'=>'Data is successfully added']);

}

这是切换所有按钮的代码，它选中所有复选框并将值发送到数据库，没有任何问题。

function toggle(source) {
        checkboxes = document.getElementsByName('cnty_id');
        for (var i = 0, n = checkboxes.length; i < n; i++) {
            checkboxes[i].checked = source.checked;
            console.log("Checked");
            $.ajax({
                type: "POST",
                url: '{{ url('company/assignment/interstate/cntys') }}',
                data: $("#cntyselectform").serialize()
            }).done(function(result) {
                console.log(result);
            });
        }
    }

表格代码：

<form id="cntyselectform" method="POST"
                            action="{{ route('company.cntyinterstate', ['company' => $company->id]) }}">
                            @csrf
                            <div class="col-lg-12 mb-3 mt-3 mb-sm-0">
                                <h3>Please select counties</h3>
                                <div name="cntSelect[]" id="cntSelect">
                                    <ul>
                                        <input type="checkbox" onClick="toggle(this)" /> Toggle All<br />
                                        @foreach ($counties as $county)
                                            <li>
                                                <input class="checkIt" type="checkbox" id="cnty_id" name="cnty_id"
                                                    value="{{ $county->id }}"
                                                    @foreach ($jct_fr_cnty as $jct) @if ($jct->cnty_id == $county->id) checked @endif @endforeach>
                                                {{ $county->county }}
                                            </li>
                                        @endforeach
                                    </ul>
                                </div>
                                <input type="hidden" value="{{ $company->id }}" name="cmp_id" id="cmp_id">
                                <input type="hidden" value="1" name="svc_id" id="svc_id">

                                {{-- <button id="cntyselect-button" type="submit" class="btn btn-primary">Submit</button> --}}
                            </div>
                        </form>

数据库：