Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 

  • IndexedDB

    @swati.kothiyal
    Recommendations Offline Message

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 338
    Comment on it

    The indexeddb is used to store the data in the browser. It is not a relational database and stores values in the form of key-pair.

    There are different methods used for performing different actions for a database like add(), get(), remove().

    1. window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
    2.  
    3. window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction;
    4. window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange
    5.  
    6. if (!window.indexedDB) {
    7.    window.alert("Your browser doesn't support a stable version of IndexedDB.")
    8. }

    Create database:

    1. const studentInfo = [
    2.    { id: "01", name: "Swati", age: 21, email: "swati@gmail.com" },
    3.    { id: "02", name: "Pooja", age: 20, email: "pooja@gmail.com" }
    4. ];

    Adding data to database:

    1. function add() {
    2.    var request = db.transaction(["student"], "readwrite")
    3.    .objectStore("student")
    4.    .add({ id: "02", name: "Pooja", age: 20, email: "pooja@gmail.com" });
    5.  
    6.    request.onsuccess = function(event) {
    7.       alert("added to your database.");
    8.    };
    9.  
    10.    request.onerror = function(event) {
    11.       alert("Unable to add data or already exist in your database! ");
    12.    }
    13. }

    Retrieve Data:

    1. function read() {
    2.    var transaction = db.transaction(["student"]);
    3.    var objectStore = transaction.objectStore("student");
    4.    var request = objectStore.get("00-03");
    5.  
    6.    request.onsuccess = function(event) {
    7.       if(request.result) {
    8.          alert("Name: " + request.result.name + ", Age: " + request.result.age + ", Email: " + request.result.email);
    9.       }
    10.  
    11.       else {
    12.          alert("not found database!");  
    13.       }
    14.    };
    15.  
    16.    request.onerror = function(event) {
    17.       alert("Unable to retrieve data!");
    18.    };
    19.  
    20. }

    Remove Data:

    1. function remove() {
    2.    var request = db.transaction(["student"], "readwrite")
    3.    .objectStore("student")
    4.    .delete("02");
    5.  
    6.    request.onsuccess = function(event) {
    7.       alert("Removed from database.");
    8.    };
    9. }
    HTML5 Javascript
    Comment on it

 0 Comment(s)

Sign In
Forgot Password?
                           OR                           
Create an account !!
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Reset Password
Fill out the form below and reset your password: