'Form repeater send wrong data with last element in Laravel

My form sends multiple forms of (name and image). However, the last element sends a name only with the wrong 'name.' Do I need to simultaneously make multiple inserts in the database to solve this problem?

  1. Form View
  2. Dump of the request with wrong last element of array
  3. Script of repeat the form

<div class="row">
    <div class="col-12">
        <form class="form repeater-default" method="POST" 
              action="{{ route('admin.cat.doCreate2') }}"
              enctype="multipart/form-data">
            @csrf
            <input type="hidden" name="admin_id" 
                   value="{{ auth()->guard('admin')->user()->id }}">
            <div data-repeater-list="group_a">
                <div data-repeater-item>
                    <div class="row justify-content-between">
                        <div class="col-md-4 col-sm-12 form-group">
                            <label for="Name">Name </label>
                            <input type="text" class="form-control" name="name[]" required
                                   placeholder="Enter Name of Category">
                        </div>
                        <div class="col-md-4 col-sm-12 form-group">
                            <label for="Image">Image </label>
                            <input type="file" class="form-control" name="image[]">
                        </div>
                        {{-- Delete Button --}}
                        <div class="col-md-2 col-sm-12 form-group d-flex align-items-center pt-2">
                            <button class="btn btn-danger" data-repeater-delete type="button"><i
                                        class="mdi mdi-x"></i>
                                Delete
                            </button>
                        </div>
                    </div>
                    <hr>
                </div>
            </div>
            <div class="form-group">
                <div class="col p-0">
                    <button class="btn btn-primary" data-repeater-create type="button"><i class="mdi mdi-plus"></i>
                        Add
                    </button>
                </div>
                <div class="col p-0">
                    <button class="btn btn-success" type="submit"><i class="mdi mdi-account"></i>
                        Done
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

Script

<script>
$(document).ready(function(){
  $("#myInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $("#tableData tr").filter(function() {
      $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
  });
});
</script>


Solution 1:[1]

first solution : inputs and their labels must be on table tag and th tag and td tag to send right data second solution : dont use array for inputs names like name[ ] or image[ ] :

<div class="col-md-4 col-sm-12 form-group">
<label for="Image">Image </label>
 <input type="file" class="form-control" 
 name="image">
</div>

and receive datas like this :

$data=$request->group_a

group_a is your data-repeater-list name :

<div data-repeater-list="group_a">

and now you can put $data in foreach and use data arrays for create ...insert and anything

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1