Bervetuna's avatar

Livewire pagination issues in combination with cart

In this project I use Livewire and installed a shopping cart package (bumbummen99/shoppingcart).

In the view, I'm looping through the products. I use WithPagination (10 results per page).

On every row there is a button to add the product to the cart.

 @foreach ($artikels as $artikel)
                          
                      
                      <tr>
                        <td class="px-2 py-2  whitespace-normal">
                          <div class="flex-shrink-0 flex items-center h-12">
                           {{ $artikel->artikelnummer }}
  
                          </div>
                          
                        </td>

                        <td class="px-2 py-2 whitespace-normal">
                          <div class="flex-shrink-0 flex gap-3 items-center h-12">
                           {{ $artikel->artikel }} 
  
                          </div>
                          
                        </td>
                         
                        <td class="px-2 py-2">
                          <div class="flex-shrink-0 flex items-center h-12">
                           {{ $artikel->categorie }}
  
                          </div>
                          
                        </td>
                            
                        <td class="px-2 py-2">
                          <div class="flex-shrink-0 h-12 flex items-center justify-start gap-2">

                            
                              <input  class="w-1/6 rounded-lg border-gray-500" placeholder="hoeveelheid" type="number" min="1" wire:model="aantal.{{ $artikel->id }}">
                              <button wire:click="add2cart({{ $artikel->id }}, '{{ $artikel->artikel }}')" class="bg-yellow-400 text-white p-2 rounded-md hover:bg-yellow-600 hover:font-semibold">
                                <i class="fa-solid fa-cart-plus"></i>
                            </button>
                        
                           
                       
                        
                          </div>
                          
                        </td>
                        </tr>
  
                   
                      
                        @endforeach 

The add2card function:

public function add2cart($id, $artikel){
        
        Cart::add($id, $artikel, $this->aantal[$id], 0, 0);
       
        $this->emit('cart_updated');
     }

This all works fine. However, there is an issue after adding a product (or more products on the same page). If I then try to load another 10 products with the links buttons, there is the following error:

Symfony\Component\HttpKernel\Exception\MethodNotAllowedHttpException The GET method is not supported for this route. Supported methods: POST

URL should look like this: http://127.0.0.1:8000/boodschappen?page=2

When I try to use pagination after adding something to cart, the URL (that comes with the error message) looks like this: http://127.0.0.1:8000/livewire/message/user.boodschappen?page=2

0 likes
0 replies

Please or to participate in this conversation.