Why POST request will be called multiple times based on the array data passing to server?

I push the id to the array when checkbox is checked.

var items=[];

$("#selection").click(function(e) {
            $(":checkbox").each(function() {
                if(this.checked === false) {
                    this.checked = true;
                    items.push(this.id);
        });
        }); 

When i submit, the item saved to database but at the "network monitor' it displays a lot of POST request which is unusual.

$('#grid').submit(function(e){

            $.ajaxSetup({
                headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') }
            });
            e.preventDefault();

            var formdata = {
                item:items
            };
            $.ajax({
                type: "POST",
                url: "/addItem",
                data: formdata ,
                dataType:'json',
                success: function(data) {
                    swal(
                        'Great!',
                        'Item added!',
                        'success'
                    ) ;
                }
            });

        });

The POST request will be called based on the number of item in items array. Is there anything wrong with my code?