HTML5 With DataBase
In this tutorial of HTML5 with DataBase, I will create DataBase at client side. We will also explore the storage of SqlLite with Google Chrome Tool.
Note: We will use JQuery to access HTML elements easily.
HTML5 Code Page: As you can see in above image I have create 4 different database named MotoRolaDataBase, AndroidDatabase, SOnyDataBase and HTMLDataBase. Let’s see HTML5 code first.
<html xmlns="http://www.w3.org/1999/xhtml" >
var database = openDatabase($("#Text1").val(), "1.0", "Contact Manager", 200000);
<span>Enter DataBase Name: <input id="Text1" type="text" /></span>
<input id="Button1" type="button" value="Create DataBase" /></span>
The first line of HTML5 code is <!DOCTYPE html>, this tells the browser to load HTML5 schema and page contains HTML5 elements.
var database = openDatabase("ContactManager", "1.0", "Contact Manager", 200000);
Above code snippets creates ContactManager at client browser. If it is created in Chrome browser, only chrome can access this database. Other browsers will not be able to access that database.
In my next post, we will see how to persist database and create tables. This is very light database known as SQLite.