PHP, MySQL, Ajax, Infinite Scroll with PhoneGap | Cordova

About PhoneGap:

Adobe PhoneGap is used to develop hybrid mobile applications. PhoneGap allows create app using web-development languages like HTML, CSS, and JQuery. You doesn’t require to have knowledge of mobile application languages like Java, Objective C, or Swift. PhoneGap extends the features of of HTML and JavaScript to work with the device.

Let’s start how to make simple infinite scroll application with MySQL database in phonegap.

Steps to follow:

  1. Create MySQL Database and Table
  2. Write PHP code on Server Side for handling request
  3. Write JQuery(Ajax) code on PhoneGap or Cordova side

Create MySQL Database and Table:

First, create MySQL database with table (user_details) with fields such as id, name, contact_number, address.

Connect to Database Server:

Display/Retrieve Data:

Get data from MySQL table with date filter and limit for enabling infinite scroll:

HTML code for PhoneGap / Apache Cordova Side:

Here we write simple HTML code with help of bootstrap classes.

First we showcase some filters elements then we listed data in list format:

Writing Jquery code for PhoneGap / Apache Cordova Side:

Using this code, on page load run Ajax to get data from MySQL table. For Infinite scroll when page scroll down same Ajax run again with incremented page number to get next set of data.

 

If you have any query or suggestion, So i’ll be happy to help you.

Thank you

  • Harpreet Singh

    what is app.getLeads();. not working

    • Rahul Dadhich

      Actually app.getLeads() is getData();
      I have update post. Thanks.