Adding a database to jquery mobile site

Question

I'm pretty new to using jquery and jquery mobile, but I was wondering if there was a simple way (or tutorial preferably) to tie a database (remote and local) to a jquery mobile site (preferably not using php).

Solution

You can use HTML5 localStorage via JavaScript, here is an explanation and some links to tutorials: http://www.html5rocks.com/en/features/storage

...there are now several technologies allowing the app to save data on the client device...

If you want to interact with your server then you're going to need to use a server-side scripting language. It's fairly easy to use AJAX to communicate with your server:

JS--

//run the following code whenever a new pseudo-page is created
$(document).delegate('[data-role="page"]', 'pagecreate', function () {

    //cache this page for later use (inside the AJAX function)
    var $this = $(this);

    //make an AJAX call to your PHP script
    $.getJSON('path_to/server/script.php', function (response) {

        //create a variable to hold the parsed output from the server
        var output = [];

        //if the PHP script returned a success
        if (response.status == 'success') {

            //iterate through the response rows
            for (var key in response.items) {

                 //add each response row to the output variable
                 output.push('<li>' + response.items[key] + '</li>');
            }

        //if the PHP script returned an error
        } else {

            //output an error message
            output.push('<li>No Data Found</li>');
        }

        //append the output to the `data-role="content"` div on this page as a listview and trigger the `create` event on its parent to style the listview
        $this.children('[data-role="content"]').append('<ul data-role="listview">' + output.join('') + '</ul>').trigger('create');
    });
});

PHP--

<?php

//include your database connection code
include_once('database-connection.php');

//query your MySQL server for whatever information you want
$query = mysql_query("SELCT * FROM fake_table WHERE fake_col='fake value'", $db) or trigger_error(mysql_error());

//create an output array
$output = array();

//if the MySQL query returned any results
if (mysql_affected_rows() > 0) {

    //iterate through the results of your query
    while ($row = mysql_fetch_assoc($query)) {

        //add the results of your query to the output variable
        $output[] = $row;
    }

    //send your output to the browser encoded in the JSON format
    echo json_encode(array('status' => 'success', 'items' => $output));
} else {

    //if no records were found in the database then output an error message encoded in the JSON format
    echo json_encode(array('status' => 'error', 'items' => $output));
}
?>

You can also send data to your PHP script and have it added to a database.

Here are some documentation pages for functions used above:

jQuery .getJSON(): http://api.jquery.com/jquery.getjson

PHP json_encode(): http://www.php.net/json_encode