Android的电话间隙，创建数据库，插入值，在表视图中检索它答案

【问题标题】：Phone-gap for Android,Create DataBase,insert Values,Retrive it in Table ViewAndroid的电话间隙，创建数据库，插入值，在表视图中检索它
【发布时间】：2012-09-28 12:30:13
【问题描述】：

我是 Android Phone-gap 的新手。我想创建一个数据库并插入值并在表格视图中显示这些值。请告诉我如何执行此操作

【问题讨论】：

标签： javascript jquery database cordova

【解决方案1】：

我建议通过Phonegap 提供的API documentation。有关数据库和本地存储的查询，请查看this。快乐的应用构建！

【讨论】：

【解决方案2】：

我把这件事做了如下：

这是我的javascript：

<script type="text/javascript">

            var firstNameBox=null;
            var lastNameBox=null;
            var=null;
            var dataTable=null; <!-- Called when phonegap javascript is loded -->

            function onDeviceReady()
            {
                var addButton = document.getElementById("add");
                firstNameBox = document.getElementById("firstName");
                lastNmaeBox = document.getElementById("lastName");
                dataTable = document.getElementById("data-table");

                db=Window.openDatabase("contactDB",1.0,"Contact Database,1000000"); <!--name,version,display name,size -->
                addButton.addEventListener("click",function(){
                    db..transaction(
                    <!-- SQL Statments -->
                    funnction(tx){
                        ensureTableExists(tx);
                        var firstName= firstNameBox.value;
                        var lastNameBox.value;

                        var sql='INSERT INTO Contacts(firstName,lastName) VALUES ("'+firstName+'","'+lastName+'")';
                        tx.executeSql(sql);
                    },
                    //error callback
                    function(err){
                        alert("error callback"+err.code);
                    },
                    //success callback
                    function(err){
                        loadFromDB();
                    });

                },false);
                loadFromDB();
            }

            loadFromDB();
            }

            function loadFromDB(){
                db.transaction(
                //function sql statements

                function(tx){
                    ensureTableExists(tx);
                    tx.executeExists('SELECT *FROM Contacts',[],function(tx,results){
                        var htmlStr="";
                        for(var index=0;index<results.rows.length;index++){
                            var item = result.rows.item(index);
                            htmlStr=htmlStr+"<tr><td>"+item.firstName+"</td><td>"+item.lastName+"</td><td><button onclick=\"deleteEntry('"+item.id+"');\">X</button></td></tr>";
                        }
                        dataTable.innerHTML=htmlStr;},function(err{
                            alert("Unable to fetch result from Contacts Table");
                        });
                },
                //error CallBack
                function(err){
                    alert("error callBack"+err.code+""+err.message);
                },
                //Success CallBack
                function(){
                    firstNameBox.value = "";
                    lastNameBox.value ="";
                });
                    }
                function deleteEntry(id){
                    db.transaction(
                    //function sql statements
                    function(tx){
                        ensureTableExists(tx);
                        tx.executeSql('Delete FROM Contacts where id'+id);
                    },
                    //eror callback
                    function(err){
                        alert("error callback"+err.code+" "+err.message);
                    },
                    //success callback
                    function(err){
                        loadFromDB();
                    });
                }   

                function ensureTableExists(tx){
                    tx.executeSql('CREATE TABLE IF NOT EXISTS Contacts(id INTEGER PRIMARY KEY,firstName,lastName)');
                }
                //Called when browers is loded
                function init(){
                    document.addEventListener("deviceready",onDeviceReady,false);
                }
        </script>

这是我的 HTML 正文：

<body onload="init()">

    <h3>Database Table View</h3>

    <table border="1">
    <tr> <td> <b>First Name</b> </td>
         <td> <b>Last Name</b> </td>
         <td> <b>Action</b> </td>  
    </tr>
    </table>

   <table id="data-table"></table>

   <table> <tr> <td> <input id="firstName" type="text"></input></td>
   <td><button id="add">Add</button></td></tr></table>
    </body>

【讨论】：