How to Auto populate dropdown using Livewire – Laravel

If you are using Laravel for your web development, then you may have come across a requirement to auto-populate a dropdown with the database data.

For example, you may have a form with a country field and you want to auto-populate the states field on the form based on the country selected by the user.

In this article, I show how to auto-populate a dropdown using Livewire in Laravel 9.

I am hoping you have already installed Livewire on your project if not then you can view my previous post for installation.

How to Auto populate dropdown using Livewire - Laravel

Read more

How to Autocomplete textbox using JavaScript and PHP

Javascript Autocomplete textbox helps the user to pick an item from the suggestion list based on the input. It occupies less space on the page. It’s designed to give you a smooth experience while using minimal space on your webpage, making your interface look neat and organized.

Data is not preloaded on the page. Instead, it dynamically loads data using AJAX as soon as the user starts typing.

In this tutorial, I show how you can create autocomplete textbox with MySQL database data using JavaScript and PHP.

How to Autocomplete textbox using JavaScript and PHP

Read more

Make Live Autocomplete Search with Livewire in Laravel

Looking to add a live autocompleΒ­te search featureΒ­ to your Laravel 10 application? You’re in luck! This article can heΒ­lp you implement this amazing featureΒ­ using Livewire and without any neeΒ­d to worry about Alpine.js. With the new autocompleΒ­te search, users can find information quickly and eΒ­asily for an enhanced user eΒ­xperience.

To start, the reΒ­ader will be guided through a steΒ­p-by-step process for setting up theΒ­ necessary components. First, creΒ­ating a database table and defining theΒ­ required model. Then, create a controller and set up the required routes.

LivewireΒ­ steals the spotlight in building the coreΒ­ functionality of autocomplete search. ReΒ­al-time suggestions are handleΒ­d smoothly by Livewire, eliminating unneΒ­cessary struggles with searching. A useΒ­r-friendly view will be creΒ­ated to showcase the beΒ­auty of both the search box and its results; no neΒ­ed to worry about leaving anyone hanging.

By the eΒ­nd of this tutorial, readers will discover a fully functional autocompleΒ­te search featureΒ­ perfectly aligned with theΒ­ir Laravel 10 application. The best part? No AlpineΒ­.js or client-side JavaScript is neceΒ­ssary! Livewire’s impressiveΒ­ capabilities create an eΒ­xceptionally smooth and fast autocomplete seΒ­arch experienceΒ­ for your Laravel app. Join us on this exciting journey as weΒ­ get started!

Make Live Autocomplete Search with Livewire in Laravel

Read more