Table row add and delete using liveware

#1

It is possible add row and delete row from liveware?
Please make a code how to add and delete row from liveware.

#2

Hi @santosh, yes it is possible.

But this is not a barbershop, is a forum where we are very happy to help you providing you are trying your best to make something.

Please read Livewire Documentation and try making the code by yourself, then if something does not work you can show us your code and we can help you figure out what the problem is.

You can start with something like this:

public $rows = 1;

public function addRow(){
    $this->rows++;
}

Best of luck.

#3

I am working with adding row and delete row in table but its not working.
When i click at addrow button with wire:click=“AddRow” row was added out side of table when i click it.

<table class="table table-responsive">
                <tr>
                    <td><button  class="btn btn-primary" wire:click="AddRow()"  id="AddRow">Addrow</button></td>
                    <td>
                        <span wire:click="delete()">delete</span>
                    </td>
                    <td></td>
                </tr>
                {{ $AddingRow }}
        </table>

Live wire Controller

public  $count=0;
public $AddingRow;
   
public function AddRow(){
   $val =  $this->count++;
    $html = '<tr id="'.$val.'">';
    $html .= '<td>';
    $html .= 'item details';
    $html .= '</td>';
    $html .= '<td>';
    $html .= '</td>';
    $html .= '<td>';
    $html .= '</td>';
    $html .= '<td>';
    $html .= '</td>';
    $html .= '<td>';
    $html .=  '<span wire:click="delete('.$val.')">delete</span>';
    $html .= '</td>';
    $html .= '</tr>';
    $this->AddingRow = $html;
}

which i added the row that row should be deleted when click at delete button

Please help me.

#4

That’s not a great way of going about it, and highly unmaintainable. You should have something like an array storing the data that goes in each row and foreach through it in your view taking care of the html there. I don’t feel that the response mrweb gave you was helpful at all or put you in the right direction to tackle this.

This should be better help:

#5

Hello xxdalexx,

Nice to meet you, Thank you for giving idea but I cannot catch it because I am newest one in liveware. I just jump from Jquery to livewire.

I have also no idea about Vue js, react js etc. so that might be problems to me. I just started learn in lock down.

Please Help me.

Thank you.

Stay Safe, COVID 19