Foros del Web » Programando para Internet » Javascript »

indexedDB con javascript

Estas en el tema de indexedDB con javascript en el foro de Javascript en Foros del Web. Buenas tardes. Estoy liado aprendiendo a utilizar indexedDB en un proyecto en javascript. Surfeando por internet encontré muchos manuales/tutoriales de como utilizarlo a groso modo. ...
  #1 (permalink)  
Antiguo 03/04/2014, 06:18
Avatar de zibor  
Fecha de Ingreso: diciembre-2006
Mensajes: 80
Antigüedad: 17 años, 4 meses
Puntos: 1
Pregunta indexedDB con javascript

Buenas tardes.
Estoy liado aprendiendo a utilizar indexedDB en un proyecto en javascript.

Surfeando por internet encontré muchos manuales/tutoriales de como utilizarlo a groso modo. Realicé un script el cual creaba o abría la "bd", añadía y mostraba los resultados. Funciones básicas, escritas secuencialmente sin interrupciones alguna, es decir al ejecutarse hacia todos esas acciones.

Código:
window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction;
window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;
if (!window.indexedDB) {
     window.alert("Tu navegador no soporta IndexedDB.");
}
var openRequest = indexedDB.open("pruebaBD",1);

openRequest.onupgradeneeded = function(e) { 
// cuando es necesario crear las tablas de la base de datos
    var thisDB = e.target.result;
    if(!thisDB.objectStoreNames.contains("documents")) {
            var os = thisDB.createObjectStore("documents", {keyPath: "id",autoIncrement:true}); // crear tabla
    }
};
 
openRequest.onsuccess = function(e) {
     // se ha creado con exito
    var db = e.target.result;
    var transaction = db.transaction(["documents"],"readwrite");
    var store = transaction.objectStore("documents");

    var docs = {
        title:"title",
        text:"text",
        date:new Date().getTime(),
        update:"update"
    };

    var request = store.add(docs);

    request.onerror = function(e) {
        console.log("add doc to Database error: ", e.target.errorCode);
    };

    request.onsuccess = function(e) {
        var transaction = db.transaction(["documents"],"readonly");
        var store = transaction.objectStore("documents");
        var request = store.openCursor();

        request.onsuccess = function(event) {
            // Esto es un hack para versiones antiguas de Firefox (older versions than 6)
            var cursor = request.result || event.result;
            // Cuando el cursor esté a nulo es que hemos terminado la enumeración, por lo que
            // actualizamos el DOM
            if (!cursor) {
              $("#c").html("<div></div>");
              return;
            }
            $("body").append("key: " + cursor.value.id + " => Todo text: " + cursor.value.text + "");
            console.log("<div>key: " + cursor.value.id + " => Todo text: " + cursor.value.text + "</div>");
            cursor.continue();
        };
    };
};	
 
openRequest.onerror = function(e) {
     // ha ocurrido algún error
    console.log("Database error: ", e.target.errorCode);
};
Evidentemente ese script es un ejemplo de prueba para quedarme con el funcionamiento.
Ahora la idea es modular mediante objetos. Cuando inicio el proyecto se ejecuta al principio la creación o apertura de indexeddb, hasta ahí todo correcto.

Código:
var database = {
    init : function(){
        window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
        window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction;
        window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;
        if (!window.indexedDB) {
             window.alert("Tu navegador no soporta IndexedDB.");
        }
        openRequest = indexedDB.open("BD1",1);

        openRequest.onupgradeneeded = function(e) { // cuando es necesario crear las tablas de la base de datos
            var thisDB = e.target.result;
            if(!thisDB.objectStoreNames.contains("documents")) {
                    var os = thisDB.createObjectStore("documents", {keyPath: "id",autoIncrement:true}); // crear tabla
            }
        };
    },
    addDoc : function(_title,_text,_date){
        openRequest.onsuccess = function(e) {
            // se ha creado con exito
           var db = e.target.result;
           var transaction = db.transaction(["documents"],"readwrite");
           var store = transaction.objectStore("documents");
           var objValues = {
                title : _title,
                content : _text,
                date : _date,
                update : "-"
           };

           var request = store.add(objValues);

           request.onerror = function(e) {
               console.log("add doc to Database error: ", e.target.errorCode);
           };

           request.onsuccess = function(e) {
               console.log("add ok");
           };
       };
       openRequest.onerror = function(e) {
             // ha ocurrido algún error
            console.log("Database error: ", e.target.errorCode);
        };
    }
};
database.init();
La idea es que con un formulario, el cliente rellene unos datos y cuando dichos datos estén listos, mandarlos "database.addDoc();".
Todos los datos son mandados correctamente desde el formulario, e incluso la conexión establecida con indexdb al crearla como variable global parece que también me lo manda correctamente.

El problema me surge al interpretar addDoc del objeto database, que entra en dicho apartado, pero no me ejecuta "request.onsuccess = function..." que es la primera linea. Antes de dicha linea he comprobado que los datos que se mandan son correctos.

Alguna idea de que hago mal? algún fallo de diseño?

Cualquier ayuda será bienvenida.
Gracias.
__________________
Picando código...!!!

Última edición por zibor; 03/04/2014 a las 07:01
  #2 (permalink)  
Antiguo 06/04/2014, 19:17
Avatar de Hugo_Euan  
Fecha de Ingreso: abril-2011
Ubicación: Mérida, Yucatán, México
Mensajes: 193
Antigüedad: 13 años
Puntos: 71
Respuesta: indexedDB con javascript

y me temo que así nunca te va a funcionar...

en el ejemplo que proporcionaste

var openRequest está definida como una variable global, por lo cual los procedimientos pueden acceder a ella sin ningun problema...

var openRequest = algo;

openRequest.propiedades;

en tu intento, ya no es válida esa estructura pues lo definiste dentro de un JSON

var database = {
init:function(){
var openRequest = algo;
},
addDoc:function(){
openRequest.propiedad; //no está definido para addDoc
}
}

de esta manera openRequest es una variable privada y por lo tal solo pertenece a database.init, pero no a database.addDoc;

Saludos !! espero haberme explicado y puedas corregir ese error
__________________
Se acepta Karma (:

Si Dios con nosotros, quien contra nosotros !!

Etiquetas: jquery
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 18:07.