Hi

Do MDB still has no support for livewire?

SAMI

Hello,

with version 3.6.0 labels in selects within a modal are displayed again when this is loaded via LiveWire. A select without modal loaded via LiveWire now does not work at all. The default value is no longer displayed, or the label disappears by choice, or the select is duplicated. It is frustrating. If only I had stayed with MDB4. Now I have to take the original Bootstrap 5 Selects as a temporary solution.

I can't provide a snippet because I don't know how to simulate LiveWire's behavior.

Translated with www.DeepL.com/Translator (free version)

Hello,

I am also using Laravel LiveWire and it is very frustrating that this all worked with MDB4 jQuery and now it doesn't work with MDB5. I relied on the statement that it is already usable in production. But that is absolutely not the case. Many things no longer work or work differently, some in MDB4 is not yet available in MDB5 and what also annoys me is that plugins I used from MDB4 in MDB5 is now only in the much more expensive Advanced package. Of course, some things are better, otherwise I would not have dared the switch. But it is annoying and unnecessarily stops that functions that simply worked in MDB4, now become a real challenge.

Back to the topic: When I create a form in LiveWire, I first have to initialize all MD5 components like DropDowns and Inpus. This was not so in MDB4, but it is doable. LiveWire is also used because of the interactivity. I.e. if I want to evaluate an input before the form is submitted (e.g. to validate the input on the server side or to fill a DropDown field with suitable data) then the DopDowns and Input fields break every time and have to be initialized again. This is not only inconvenient, but also looks stupid.

So if anyone here has some useful tips on how to combine the functionality of LiveWire and the great look of MDB5 without it getting too complicated.

Thanks Greetings

Sorry to complain, but you have a very frustrating support forum software. I lost my bug ticket the first time I tried to post it due to error 406. Now I just lost my message again because I was not logged in and once I click "Post" and sign in, the page reloads and the comment is gone.

So here we go again... The problem with the active class can be worked around by having @if(strlen($email ?? '') > 0) active @endif in the input class. What still doesn't work though is the border and this is caused by the form-notch div which is missing after Livewire does its magic. That div appears to be added by your JavaScript on page initialization as it also calculates some widths and uses them in inline styles on children of form-notch. Is it possible to programatically re-init inputs? I imagine this is mandatory also when dynamically creating input elements and adding them to the DOM after the page was loaded.

The main difference is that floating labels don't use JS. Our component is more complicated, which forces us to use JS. Unfortunately, it seems that due to the way the wire:model works, it doesn't work properly. I suppose input value is empty after blur. This removes the active class in our code.

That's an unsatisfactory answer as it's pretty much a show-stopper for us. We assumed Bootstrap 5 functionality is extended, not reduced with MDBoostrap. :( Having to manually perform all Ajax requests is a major drawback.

As for why the input border is gone - this seems to be caused by the fact that the form-notch div and its children are removed.

Unfortunately, we do not currently support Livewire. It looks like Livewire is removing the active class from the label for some reason, which is causing the problem you described.