asantibanez / livewire-select

Livewire component for dependant and/or searchable select inputs
MIT License
501 stars 95 forks source link

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'version') #43

Open alisanco opened 2 years ago

alisanco commented 2 years ago

I have followed the guide in the readme using your example. Trying to create a searchable field however am getting this error: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'version') at beforeAlpineTwoPointSevenPointThree (SupportAlpine.js:315) at isHiding (SupportAlpine.js:299) at alpinifyElementsForMorphdom (SupportAlpine.js:274) at onBeforeElUpdated (index.js:459) at callHook (morphdom.js:35) at morphEl (morphdom.js:199) at morphdom.js:332 at morphEl (morphdom.js:219) at morphdom.js:332 at morphEl (morphdom.js:219)

Livewire

<?php

namespace App\Http\Livewire\Admin;

use Livewire\Component;
use Asantibanez\LivewireSelect\LivewireSelect;
use Illuminate\Support\Collection;

class SelectTab9 extends LivewireSelect
{
    public function options($searchTerm = null) : Collection
    {
        return collect([
            ['value' => 'Model S', 'description' => 'Tesla - Model S'],
            ['value' => 'Model 3', 'description' => 'Tesla - Model 3'],
            ['value' => 'Model X', 'description' => 'Tesla - Model X'],
            ['value' => 'CRV', 'description' => 'Honda - CRV'],
            ['value' => 'Pilot', 'description' => 'Honda - Pilot'],
            ['value' => 'CX-3', 'description' => 'Mazda - CX-3'],
            ['value' => 'CX-5', 'description' => 'Mazda - CX-5'],
            ['value' => 'CX-9', 'description' => 'Mazda - CX-9'],
        ]);
    }
}

Blade

<livewire:admin.select-tab9 name="car_brand_id" placeholder="Choose a Car Brand" :searchable="true"/>

Thank you for your help!

bernhardh commented 2 years ago

Same here.

casbizz commented 2 years ago

Same here.

ajimatahari commented 2 years ago

i came accross this issue, but mine is resolved by adding this :

window.Alpine = Alpine

but make sure you're already had import Alpine from 'alpinejs' before that line in your app.js file.

then recompile the resources/js/app.js

aghorbanmehr commented 2 years ago

I have the same issue

Uploading livewire select issue v.mp4…

momojahlow commented 2 years ago

Thank youuu, This was the cause of my headache!! helped me a lot.

Marre-86 commented 1 year ago

window.Alpine = Alpine

thank you! It helped! weird stuff - 10 days ago it worked perfectly with simple Alpine.start();

stuartcusackie commented 9 months ago

Yes, it is weird. My code, which has been working fine for a long time, just stopped working all of a sudden. window.Alpine = Alpine made the errors go away.

I suspect something else is going on...