Laravel Form with Validation and store Jquery add html elements

Question

i use Laravel and i have a form with laravel validation and required fields (so when I get errors, it reload always all page, and I keep values with old blade tag). All good, but I did a button to add some text boxes with jquery

$(".add-more").click(function(){ 
      var html = $(".copy").html();
      $(".after-add-more").before(html);
    });

    $("body").on("click",".remove",function(){ 
      $(this).parents(".control-group").remove();
    });

How can i save old values and the created n-html elements when Laravel reload all page at every invalid message after submission ? Thx

Your question is not clear try adding some code so that we can understand. — Akhtar Munir
Best practice would be to not reload the page and keep the html as is. Manage the validations without reload. — gaganshera
Also in Laravel framework? I know that Laravel always reload, for this exists old value retriever.....are u sure? — Marco Bozzola
Well I would suggest to use localStorage save data into localstorage, retrieve when you need it, but remember to empty localstorage on each reload page. — Akhtar Munir

Defcicer Defcicer · Accepted Answer · 2020-05-11T19:19:41

Its quite simple, you dont reload the whole page, include an element with laravel's @include for example, the contents of the table are in another blade file, but it is included

<table class="table tablesorter ">
    <thead class=" text-primary">
        <tr>
            <th scope="col">ID</th>
            <th scope="col">TIPO</th>
            <th scope="col">fecha</th>
            <th scope="col">Monto</th>
            <th scope="col">Acciones</th>
        </tr>
    </thead>
    <tbody id="table">
        @include('component-table')
    </tbody>
</table>

component-table.blade.php


    <tr>
        <td>hi</td>
        <td>
            test
        </td>
        <td></td>
        <td></td>
        <td class="text-right">

        </td>
    </tr>

Now, you can make a controller that returns this view and reload only the table when you call that controller and just replace the html with jquery's html() function

//on controller 
    public function table()
    {
        return view('component-table.blade.php');
    }
//js
    async function reloadTable(){
        await $.ajax({
            type: "GET",
            url: "{{ route('component-table') }}",
            data: '',
            success: function(response){
                            $('#table').html(response)
                        }
        });
    }

Laravel Form with Validation and store Jquery add html elements

2 Answers