在sqlite数据库中存储表单

时间:2018-06-18 14:23:31

标签: javascript sqlite cordova cordova-plugins

我已经研究了很多,但没有为我的方案找到解决方案。我有一个简单的html / javascript应用程序,我使用cordova打包它。 html页面有一个表单,用于将表单发布到服务器。我想在应用程序离线或没有可用的互联网连接时将表单保存到sqlite数据库。 我是sqlite的新手,我没有找到任何兼容的数据类型来存储表单到数据库。如果我使用TEXT或BLOB,它只是存储" [Object HTMLFormObject]"串。

请检查我的js代码:



db = window.sqlitePlugin.openDatabase({
    name: 'ambdb',
    location: 'default'
}, function (db) {
    db.transaction(function (tx) {
        tx.executeSql('CREATE TABLE IF NOT EXISTS FORMS (form BLOB)');
    }, function (err) {
        alert('Open database ERROR: ' + JSON.stringify(err));
    });

});

function storeForms(formRecieved) {
    
    //alert(formRecieved.toString());
    //alert('text(): '+ formRecieved.text());
    //var jsonString = JSON.stringify(formRecieved);
    //var htmlText = escape(formRecieved.innerHTML);
    //var htmlText = formRecieved.innerHTML;
    //var simplyString = String(formRecieved);
    db.transaction(function (tx) {
        tx.executeSql('INSERT INTO FORMS (form) VALUES (?)', [formRecieved]);
    }, function (err) {
        alert('StoreForms ERROR: ' + JSON.stringify(err));
    });

}

function readForms(cb) {
    var submittedForms = [];
    db.transaction(function (tx) {
        tx.executeSql('SELECT form FROM FORMS', [], function (tx, results) {
            alert('total items: ' + results.rows.length);
            for (var i = 0; i < results.rows.length; i++) {
                var row = results.rows.item(i)['form'];
                //row = JSON.parse(row);
                /*var varstring = row.toString();
                alert('tostring: ' + varstring);
                var parser=new DOMParser();
                 var x = parser.parseFromString(varstring, "text/html");

                alert('x: '+ x);*/
        
                submittedForms.push(row);
            }
            cb.call(this, submittedForms);
        });

    });
}

document.addEventListener("online", function (e) {
        alert('I am online');
        isConnected = true;
        var promise1 = new Promise(function (resolve, reject) {
            readForms(function (forms) {
                resolve(forms);
            });
        }).then(function (submittedForms) {
            var numberOfRows = submittedForms.length;
            alert('submittedForms.length: ' + numberOfRows);
            if (numberOfRows > 0) {
                for (var i = 0; i < numberOfRows; i++) {
                    alert('Single row: '+ JSON.stringify(submittedForms[i]));
                    submittedForms[i].submit();
                }
                //deleteForms();
                return false;
            }

        })
    }, false);
&#13;
&#13;
&#13;

注释代码显示了我尝试序列化的可能方式 - 来回解析HTML对象只是为了将其存储在数据库中。 请指导我应该使用哪种列数据类型以及如何在代码中处理它。非常感谢!

1 个答案:

答案 0 :(得分:0)

我最终将HTMLFormObject转换为JSON对象。我将其另存为字符串在数据库中。从数据库中读取数据时,我正在将其解析回JSON对象。我将从这个JSON对象创建一个html表单。

function storeForms(formRecieved) {
    var elements = formRecieved.elements;
    var newForm = {};

    for (var i = 0; i < formRecieved.length; i++) {
        var elementName = elements[i].name;
        newForm[elementName] = elements[i].value;
    }

    var jsonString = JSON.stringify(newForm);

    db.transaction(function (tx) {
        tx.executeSql('INSERT INTO FORMS (form) VALUES (?)', [JSON.stringify(newForm)]);
    }, function (err) {
        alert('StoreForms ERROR: ' + JSON.stringify(err));
    });

}

function readForms(cb) {
    var submittedForms = [];
    db.transaction(function (tx) {
        tx.executeSql('SELECT form FROM FORMS', [], function (tx, results) {

            var row, formToSubmit, input, jsonRow = {};
            for (var i = 0; i < results.rows.length; i++) {
                row = results.rows.item(i)['form'];
                jsonRow = JSON.parse(row);
                formToSubmit = createFormToSubmit(jsonRow);
                submittedForms.push(formToSubmit);
            }
            cb.call(this, submittedForms);
        });

    });
}

function createFormToSubmit(jsonData) {
    var formToSubmit = document.createElement("form");
    var keys = Object.keys(jsonData);
    var fieldName, input;

    for (var i = 0; i < keys.length; i++) {
        fieldName = keys[i];
        input = document.createElement("input");
        input.type = "text";
        input.name = keys[i];
        input.value = jsonData[fieldName];
        formToSubmit.appendChild(input);
    }
    formToSubmit.setAttribute('method', "post");
    formToSubmit.setAttribute('action', "https:url");
    formToSubmit.setAttribute('target', "transFrame");
    return formToSubmit;

}