How to autocomplete data on multiple fields with jQuery and AJAX

You can use jQuery AJAX to autocomplete data on the single or multiple elements when the user search or select value from an element.

It is a better way to allow the users to easily search for data in existing records and get required information e.g. get student details by their id, product details, etc.

In the demonstration, I am using jQuery UI to display a suggestion list and fetch details using PHP from the MySQL database table when a value from the suggestion list gets selected.

How to autocomplete data on multiple fields with jQuery and AJAX

Read more

How to show Weather widget on the Website

There are many sites that offer free weather widget for the website. That are easy to embed.

You only need to specify some of the mandatory fields for generating the code.

In this tutorial, I show you some of the website from their you can get weather widget for your site.

How to show Weather widget on the Website

Read more

How to add !important to CSS property with jQuery

In CSS !important is used to increase the priority of a CSS property. This ignores the overriding properties.

In jQuery, you can use the css() method to manipulate style property of the selector but this doesn’t allow to set !important to property.

For example –

$('#txt').css('width', '100px !important');

The above code doesn’t work when you run it.

In this tutorial, I show how you can add !important to CSS property with jQuery.

How to add !important to CSS property with jQuery

Read more

How to make Pull Down to Refresh Webpage with jQuery

You have seen on many Mobile apps when you pull down from the top and release it the content is been refreshed.

The common example of this you see in Chrome, Opera mini browser for mobile.

In this tutorial, I show how you can add a similar type of functionality to your web page in desktop view.

I will create two examples,

  • Reload page when the user pulls down the button at the specified height.
  • Reload page when the user releases the button.

How to make Pull Down to Refresh Webpage with jQuery

Read more