Author: <span class="vcard">Yogesh Singh</span>

The Chosen jQuery plugin makes your HTML select element more user-friendly. It is available in both jQuery and Prototype flavor.

It can handle both single and multi-select options. Add a search box to filter the list of options.

There are various options available that allow us to customize the select element behavior.

Make user friendly select element with Chosen - jQuery

Jquery

The infinite page scroll you have seen on the social networking sites – Facebook, Twitter or on e-commerce websites where the new content is automatically loaded when scrolling down to the web page.

For implementing this functionality using jQuery to detect page scroll when the user reaches the end of the web page then send an AJAX request to load new content.

Load content on page scroll with jQuery and AJAX

AJAX Jquery PHP

Jquery

For upload file with AngularJS need to send the file by $http service and with the use PHP store the requested file to the server and return a response.

In the demonstration, I am creating two examples –

  • In the first, using JavaScript to select file,
  • And in the second, using custom directive

Then pass it as data in $http service for upload.

Upload file with AngularJS and PHP

AJAX AngularJS

You don’t need to require any other extra plugin for working with Zip files.

PHP has ZipArchive class that allow us to create a zip file or extract existing file.

ZipArchive class extractTo() method is used to extract the zip file that takes destination absolute path as argument.

Extract the Zip file with PHP

PHP

The main aim of jQuery Complexify plugin is to measure how complex is the user entered password and show the live feedback in the form of strength bars.

In this tutorial, I am using jQuery UI Progressbar widget to display the password strength according to the user input.

Password Strength checker with jQuery Complexify

Jquery

With only using AngularJS it is not possible to get data from MySQL database because it only handles Client side requests.

You have to use any Server side language at backend which handles the request and returns response.

In AngularJS $http service is use to send AJAX request.

How to get data from MySQL with AngularJS - PHP

AngularJS

You have seen on e-commerce websites for display the details view of a product. The part of the image will zoom according to mouse movement.

You can also implement this on your own website to provide better user experience.

In this tutorial, I am using ZooMove jQuery plugin for zoom functionality. It is easy to implement and customizable.

jQuery - Zoom images on mouse over with ZooMove

Jquery

Jquery

You can save your uploading images in the database table for later use e.g. display user profile or product image, create the image gallery, etc.

There are two ways of doing this –

  • Save path or name of an image
  • Encode image into base64 format

In this tutorial, I show you both of the methods for storing and retrieving an image from the database table.

Upload and store an image in the database with PHP

DataBase PHP