JQuery Archives - Makitweb

Effortless File Uploads: Progress Bar Magic with jQuery AJAX & PHP

Last updated on November 22, 2023 by Yogesh Singh

Unlock a seamless and user-friendly approach to file uploads with the power of AJAX. If you find yourself enabling the upload of larger files, consider enhancing the user experience by incorporating a progress bar.

This visual element keeps users informed in real-time about the ongoing upload process, ensuring a smoother and more engaging interaction.

In this tutorial, I’ll guide you through the implementation of jQuery AJAX file upload with PHP, accompanied by a visually appealing progress bar.

Effortless File Uploads: Progress Bar Magic with jQuery AJAX & PHP

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

Last updated on February 19, 2023 by Yogesh Singh

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

Reorder images and save to MySQL database – CodeIgniter 4

Last updated on December 14, 2022 by Yogesh Singh

Using jQuery UI sortable you can enable HTML element dragging on your page.

Initialize it on the element that you want to allow the users to reorder.

In this tutorial, I show how you can reorder images using jQuery UI and save them to the MySQL database in CodeIgniter 4.

Reorder images and save to MySQL database - CodeIgniter 4

Allow Only One Checkbox to be Checked using jQuery and JavaScript

Last updated on August 6, 2023 by Yogesh Singh

HTML checkboxes are commonly used to enable users to select multiple items from a list, while radio buttons are used for exclusive single selections.

However, there are instances where a checkbox is preferred over a radio button, even when only one option should be selected.

In this tutorial, I show how you can allow only one checkbox selection using jQuery and JavaScript.

Allow Only One Checkbox to be Checked using jQuery and JavaScript