Tag Archives: developing web applications using jQTouch

Beginning Web Development for Smartphones : Developing Web Applications with PHP, MySQL ad jQTouch

Beginning Web Development for Smartphones : Developing Web Applications with PHP, MySQL ad jQTouch

If you’ve ever wanted to learn how to develop web applications for mobile devices, Beginning Web Development for Smartphones is for you! This book will lead you through all the code necessary for a sample bookstore application using PHP, MySQL, and jQTouch.

The book covers :

  • Building applications with jQTouch
  • Change themes, adding panels, displaying titles automatically, highlighting information
  • Getting user’s information through forms
  • Applying validity checks to input fields
  • Understanding navigation via panel and toolbar buttons
  • Introduction to PHP programming, AJAX technology, and MySQL commands
  • Accessing MySQL from PHP
  • Understanding client- and server-side databases
  • Creating client-side database tables
  • Inserting, fetching, and updating rows in server- and client-side databases
  • Querying server-side database tables
  • Understanding session management, localStorage, and sessionStorage

Available at :  http://www.amazon.com/Beginning-Web-Development-Smartphones-ebook/dp/B0042X9CHI/ref=sr_1_2?ie=UTF8&m=AH9CGK6QR37LL&s=digital-text&qid=1284780488&sr=8-2

Session Management

Session Management

No web application is complete without session management – a concept that helps track visitors to our web application.

HTTP is a stateless protocol, so the interaction between browsers and web servers is stateless. Each HTTP request a browser sends to a web server is independent of any other request. The stateless nature of HTTP allows users to browse the web by following hypertext links and visiting pages in any order. HTTP also allows applications to distribute or even replicate content across multiple servers to balance the load generated by a high number of requests.

Sometimes though, we need to remember specific data between web pages, for example, cart items, the user’s area of interest, login information, and so on. Otherwise, the user will be asked to enter the same information each time a web page is revisited.

What Is a Session And How Does It Start?

A session is a combination of a server-side file containing all the data we wish to store, and a client-side cookie containing a reference to the server data. The file and the client-side cookie are created using the PHP function session_start().

session_start()

This function initializes session data. It creates a session or resumes the current one based on the current session id. It has no parameters, but informs the server that sessions will be used.

Syntax

session_start()

When we call session_start(), PHP checks to see whether the user sent a session cookie. if the answer is yes, PHP loads the session data. Otherwise, PHP creates a new session file on the server, and sends an ID back to the user to associate the user with the new file. Because each user has unique data locked away in their personal session file, we need to call session_start() before trying to read session variables. We will soon see the role of session variables in passing data from one page to another.

session_id()

This function is used to get or set the session id for the current session.

Syntax

string session_id ([ string $id ] )

session_id() returns the session id for the current session, or the empty string (“”) if the session does not exists. If an id is specified, it will replace the current session id.

To make the concept clearer, have a look at the following code:

<?php

session_start();

$sessid=session_id();

$_SESSION['userid'] = $_POST['userid'];

$_SESSION['password'] = $_POST['password'];

?>

Here we see that first the session is started and the session id is stored in the $sessid variable . The session id will be used for tracking the user on different web pages of the same application. After that, we set the array elements of $_SESSION array. Data entered in the form’s userid and password input fields in the web page calling the PHP script is collected using $_POST array. The data is then sent to the $_SESSION array and stored in the $_SESSION[‘userid’] and $_SESSION[‘password’] elements.

On any other web page of the same web application, we can fetch the information stored in the $_SESSION array. The following code further illustrates the concept:

<?php

session_start();

$uid=$_SESSION['userid'];

$pwd=$_SESSION['password'];

?>

