Category: Jquery

A tooltip is used to display quick information about the element and it is easy to add to the element using Bootstrap.

You can specify your text or HTML content using title option.

Within the tooltip, you can show content dynamically using jQuery AJAX. For this require defining an Anonymous function to handle AJAX request and get the content.

Dynamically load content on Bootstrap Tooltip with AJAX

AJAX Jquery PHP

Enable disable functionality gives the administrator more control on the site.

The administrator can directly control the users from its dashboard by either restrict access to some area of the site or enable disable the user.

This is very efficient when there are multiple types of the user exists on the site e.g. admin, student, professor, etc.

In this tutorial, I am using jQuery AJAX for this and creating an extra field on the MySQL table.

How to Restrict User Access on the Website with jQuery AJAX

AJAX Jquery PHP

By enabling the social login on the website it is easier for the user to easily register or sign in on the website without entering its details.

In this tutorial, I am adding LinkedIn Login on the webpage.

LinkedIn provides a very simple JavaScript API for developers to fetch the user details after successfully authorization and use it for registration or login.

How to Login LinkedIn with JavaScript API

How To Javascript Jquery PHP

Dynamically dependent dropdown commonly seen in the country, state, and city selection on the webpage. The data on the child element changes according to the value of the parent element.

The process follows the same way if there are more than 2 dropdown elements.

To do this you can either use only PHP or jQuery AJAX.

In this tutorial, I am using jQuery AJAX to make dynamic dependent dropdown.

Dynamic dependent dropdown in CodeIgniter with AJAX

AJAX Jquery PHP

Bootstrap Modal is a popup box which is customizable and responsive.

It can be used in many different ways – display login or registration form, terms and conditions, information, image etc.

In this tutorial, I am using AJAX to update user information on the Bootstrap Modal according to the requested data.

Dynamically load content in Bootstrap Modal with AJAX

AJAX Jquery PHP

Zip file creation is a better way to enable the user to download multiple files in one package. This may affect the page load time according to the number of files and their size.

Arises more problem when need to create multiple zip files on page load for download.

To avoid this type of problem you can either use only PHP or jQuery AJAX to create and download the zip file when it’s required.

In this tutorial, I am using jQuery AJAX.

Create and download zip file with AJAX

AJAX Jquery PHP

If you are allowing the user to delete the list of records and they are more in numbers then it will hard for the user to delete the specific record one by one and consumes more time.

To make it easier you can allow multiple selections of records and delete all selected list either with the only PHP or with jQuery and AJAX.

In this tutorial, I am using jQuery AJAX to remove records.

Delete multiple selected records with jQuery and AJAX

AJAX Jquery PHP

When uploading the image with Dropzone then it will create a thumbnail of it for preview but it will show a blank thumbnail while uploading the non-image file like – text, word, pdf files.

This will be handled by using the dropzone option where check the image type and define the new default thumbnail image.

How to change thumbnail for non-image file - Dropzone

Jquery

jQuery Nice Select is a lightweight jQuery plugin that is the simple replacement for the native select element.

This quickly adds styling on the select element. It works well on both mobile and desktop browsers.

There are not many options and methods are available in this plugin.

Customize the select element with jQuery Nice Select

Jquery

Select2 is a jQuery plugin which extends the functionality of simple HTML drop-down element by allowing to search the list, adding the image with options, navigate to option with arrow keys, etc.

It comes with the AJAX supports where you can call it in the same way as $.ajax in the jQuery.

The plugin provides the currently inputted value in the search box which can be used as data in the AJAX request.

Loading data remotely in Select2 with AJAX

AJAX Jquery PHP