Category: AngularJS

In infinite page scroll pagination data load dynamically and append at the end of existing content when the user reaches to the bottom while scrolling.

The user doesn’t have to click any button.

I am using ngInfiniteScroll directive for implementing with AngularJS.

With this directive detect page scroll and send AJAX request to get content.

Also, need to include the jQuery library for using it.

In this tutorial, I show how you can load content on page scroll using the ngInfiniteScroll directive in AngularJS.

Load content on Page scroll with AngularJS and PHP

AJAX AngularJS DataBase PHP

By creating dynamic dependent dropdown the user is restricted to select an item to view data on another dropdown element.

Based on each selection data is changed in the dropdown.

The common example of this – country and state element in the form. According to the selected country state is been auto-populated.

I am using $http service in AngularJS to send a request to fetch records from MySQL database with PHP.

In the demonstration, I am creating two dropdowns – state and users. According to the state selected from the first dropdown auto-populate users list in the second dropdown.

How to Auto-populate Dropdown with AngularJS and PHP

AJAX AngularJS How To PHP

If there is the registration form on the website then you need to make sure that the username or email must be unique.

The user will login with the selected username next time when it comes to the website.

You can either check it after submitting the form or while entering it.

In the demonstration, I am creating a simple registration form in CodeIgniter where check the entered username with Angular and insert the record if the username is available.

Live username availability check with AngularJS in CodeIgniter

AngularJS CodeIgniter DataBase PHP

AngularJS CodeIgniter How To PHP

AJAX AngularJS PHP

With ngClass directive, it is easier to maintain CSS classes between HTML elements dynamically.

You cannot just pass the class name in ng-class like class attribute.

You need to either use the $scope variable or expression for including classes on the element.

In this tutorial, I am creating a demonstration to add remove class from the element.

Add remove Class with ngClass in AngularJS

AngularJS

In AngularJS with the model, it is easier to maintain values across elements and to define the model ng-model directive is been used.

To find checkbox is been checked or not check the defined model. If it is TRUE means checkbox is been checked.

In this tutorial, I will show how you can retrieve single or multiple checked checkboxes.

Check if Checkbox is Checked or Not with AngularJS

AngularJS