Mobile Web Wearable Web

Indexed Database: Managing an Object Store

This tutorial demonstrates how you can create an indexed database and manage the data in it.

Warm-up

Become familiar with the Indexed Database API basics by learning about:

Creating a Database

Creating and deleting a database is a useful data management skill:

  1. Use the window.webkitIndexedDB.open() method to generate a database named TizenIndexedDB in order to create an object store for storage:

    <script>
       if (!window.webkitIndexedDB) 
       {
          window.alert("Does not support IndexedDB");
       } 
       else
       {
          var tizenDB = {}
          var request = window.webkitIndexedDB.open("TizenIndexedDB");
            
          request.onsuccess = function(e) {}
          request.onerror = function(e) {/* Error handling */}
       } 
    </script>
    

    Check whether an indexed database is supported in the window object. If the database is generated properly, the onsuccess event handler is called.

    Note
    The name of the database can be any string type, including an empty string. To change the version of the database, use the VERSION_CHANGE transaction.
  2. Delete the generated database using the window.webkitIndexedDB.deleteDatabase() method:

    <script>
       window.webkitIndexedDB.deleteDatabase('TizenIndexedDB')
    </script>
    

Source Code

For the complete source code related to this use case, see the following file:

Creating an Object Store

Creating and deleting an object store is a useful data management skill:

  1. To generate an object store for data storage, use the createObjectStore() method:

    <script>
       var tizenDB = {}
       var request = window.webkitIndexedDB.open("TizenIndexedDB");
       request.onupgradeneeded = function(e) 
       {  
          tizenDB.db = event.target.result; 
          try 
          {
             var objStore = tizenDB.db.createObjectStore("tizenStore", {keyPath: "key"});
          }
       };
    </script>
    

    The name and key path of an independent object are defined in the object store. The keyPath property makes the object store unique and must contain the key attribute to store data in the object store.

  2. To delete the object store, use the deleteObjectStore() method:

    <script>
       window.webkitIndexedDB.deleteObjectStore ('tizenStore')
    </script>
    

Source Code

For the complete source code related to this use case, see the following file:

Managing Data

Saving, accessing, and deleting data in an object store is a useful data management skill:

  1. Access the object store using the readwrite transaction and save data using the put() method:

    <script>
       objStore.transaction.oncomplete = function(e)
       {
          var trans = tizenDB.db.transaction("tizenStore", "readwrite");   
          var tizenStore = trans.objectStore("tizenStore");
          var data = 
          {
             "key": new Date().getTime(),
             "text": "Tizen-" + Math.random()
          };
    
          var request = tizenStore.put(data);
          request.onsuccess = function(e) 
          {
             tizenDB.db.objectStoreId = request.result;
             console.log(request.result);
          };
       } 
    </script>
    
  2. Request data in the tizenStore object store by calling data relevant to the key value in the storage with the get() method:

    <script>
       var request = tizenStore.put(data);
       request.onsuccess = function(e) 
       {
          tizenDB.db.objectStoreId = request.result;
          var data = tizenStore.get(tizenDB.db.objectStoreId);
       };
    </script>
    
  3. Delete the data in the object store using the delete() method:

    <script>
       var request = tizenStore.put(data);
       request.onsuccess = function(e) 
       {
          tizenDB.db.objectStoreId = request.result;      
          var data = tizenStore.delete(tizenDB.db.objectStoreId);
          data.onsuccess = function(e) 
          {
             console.log(data);
          }
       };
    </script>
    

Source Code

For the complete source code related to this use case, see the following file:

Creating an Index

Creating, accessing, and deleting an index is a useful data management skill:

  1. Create an index named tizen01 to search for stored data in records based on its property (text):

    <script>
       var objStore = tizenDB.db.createObjectStore("tizenStore", {keyPath: "key"});
       tizenDB.index = objStore.createIndex("tizen01", "text");
    
  2. Access the index using the objStore.index() method:

       var dbIndex = objStore.index("tizen01");
    
  3. Delete the index using the objStore.deleteIndex() method:

       tizenDB.index = objStore.deleteIndex("tizen01");
    </script>
    

Source Code

For the complete source code related to this use case, see the following file:

Go to top