Duplicate entires into database while using ajax to insert

I am trying to user ajax to insert into the database for my laravel project but each time i insert i see duplicates of every item with a unique id. Inserting normally with the form itself, this behavior doesn't repeat.

My ajax code s below.

    `$('#saveCat').on('click', function (e) {
 e.preventDefault();
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });


    var url = '/admin/storecat';
    var type = "post";

    var data = {spec: $('#cat').val() };

    $.ajax({
        type: type,
        url: url,
        data: data,
        dataType: 'json',
        success: function (data) {
            console.log(data);

            $('#catform').trigger('reset');

            //show success alert msg
            $('#alert-suc').html(data);
            $('#ac-alert').show('slow', function () {
                setTimeout(function () {
                    $('#ac-alert').hide('slow');
                }, 3000);
            });
        },
        error: function (data) {
            console.log('Error:', data);
        }
    });
});

My controller action here

public function storeCat(Request $request) {

$Category = new Category;

$Category->name = $request->spec;
$Category->save();

return response()->json('New service category ' . $request->spec . ' has been added.');

}

via user2770155