Here, after starting the session, the data stored in the $_SESSION[‘userid’] and $_SESSION[‘password’ elements of the $_SESSION array is retrieved and stored in the $uid and variables. These variables may be used in the current web page. This way, we can pass data across the web pages.

For more information, refer to my book: “Beginning Web Development for Smartphones: Developing Web Applications with PHP, MySQL and jQTouch” available at http://www.amazon.com/Beginning-Web-Development-Smartphones-ebook/dp/B0042X9CHI/ref=sr_1_2?ie=UTF8&m=AH9CGK6QR37LL&s=digital-text&qid=1284780488&sr=8-2

Application to Obtain User Information

Application to Obtain User Information

Let’s create a panel in our application that will ask the user to enter information such as user id, contact number, and email address. To add a form we need to do two things:

  • Add a panel to our application containing a form with text input fields
  • Add a list item with a hyperlink, so we can navigate to the newly added panel

Let’s add a panel containing a form to our application. The panel will be used for creating an account, so let’s assign it the id createacct. The code for the added panel is shown here:

<div>

<div>

<h1>create account</h1>

<a href=”#”>Cancel</a>

</div>

<form>

<ul>

<li><input placeholder=”Userid” /></li>

<li><input placeholder=”Contact No” /></li>

<li><input placeholder=”Email address” />

</li>

</ul>

<a href=”#”>create account</a>

</form>

<div>

In the above create account panel, we’ve used buttons with the class names button and cancel. The cancel buttons behave just like back buttons, except that they remove the current page from view using reverse animation. So, if we navigate to the create account panel with a slide up animation, when the cancel button is selected, we will navigate to the previous view via the slide down animation.

Because we have not specified any particular animation effects for hyperlinks, the default effect, slide in, is automatically applied to all page jumps. Thus, when the cancel button is tapped, we return to the home panel with the slide out effect. Remember that, unlike back buttons, cancel buttons are not left arrow icons.

In above code fragment, we have added a form and assigned it to the newuser id. The form contains an unordered list with three list items. Each list item contains a text field asking for information from the user. The input text fields are embedded inside the list items so that jQTouch’s apple theme (or jqt theme) can be used to style the form. We have used three attributes: type, id, and placeholder for the input text fields. The complete list of attributes usable with input text fields is shown in Table 1.

Table 1  Input Text Field Attributes

Attribute Usage
type Set to “text” to specify a single-line text entry field.
Placeholder A string displayed in an empty text field to inform the user about the information to be entered
Name Specifies the user name to apply to data when the form is submitted
Id Specifies a unique identifier for the text field
autocapitalize Turns off the default auto-capitalization feature of Mobile Safari.
autocorrect Turns off the default spell check feature of Mobile Safari.
autocomplete Turns off the autocomplete feature of Mobile Safari.

Three input text fields will now appear on the relevant page with placeholders that will be replaced by user input. At the end of the unordered list containing the input text fields, there’s a hyperlink of class whiteButton, which displays the button shown in Figure 1(b). This button contains the text create account.  We’ll soon learn how to initiate certain tasks when this button is selected by the user.

The code for the home panel is as shown under :

<div>

<div>

<h1>Book Store</h1>

</div>

<ul>

<li><a href=”#books”>Books</a></li>

<li><a href=”#contactus”>Contact Us</a></li>

<li><a href=”#createacct”>create account</a></li>

</ul>

</div>

Observe the third list item in the home panel which, when selected, will navigate us to the newly added create account panel. The list item will include a hyperlink pointing at the id of our create account panel: createacct .

Let’s run the application to see how it works now. When we run the program, we’ll see that the home panel now has three list items instead of two, as show in Figure 1(a). When we select the create account item, we will jump to the create account panel, as shown in Figure 1(b). Each text field (Userid, Contact No, and Email Address) contains placeholder text to help the user complete the field entries. Figure 1(c) shows the form after user information has been entered.

Figure 1 (a) Home panel with three list items  (b) Form with three input text fields  (c) Form with user’s information entered

For more information, refer to my book: “Beginning Web Development for Smartphones: Developing Web Applications with PHP, MySQL and jQTouch” available at  http://www.amazon.com/Beginning-Web-Development-Smartphones-ebook/dp/B0042X9CHI/ref=sr_1_2?ie=UTF8&m=AH9CGK6QR37LL&s=digital-text&qid=1284780488&sr=8-2

Implementing AJAX

We usually implement AJAX whenever we need to insert or fetch data from the server-side database tables, thus improving performance.

Let’s say we want to display detailed book information whose ISBN number has been entered by the user. This data is already stored in the books server-side database table.

We’ll need following things to fetch the data:

  • A function to invoke AJAX method
  • A server side PHP script

Invoking the AJAX Method

To implement AJAX, we need to invoke the ajax() method, and we will do so by creating a function called showdetails. The user-entered ISBN number is passed to showdetailsas a parameter. The code of showdetails is shown in Listing 1.

Listing 1. Invoking the ajax() Method

function showdetails(isbn)

{

$.ajax({

type:”POST”,

url:”getdetails.php”,

data: ‘isbn=’+isbn,

success:function(html){

$(‘#bookdetails’).append(html);

jQT.goTo(‘#bookdetailsdisplay’, ‘slide’);

}

});

return false;

}

The ajax() method loads a remote page via an HTTP request, and also creates and returns the XMLHttpRequest object required to talk to the server asynchronously. The ajax()method takes one argument, an object of key/value pairs, which are used to initialize and handle the request. The ajax() method syntax is :

.ajax( object of key/value pairs )

A brief description of key/value pairs frequently used in the ajax() method are shown in Table 1

Table 1. Key Value Pairs Used in the ajax() Method

Key Description
Type A string that defines the HTTP method we used for the request—GET  or POST. The default is GET.
url A string containing the URL of the server script file to which we want to send the request
Data A map or string we want sent to the server script along with the request. The script will then process the sent data.

To create the data map, we retrieve the user-entered information and assign it to variables in the following format:

data:’variable1=value1&variable2=value2…..’;

Here’s a snippet of how the data map is used:

var cat=$(‘.category’).val();

var subcat=$(‘.subcategory’).val();

data: ‘category=’+cat+’&subcategory=’+subcat,

We assume the Form on our web page contains two input fields, category andsubcategory. The information entered into the two fields is retrieved and stored in variables cat and subcat respectively. Thereafter, the data map is created by using these two variables

We can also assign all the variable=value pairs to a variable and then use it to make our data map, as shown below:

var data=’category=’+cat+’&subcategory=’+subcat;

data: data,

If this data variable exists, it’s is sent to the server to be assigned  to the specified script file, which performs its function and generates a response. We can skip the datavariable if we don’t want any information passed to the script.

success A callback function executed if the request sent to the script succeeds. The

returned response from the server script is assigned to this callback function’s parameter.

The steps involved in Listing 1 are as follows:

1.     The code in the showdetails function invokes the request via the ajax() method.

2.     In ajax(), we specify that the request method we will use is POST and the name of the server-side script file that will be executed is getdetails.php.

3.     We create a data string to be passed to the PHP script consisting of an isbn variable set to the value of the isbn passed to the function.

4.     The data string, in turn, passes the isbn number to the script file, getdetails.php.

5. This script fetches the corresponding ISBN information from the books table and generates the appropriate output. The success call back function will execute if the request passed to the script succeeds. The output of the script will be assigned to the  callback function’s html parameter.

6. The contents of the html parameter is then appended to the bookdetails div element for displaying result. We assume that there exists a div of id bookdetails nested inside the div of id bookdetailsdisplay.

7. The statement, jQT.goTo(‘#bookdetailsdisplay’, ‘slide’); navigates to the bookdetailsdisplay panel with a slide animation to display the response generated by thegetdetails.php script.

8. Finally, we return a value of false to the showdetails function to suppress the default browser click behavior. We explain this code in more detail below.

Let’s assume that showdetails is invoked by a click event on the button created here:

<a href=”#”> Show

Details</a>

A button, called Show Details, is created by assigning a whiteButton to the hyperlink. When clicked, this button invokes the showdetails function with a parameter ’11111-1111-1111′ that has been passed to it. We want to suppress the default browser click behavior, so, we return false from the showdetails function.

The Server side PHP Script

The server-side PHP script is the core of the fetch process. The script file getdetails.php reads the isbn number passed to it via data and will use this value to fetch the detailed book information  from the books table. The script will the generate output for display in the panel. The code of getdetails.php is shown in listing 2.

Listing 2. getdetails.php

<?php

$isbn =trim($_REQUEST['isbn']);

$connect=mysql_connect(“localhost”,”root”, “mce”) or die (“Please check your server

connection”);

mysql_select_db(“shopping”);

$query=”Select isbn, title, author1, author2, author3, publisher,

publish_date_edition, price, image, description from books where isbn =’$isbn’”;

$results =mysql_query($query) or die (mysql_query());

while ($row=mysql_fetch_array($results))

{

extract ($row);

echo ‘<fieldset style=”background-color:white; color:black;”>’;

echo ‘<img src=’ . $image .’>’;

echo ‘<h3>’ . $title . ‘ by </h3>’;

echo ‘<h4>’ . $author1 . ‘</h4>’;

if($author2 !=’NULL’)

echo ‘<h4>’ . $author2 . ‘</h4>’;

if($author3 !=’NULL’)

echo ‘<h4>’ . $author3 . ‘</h4>’;

echo ‘<label>Publisher :</label><h4>’ . $publisher . ‘</h4>’;

echo ‘<h4>’ . $publish_date_edition . ‘</h4>’;

echo ‘<label>Price: </label>’;

echo ‘<em>’ . $price . ‘</em><br/>’;

echo ‘<label>Book Details :</label><h4>’ . $description . ‘</h4>’;

echo ‘</fieldset>’;

}

?>

We can see that the above code of the script does the following:

  • Retrieves the value of isbn from the $_POST array and stores it in variable $isbn.
  • Establishes a connection to the MySQL server using root as the user and mce as the password.
  • Selects the shopping database to make it active.
  • Writes a query to fetch the information for the book having the supplied ISBN number.
  • Executes the query and receives the result in a $result array.
  • Retrieves a row from $result and stores it into a $row variable.
  • Extracts the $row containing the retrieved row fields.
  • Displays the information in the $row’s fields in a fieldset.

Remember that the detailed information displayed by this PHP script  will be returned to the success callback function’s html parameter (see Listing 1). The detailed book information assigned to the html parameter is then appended to the bookdetails div element for display.

For more information, refer to my book: “Beginning Web Development for Smartphones: Developing Web Applications with PHP, MySQL and jQTouch” available at http://www.amazon.com/Beginning-Web-Development-Smartphones-ebook/dp/B0042X9CHI/ref=sr_1_2?ie=UTF8&m=AH9CGK6QR37LL&s=digital-text&qid=1284780488&sr=8-2

Forward Navigation Via Toolbar Buttons

Forward Navigation Via Toolbar Buttons

In this example, we will learn to use the toolbar buttons for forward navigation. To understand how it is done, let’s create a small application with six panels: Home, Categories, Subcategories, Select Books, Items in Cart and Checking Out. Let’s assume that the ids assigned to the six panels are home, bookscategories, subcategories, booksdisplay, showcart, and checkout respectively. The purpose of each panels is as follows :

1.     Home—The first panel (idhome) that appears on execution of application (see Figure 1.1 (a)).

2.     Categories—This panel (id bookscategories) displays book categories when the Books list item is selected from the Home panel (see Figure 1.1(b))

3.     Subcategories—This panel (id subcategories) displays book subcategories when a book category is selected from the Categories panel (see Figure 1.1(c)).

4.     Select Books—This panel (id booksdisplay) displays the books belonging to the selected category and subcategory.  The panel appears when a subcategory fromSubcategories panel is selected. From this panel, the user can select books to be added to the cart (see Figure 1.2 (a)).

Note: The list items that appear in Categories, Subcategories, and the Select Books panels are hard-coded and are just dummies for the time being.

5.     Items in Cart—This panel (id showcart) displays the books in the cart. For the time being, only dummy books selected will be in the cart. This panel has a Checkout button, which jumps to the Checking Out panel (see Figure 1.2 (b)).

Note: For now, cart contents are hard-coded.

6.     Checking Out—This is the last panel of the checkout process only has a Back button for returning to the previous screen (see Figure 1.2 (c)).

Figure 1.1. (a) Home panel with Show Cart button (b)  Categories panel showing book categories (c) Subcategories panel showing book subcategories

Figure 1.2. (a) Select Books panel showing books in the selected category and subcategory (b)  Items in the Cart panel, and the Back and Checkout buttons   (c) Checking Out panel

We can create the Back buttons in all the screen panels by adding hyperlinks to the toolbars with the class name back. These href hyperlinks all point to #, which simply jumps to the first previous page in the in page history.

The only problem we face is making the two Show Cart and Checkout buttons work. But before we can deal with actual functionality, we first have to learn how to put buttons on the right side of the toolbar.

The back and cancel buttons appear on the left side of the toolbar. Only buttons with the button class name appear on the right side. To make the button jump to a panel with a specific id, we need to set the button href to point to it. You might think, at this point, that the code for a right-side button that navigates to the showcart id would look like this:

<a href=”#showcart”>Show Cart</a>

Although the code appears to be correct, it won’t actually do what we want it to, because no animation has been specified in the hyperlink. The default slide animation won’t work with this code fragment. It’s a simple matter, though, to specify any of the other animation effects that will work: slideup, dissolve, fade, flip, pop, swap, and cube.

Functional code for the showcart id, using the slideup animation is:

<a href=”#showcart”>Show Cart</a>

Similarly, the following fragment creates a Checkout button on the right side of the toolbar that jumps to the checkout panel with a flip animation:

<a href=”#checkout”>Checkout</a>

The complete code is shown in Listing 1.1.

Listing 1.1. Forward and Reverse Navigation

<html>

<head>

<title>Book Store</title>

<link rel=”stylesheet” media=”screen” href=”jqtouch/jqtouch.css”>

<link rel=”stylesheet” media=”screen”

href=”themes/apple/theme.css”>

<script src=”jqtouch/jquery.1.3.2.min.js”></script>

<script src=”jqtouch/jqtouch.js”></script>

<script>

var jQT = new $.jQTouch();

</script>

</head>

<body>

<div>

<div>

<h1>Home</h1>

<a href=”#showcart”>Show Cart</a>

</div>

<ul>

<li><a href=”#bookscategories”>Books</a></li>

</ul>

</div>

<div>

<div>

<a  href=”#”>Home</a>

<h1>Categories</h1>

</div>

<ul>

<li><a  href=”#subcategories”>Literature & Fiction</a></li>

<li><a  href=”#subcategories”>Home & Garden</a></li>

<li><a  href=”#subcategories”>Computers & Internet</a></li>

<li><a  href=”#subcategories”>Cooking, Food & Wine</a></li>

</ul>

</div>

<div>

<div>

<a  href=”#”>Back</a>

<h1>Subcategories</h1>

</div>

<ul>

<li><a href=”#booksdisplay”>Subcategory1</a></li>

<li><a href=”#booksdisplay”>Subcategory2</a></li>

<li><a href=”#booksdisplay”>Subcategory3</a></li>

</ul>

</div>

<div>

<div>

<a  href=”#” >Back</a>

<h1>Select Books</h1>

</div>

<ul>

<li><a href=”#showcart”>Book 1</a></li>

<li><a href=”#showcart”>Book 2</a></li>

<li><a href=”#showcart”>Book 3</a></li>

<li><a href=”#showcart”>Book 3</a></li>

</ul>

</div>

<div>

<div>

<a  class=”back” href=”#” >Back</a>

<a href=”#checkout”>Checkout</a>

<h1>Items in Cart</h1>

</div>

<p> Book1 by author xyz </p>

<p> Book2 by author pqr </p>

</div>

<div>

<div>

<a  class=”back” href=”#”>Back</a>

<h1>Checking Out</h1>

</div>

<p> You have not Signed Up yet </p>

</div>

</body>

</html>

Note: Buttons of class back or cancel may only appear on the left side of a toolbatr. Only buttons of class button may appear on the right.

For more information, refer to my book: “Beginning Web Development for Smartphones: Developing Web Applications with PHP, MySQL and jQTouch” available at http://www.amazon.com/Beginning-Web-Development-Smartphones-ebook/dp/B0042X9CHI/ref=sr_1_2?ie=UTF8&m=AH9CGK6QR37LL&s=digital-text&qid=1284780488&sr=8-2

Creating a Client-Side Database and Tables

Creating a Client-Side Database and Tables

In this example, we’ll be using a JavaScript database API for creating  the client-side database. This API provides a simple method of storing, retrieving, and marinating user-supplied information. In addition, it provides a relational database model, and so can easily handle complex data. We can use standard SQL statements to perform all database-related tasks, such as creating databases and tables, as well as inserting, fetching, deleting, and updating rows in the tables.

Let’s start off by creating and opening a database. The code for creating and opening the client-side database is shown below:

var datab;

var shortName = ‘tmpCart’;

var version = ’1.0′;

var displayName = ‘tmpCart’;

var maxSize = 200000;

datab = openDatabase(shortName, version, displayName, maxSize);

The usage of the variables used in the code fragment is shown Table 1.

Table 1. Client-Side Database Variables

Variable Usage
datab Used to hold the reference to the database connection when it is established.
shortName Stores the name of the database we will be creating on the client side.
version Stores the version number assigned to the database. The version number is often needed for upgrades or changes to the database.
displayName Stores the database name available to the user.
maxSize Stores the expected size of our database in kilobytes. Should the size exceed the limit in this variable, we will be notified and asked if the increase should be allowed or denied.

The variable values defined in our code fragment say that we want to create a client-side database named tmpCart with a version number of 1.0 and a size limit of 200000 KB. After assigning these variable values. We can pass them to the openDatabase command, which actually creates the tmpCart database and stores the connection in databvariable.

The code fragment can also be written as:

datab = openDatabase(‘tmpCart’,  ’1.0′, ‘tmpCart’, 200000);

That is, we can directly specify the parameter values in the openDatabase function without using variables at all.

Now that we’ve  created and opened a server-side database, let’s create a table in it.

Creating Client-Side Tables

In this example, we’ll be using the client-side database for storing cart information. Let’s first create a table called shopcart in our client-side database tmpCart, as shown in this code fragment:

datab.transaction(

function(transaction) {

transaction.executeSql(

‘CREATE TABLE  IF NOT EXISTS shopcart ‘ +

‘ (id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, ‘ +

‘ cart_sess varchar(50), cart_isbn varchar(30),  cart_item_name

varchar(100), cart_qty integer, cart_price float );’

);

}

);

The JavaScript database API supports SQL transactions and all database queries must take place in the context of a transaction. To execute a standard SQL query, we need to call the executeSql method of the transaction object. To do this, we call the transaction method of the datab object and pass it a anonymous function. We then pass the transaction to the anonymous function so that we can call executeSql method of the transaction object.

The executeSql method creates a table called shopcart if it doesn’t already exidst. The table has four fields: id, cart_sess, cart_ISBN, cart_item_name, cart_qty and cart_price. Theid field is the primary key. It’s value cannot be null and is unique for each row of the table. We set this field to AUTOINCREMENT, so its value will increase by 1 for each table row added.

Inserting Rows in Client-Side Tables

Let’s assume that a user has dropped a book in the cart, so we now have some cart data to process—session id, ISBN, title, quantity, and price. This data is stored in the variablessid, ISBN, title, qty, and price respectively. We’ll transfer this data to a row in the client-side shopcart table, as shown in the following code fragment.

datab.transaction(

function(transaction) {

transaction.executeSql(

‘INSERT INTO shopcart (cart_sess, cart_isbn,  cart_item_name, cart_qty,

cart_price) VALUES (?,?,?,?,?);’,

[sid, isbn, title, qty, price],

function(){

},

displayerrormessage

);

}

);

Note: Session id is used for session management—a mechanism used for tracking users visiting our web application. The Server generates a unique id for the current session.

First we use the executeSql method of the transaction object to execute a SQL query. We need to pass the data for five fields, or columns, to this method. The five question marks (?) in the VALUES parentheses are placeholders and take on the values in the array [sid, ISBN, title, qty, price]. The first question mark is replaced by the value in the sid variable, the second question mark is replaced by the ISBN value, and so on.

The array of values is followed by an anonymous function called the data callback function, which may contain statements to execute after successful execution of the SQL statement. For example, data callback may contain calls to other functions that display a confirmation message or navigate to an other panel. If we don’t want any action to take place after the successful execution of the SQL statement, we can leave this function empty, as we have actually done in the code fragment.

The last part of the fragment, displayerrormessage, is a call to the error handling function we want to evoke if the SQL statement fails. Here is an example of displayerrormessageusage:

function displayerrormessage(transaction, error) {

alert(‘Error:  ’+error.message+’ has occurred with Code: ‘+error.code);

return true;

}

Two parameters are passed to the displayerrormessage function: the transaction object and the error object. The error object displays the error message and the error code. The reason for passing transaction object to the displayerrormessage function is to allow more SQL statements to be executed from within the function, if desired. Thedisplayerrormessage function may return true to halt the execution and roll back the entire transaction, or false, in which case the transaction will continue.

Error Codes

Table2 contains a quick look at the common error codes generated while executing a transaction on client-side database tables.

Table 2  Error Codes and Occurrence

Error Code Occurs When
0 The transaction failed for other non-database-related error.
1 The transaction failed for other database-related error.
2 The transaction failed because the version of the database didn’t match the one user requested.
3 The transaction failed because the data returned from the database was too large.
4 The transaction failed because either there was not enough storage space left or the user didn’t wanted the database to grow beyond the existing limit.
5 The transaction failed because the transaction included a syntax error, number of parameters mismatch, statement modifying the database in a read-only transaction, and so on.
6 The transaction failed because of constraint failure, for example, assigning two rows the same value in the primary field.

If we aren’t interested in capturing errors, we can omit both data callback and error handling callback functions. If we do that, the code fragment will appear as follows:

datab.transaction(

function(transaction) {

transaction.executeSql(

‘INSERT INTO shopcart (cart_sess, cart_isbn,  cart_item_name, cart_qty,

cart_price) VALUES (?,?,?,?,?);’,

[sid, isbn, title, qty, price]

);

}

);

For more information refer to my book: “Beginning Web Development for Smartphones: Developing Web Applications with PHP, MySQL and jQTouch” available at http://www.amazon.com/Beginning-Web-Development-Smartphones-ebook/dp/B0042X9CHI/ref=sr_1_2?ie=UTF8&m=AH9CGK6QR37LL&s=digital-text&qid=1284780488&sr=8-2