vendredi 22 janvier 2016

Trying to get list from database in jquery mobile

I have everything working but being able to see what is in the database when I press a button.

db scipts

document.addEventListener("deviceready", onDeviceReady, false);

        var db;

        function onDeviceReady() {
            db = window.openDatabase("Database", "1.0", "Cordova Demo", 2*1024*1024);
            db.transaction(createDB, errorCB, successCB);

        }

        function createDB(tx) {
            //tx.executeSql('DROP TABLE IF EXISTS DEMO');
            tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, full_name, email, bridal, bridesmaids, flowergirls, mens_hire, accessories)');

        }

        function errorCB(err) {
            alert("Error processing SQL: "+err.code);
        }

        function successCB() {
            alert("Database Created");
        }

        function insertDB(tx) {
            var _full_name = $("[name='full_name']").val();
            var _email = $("[name='email']").val();
            var _bridal = ($("[name='bridal']").is(':checked'))?'Yes':'No';
            var _bridesmaids = ($("[name='bridesmaids']").is(':checked'))?'Yes':'No';
            var _flowergirls = ($("[name='flowergirls']").is(':checked'))?'Yes':'No';
            var _mens_hire = ($("[name='mens_hire']").is(':checked'))?'Yes':'No';
            var _accessories = ($("[name='accessories']").is(':checked'))?'Yes':'No';
            var sql = 'INSERT INTO DEMO (full_name, email, bridal, bridesmaids, flowergirls, mens_hire, accessories) VALUES (?,?,?,?,?,?,?)';
            tx.executeSql(sql, [_full_name, _email, _bridal, _bridesmaids, _flowergirls, _mens_hire, _accessories], sucessQueryDB, errorCB);

        }

        function sucessQueryDB(tx) {     
            tx.executeSql('SELECT * FROM DEMO', [], renderList, errorCB);
        }

        function renderList(tx,results) {
            var htmlstring = '';

            var len = results.rows.length;

            for (var i=0; i<len; i++){
                htmlstring += '<li>FN:' + results.rows.item(i).full_name + ' ';
                htmlstring += '- E:' + results.rows.item(i).email + '</li>';
                htmlstring += '- B:' + results.rows.item(i).bridal + '</li>';
                htmlstring += '- BM:' + results.rows.item(i).bridesmaids + '</li>';
                htmlstring += '- F:' + results.rows.item(i).flowergirls + '</li>';
                htmlstring += '- MH:' + results.rows.item(i).mens_hire + '</li>';
                htmlstring += '- ACC:' + results.rows.item(i).accessories + '</li>';

            }

            $('#resultList').html(htmlstring);
            $('#resultList').listview('refresh');


        }

        function submitForm() {
            db.transaction(insertDB, errorCB);
            $.mobile.changePage( "#page2", { reverse: false, transition: "slide" } );
            return false;
        }

        function returnToForm() {
            $.mobile.changePage( "#page1", { reverse: false, transition: "slide" } );
            $.mobile.refresh()
            return false;
        }

        function enterDatabase() {
            // Want to get all data from database to show in page 3
            $.mobile.changePage( "#page3", { reverse: false, transition: "slide" } );
            return false;
        }

This is all working and I am getting success code 0, but I cannot figure out how I can use the function renderList() from the function enterDatabase().

I know that when it was ran from submitForm() and page 2 was able to display all the data it was fine, but I don't want to add data when trying to access the list.

Can anyone figure out how I can get it to process whats in the database where the //comment section is in enterDatabase please?

Thanks.

Aucun commentaire:

Enregistrer un commentaire