How to Upload file using jQuery AJAX with Validation in CakePHP 4

Asynchronous file upload gives the user a more seamless experience by allowing them to upload files without having to reload the page.

Handle the file on the client side using jQuery and JavaScript, send the file to the server using an AJAX request, and then process the file on the server.

If the file is not validated then you can immediately display the error messages.

In this tutorial, I show how you can upload file using jQuery AJAX with validation and display a preview of it after uploading it in CakePHP 4.

How to upload file using jQuery AJAX with Validation in CakePHP 4

Read more

How to send AJAX request using jQuery in CakePHP 4

AJAX (Asynchronous JavaScript and XML) is an important part when building a dynamic web application. You can send requests to a server and update parts of a web page without reloading the whole page.

In CakePHP 4 CSRF protection is already enabled, you can use this to securely send AJAX requests.

In this tutorial, I show how you can send AJAX request using jQuery with and without a CSRF token in CakePHP 4 project.

How to send AJAX request using jQuery in CakePHP 4

Read more

Detect user is Online or Offline using Livewire in Laravel

If you are using Livewire then you don’t need to include any external library or write a script to detect if a user is online or offline.

Livewire already provided a utility to perform offline action check. You only need to add it to the HTML element that gets affected according to the user state.

In this tutorial, I show how you can detect if the user is online or offline and display an alert using Livewire in Laravel 9.

Detect user is online or offline using Livewire in Laravel

Read more

How to Prefetch data on Mouseover in Livewire – Laravel 9

In Livewire you can prefetch the data from the database before the user click on the HTML element. Data will show instantly on click if it is already loaded.

For this, you have to add prefetch modifier to the event.

In this tutorial, I show how you can preload content when the mouse over on an element in the Livewire component in Laravel 9 project.

How to Prefetch data on mouseover in Livewire - Laravel

Read more