Connect HTML5 PhoneGap App to an online database

Question

I am looking to make an HTML 5 App which will be available on the apple and android store. (so it needs to be cross platform and for which I am using Phonegap)

My problem is the information displayed on the app will be updated regularly via some online database that will be edited online by myself not users. What is the best practice to connect to this database and what database would work best (note the information isn't private and can be openly available the information is used to populate lists and content on the app)

I have been looking into XML then JSON for the "database" and handlebars to insert the content, which I've gone off a bit..

Think of this as an HTML5 app that has to use js. The app itself is simple it's just classified lists (category, genre, list, item) and then a title:img:description of each item.

Any help, code or insight would be great. Thanks for your time!

> best practice to connect to this database... APIs. You can't (or shouldn't) directly access online database via phonegap, make an api that will do whatever you need it to do and perform requests to do certain actions on database, e.g. retrieve, update, delete data etc. I'm not sure if you're asking for what storage to use, but the easiest solution depends on server platform. Php works great with mysql, asp.net is great with T-SQL (MS-SQL), NodeJS with MongoDB, Ruby on Rails with Postgres etc. — Marko Gresak, Feb 15 '15 at 05:12

score 3 · Accepted Answer · edited May 23 '17 at 12:23

You can use any database of your choice on the server side. Suppose your database is on mysql then you can write some php script to retrieve the data. Next these php scripts should return some kind of JSON or XML response based on your choice. Lastly you can use ajax to call those php scripts and get those JSON / XML response inside your app and extract them.

Now there are many many ways. You should use in which you are comfortable with. So many database options so many scripting language options.

Search -> analyze -> try -> use

Get familiar with AJAX calls to server.

You will get some idea from this link

An example:

PHP script:

<?php
include("dbconfig.inc.php");
header("Content-type: text/xml");

echo "<?xml version=\"1.0\" ?>\n";
echo "<Loadinglist>\n";


    $select="Select * FROM tb_table";
    $dbh->query("SET NAMES utf8;");
    $dbh->query("SET CHARACTER_SET utf8;");


        foreach($dbh->query($select) as $row)
        {
            echo "<bangla>\n";

            $id=$row['id'];
            echo "\t<id>"."<![CDATA[".$id."]]>"."</id>\n";


            $category=$row['category'];
            echo "\t<category>"."<![CDATA[".$category."]]>"."</category>\n";


        }



echo "</Loadinglist>";
?>

Sample ajax call

jQuery.ajax({
                                  url: 'http://www.examplecom/myscript.php',  //load data 
                                  global: false,
                                  type: "POST",
                                  dataType: "xml",
                                  data: data,
                                  async: true,
                                  timeout: 40000,
                                  success: loading_complete_list,
                                  error: errorfunc
                            });

Search them, learn them, try them.

Thanks for you honest and helpful answer! can XML handle lots of information? @AtanuCSE — Benjamin, Feb 15 '15 at 08:36
XML response? yes it can. Though if you use it to load huge amount of data at once it might get slow. — AtanuCSE, Feb 15 '15 at 09:22

Connect HTML5 PhoneGap App to an online database

1 Answers1