laravel submitting multiple rows of a form to mysql by creating duplicate rows

menu cd 0
Viewed 46

i have this form in larvel that will submit data to mysql database every time i click Add Morenew row is created using script i want to submit all the rows at ones

<form action={{route('invetory.create')}} method="post">
    @csrf
    <div id="service">
        <input type="text" name="item"/>
        <input type="text" name="tax" />
        <input name="price" type="text" />
        <input name="selling_price" type="text" />
        <input name="total_price" type="text" />
        <input type="submit"/>
    </div>
</form>   
<a class="btn-floating btn-primary" id="addmore"   onclick="duplicate()">Add More</a>

input fields duplicating script

<script>
function duplicate() {    
    var original = document.getElementById('service');
    var rows = original.parentNode.rows;
    var i = rows.length - 1;
    var clone = original.cloneNode(true); // "deep" clone
    clone.id = "duplic" + (i); // there can only be one element with an ID
    original.parentNode.insertBefore(clone, rows[i]);
}</script>

invetory.create route in web.php

`Route::post('/inventory', 'App\Http\Controllers\InventoryController@create')->name('invetory.create');`

funtion in InventoryController.php

public function create(Request $REQUEST){
    Inventory::Create($REQUEST->all());
    return redirect()->action([InventoryController::class, 'index']);
}
laravel-9 php laravel
2 Answers

If I am not wrong, what I get from your question is that you want to insert multiple data in single query.

You have to give field name using array other wise it is difficult to differentiate multiple data using same key name. Array will differentiate your data using index value with same name.

Here is a simple example what you want to implement. According to this you can create your own format. Here I used table structure, if you want you can use div structure.

In Blade file:-

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
   
<div class="container"> 
   
    <form action="{{route('invetory.create')}}" method="POST">
   
        <table class="table table-bordered" id="dynamicTable">  
            <tr>
                <th>item</th>
                <th>tax</th>
                <th>price</th>
                <th>selling_price</th>
                <th>total_price</th>
                <th>Action</th>
            </tr>
            <tr>  
                <td><input type="text" name="invetory[0][item]"  class="form-control" /></td>  
                <td><input type="text" name="invetory[0][tax]"  class="form-control" /></td>  
                <td><input type="text" name="invetory[0][price]"  class="form-control" /></td>
                 <td><input type="text" name="invetory[0][selling_price]"  class="form-control" /></td>
                  <td><input type="text" name="invetory[0][total_price]"  class="form-control" /></td>

            </tr>  
        </table> 
       <button type="button" name="add" id="add" class="btn btn-success">Add More</button>
    
        <button type="submit" class="btn btn-success">Save</button>
    </form>
</div>
   
<script type="text/javascript">
   
    var i = 0;
       
    $("#add").click(function(){
   
        ++i;
   
        $("#dynamicTable").append('<tr><td><input type="text" name="invetory['+i+'][item]"  class="form-control" /></td><td><input type="text" name="invetory['+i+'][tax]"  class="form-control" /></td><td><input type="text" name="invetory['+i+'][price]" class="form-control" /></td><td><input type="text" name="invetory['+i+'][selling_price]" class="form-control" /></td><td><input type="text" name="invetory['+i+'][total_price]" class="form-control" /></td><td><button type="button" class="btn btn-danger remove-tr">Remove</button></td></tr>');
    });
   
    $(document).on('click', '.remove-tr', function(){  
         $(this).parents('tr').remove();
    });  
   
</script>
  
</body>
</html>

And in controller you have to do like this

public function create(Request $request){
    foreach ($request->invetory as $key => $value) {
        Inventory::create($value);
    }
    return redirect()->action([InventoryController::class, 'index']);
}
Nima Patel0

You may use

public function create(Request $REQUEST){
Inventory::firstOrCreate($REQUEST->all());
return redirect()->action([InventoryController::class, 'index']);

}

You may also check laravel docs

Ammar Lexmodo0
Related