Just trying out Livewire and I’ve gotten stuck along the way. I got to a stage where I need to pass a dom elements value, but unsure of the best practice in doing this, and if its even possible through livewire? View: <div> <textarea class="form-control mb-3" wire:keydown.enter="addComment(‘Guest’, ‘This textareas value here’)"></textarea> <hr> @foreach ($comments as ..
Category : laravel-livewire
I’m trying to learn how to work with events and pusher, I’ve started with something very simple I am working with laravel 8 livewire. From pusher to view it works fine, but when I call the event from the component I get the error : https://flareapp.io/share/dmkzeG65#F77 View: <div> <div class="mt-20 col-span-2 editor mx-auto w-10/12 flex ..
I created a resourceful laravel livewire component instead of going the controller route and was wondering if this practice is a clean approach? I’ve also eliminated the render method and have 3 methods that display a view. the problem with this i’ve noticed is that the wire:submit.prevent wont work. for example: routes Route::resource(‘products’, ‘ProductComponent’); Component: ..
Been searching for Laravel / Livewire examples of how to show and edit pivot data on a form for a single instance of a ManyToMany relationship. for example "documents has many materials – materials has many documents, pivot table has extra columns "item & quantity". I have already built a index view and can attach/sync/detach ..
Unable to detect application namespace. after livewire request The above error is displayed when livewire request is issued. This happened to me when I called this comman in route/web.php: > Route::get(‘/artisan’, function(){ > $ok = Artisan::call(‘vendor:publish –tag="melipayamak"’); > return ‘ok’; }); (my project is on server Cpanel) help me please Sourc..
I have need to complete the functionality of rating start. In this code two Models use Post model and PostRate models. Post Model have three attributes like id, title, description PostRate have id, post_id, rate. I have make livewire Component Rate and Resource of rate <?php namespace AppHttpLivewire; use AppModelsPost; use AppModelsPostRate; use LivewireComponent; class ..
I have a fairly complex issue, I have an animal model class Animal extends Model { use HasFactory; protected $fillable = [ "breed_ID", "name", "color_ID", "eyes_color_ID", "birth_date", "animal_types_id", "born_location", "profile_picture_id", "gender_ID", "status", "image", "bio", "lenght", "weight", "passport_url", "chip_number", "breeder_ID", ]; protected function genders(): BelongsTo { return $this->belongsTo(Gender::class); } public function borns(): BelongsTo { return $this->belongsTo(Born::class); ..
Not sure what I’m missing here, but nothing I do seems to allow @push(‘styles’) or @push (‘scripts’) to work. layout/app.blade.php includes: … @livewireStyles … @livewireScripts … livewire/tagify.blade.php @push(‘styles’) <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@yaireo/[email protected]/dist/tagify.min.css"> @endpush @push(‘scripts’) <script src="https://cdn.jsdelivr.net/npm/@yaireo/[email protected]/dist/tagify.min.js"></script> <script> document.addEventListener("DOMContentLoaded", function(event) { var input = document.getElementById(‘tagify’) var tagify = new Tagify(input, { whitelist : [ @foreach($tags as $tag) ..

I have 1 component which is growing large, component consists of filter properties (selected and all available from DB). How to properly structure my code in this case? I cant split it into multiple smaller components because as stated in documentation "props will lose reactivity" which is mandatory for such kind of functionality (ads filter). ..
i’m trying to make a transition effect to text in livewire its working with {{ $html }} <p class="text-gray-600" x-data="{show: false}" x-show.transition.duration.1000ms="show" x-init="setTimeout(() => { show = true })" id="{{ $slide[‘current’][‘id’] }}c">{{ ‘<h1>hi</h1>’ }}</p> but it didn’t work with {!! $html !!}} <p class="text-gray-600" x-data="{show: false}" x-show.transition.duration.1000ms="show" x-init="setTimeout(() => { show = true })" id="{{ ..
I’m working on a project where I use Livewire to create components that will be rendered in a view. Basic stuff, but I’ve come across this weird problem that I haven’t been able to find the answer to in a few days. When I load a component in my blade, it just pops up for ..

so i have custom telplate using bootstrap , then my modal jestream covered / behind the navigation & sidebar.. how to set the modal infront of all layer? look at this screenshot : this is my modal confirm in blade file : <!– Delete User Confirmation Modal –> <x-jet-dialog-modal wire:model="confirmingUserDeletion"> <x-slot name="title"> {{ __(‘Hapus akun’) ..
I cannot solve this for the life of me. I have a list in my blade file that looks like: @foreach($interactions as $interaction) <div class="border rounded px-2 my-2 op-gray w-100"> <div class="d-flex flex-justify-between"> <div> <b class="fg-steel">{{$interaction->user->name ?? ‘Usuario No Existente’}}</b> <small class="">{{$interaction->created_at}}</small> </div> <span class="fg-steel">{{$interaction->InteractionType->type_name}} <small class="fg-green p-1 rounded">{{$interaction->InteractionType->status_name}}</small></span> </div> <div> {{$interaction->body}} </div> </div> @endforeach ..

I manipulated a table with livewire and use alpine js to get some info from table. when I use @click, when press on paginate to next page I got this error Uncaught (in promise) DOMException: Failed to execute ‘setAttribute’ on ‘Element’: ‘@click’ is not a valid attribute name. I fixed this problem by using x-on:click ..
Scenario What i try to do I am creating a multicolumn user index page, where the right column shows details from the user selected in the left column. When selected, the user is not pulled out of the collection but freshly out of the database, so the data is up to date. I defer the ..
Using livewire to control a form with some fields and image uploading capability <form enctype="multipart/form-data" class="flex justify-center" wire:submit.prevent="upload"> <input accept="image/*" wire:model="image.image" type="file" class="w-full h-full opacity-0 cursor-pointer" name="upload"> </form use AppModelsAnimal; use AppModelsImage; use LivewireComponent; use LivewireWithFileUploads; class AddAnimal extends Component { use WithFileUploads; public Animal $animal; public Image $image; protected array $rules = [ ‘animal.name’ ..
I have a select field with values from a table that I would like to compare with another table and mark as selected if a value matches. <select name="tour" class="form-control form-control-sm" wire:model="selectTour"> @foreach($touren as $tour) <option {{ $beleg->Tour == $tour->Gruppe ? ‘selected’ : ” }} value="{{ $tour->Gruppe }}">{{ $tour->Gruppe }}</option> @endforeach </select> If I now ..
After creating new Component in Livewire i have this html code into this comonent layout: <div> <form wire:submit.prevent="submit" method="POST"> @csrf <div class="form-group row"> <label class="col-form-label col-lg-3"> category name: <span class="text-danger">*</span> </label> <div class="col-lg-12"> <input wire:model="name" type="text" name="name" class="form-control"> </div> </div> <div class="text-right"> <div class="btn-group" role="group"> <button type="submit" class="btn btn-primary">create</button> </div> </div> </form> </div> and this ..

I have a page with one product details. We can ask multiple questions on that page using form and each question can have one reply only. Reply form is only shown when there is no previous reply of that question. There is validation for the reply (required). When I click on reply button, error message ..
Sorry for my bad english. This is my first post here and I’m a kind of noob in developpment.. Thanks to a lot of reading and some tutorials, I managed to build a small Laravel application. For various reasons, I decided to include Livewire and it’s great. However, I’m facing some issues in searching and ..
I am trying to create a conditional form that adds a text input when a particular option is selected. I am looping through "colors" and one of the options is "Other". If "Other" is selected, I need to add in an input field in order to type the desired color. This is my current select ..

i’m confusing of this code. i dont know why this be error. this is the livewire function : public $members; public function render() { $this->members = "members"; return view(‘livewire.members’); } and the view : <div> <h1>{{$members}}</h1> </div> but i got this error Sourc..
I have a Filepond component that works great for uploading images to a post. However, I’m struggling with Filepond when needing to edit a post and its pre-exisiting images. I want to load Filepond with the Post model’s pre-existing images. The goal is to allow the user to upload, delete and reorder the images when ..
I am new in livewire. i am working on registeration process of user. Register form is quite big and validaions also working fine to me. Now problem is when user submits the form validations came but user not able to see beacuse submit button is at bottom and form is at top. When i manullay ..

How to validate by showing a red ring around the radio button and make text red. Currently I am just showing a validation popup message. See image for a better idea. Radio component <input type="radio" {!! $attributes->merge([‘class’ => ‘border-gray-300 text-gray-600 shadow-sm focus:border-gray-300 focus:ring focus:ring-gray-200 focus:ring-opacity-50’]) !!}> Livewire view snippet <div class="space-y-5"> @foreach ($ticket_types as $ticket_type) ..