My div lose its class after wire:click

#1

I have a jquery lightslider with a class: doorpageslider. After clicking on the image to send the id the page becomes refresh and no more slider and images show without sliding ! by removing the wire:click no problem on click.

<div class="doorpageslider">
      @foreach($doors as $d)
        <div>
          <a href="#colors"
             wire:click="door({{ $d->id }})">
            <img
              class="cursor-pointer"
              src="{{ asset('images/doors/' . $d->image) }}"
            >
          </a>
        </div>
      @endforeach
    </div>
#2

Your wire click is inside an anchor (link) so if you do not prevent the default behaviour then the page will reload.

To stop this add the .prevent modifier

          <a href="#colors"
             wire:click.prevent="door({{ $d->id }})">
            <img
              class="cursor-pointer"
              src="{{ asset('images/doors/' . $d->image) }}"
            >
          </a>
#3

No. I think the problem arises from slider itself because it loses it classes.

#4

How does the item get its class in the first place?

#5

I must upload it then everything become more clear !

#6

I switched to Ajax, worked fine !