2016-12-06 39 views
-1

你好我創建一個簡單的SQLite科爾多瓦應用程序,我安裝了sqlite的插件和應用下面的代碼越來越問題,而使用SQLite和科爾多瓦

<meta name="format-detection" content="telephone=no"> 
    <meta name="msapplication-tap-highlight" content="no"> 
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> 
    <link rel="stylesheet" type="text/css" href="css/index.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> 
    <script> 
    var createStatement = "CREATE TABLE IF NOT EXISTS Contacts (id INTEGER PRIMARY KEY AUTOINCREMENT, username TEXT, useremail TEXT)"; 

    var selectAllStatement = "SELECT * FROM Contacts"; 

    var insertStatement = "INSERT INTO Contacts (username, useremail) VALUES (?, ?)"; 

    var updateStatement = "UPDATE Contacts SET username = ?, useremail = ? WHERE id=?"; 

    var deleteStatement = "DELETE FROM Contacts WHERE id=?"; 

    var dropStatement = "DROP TABLE Contacts"; 

    var db = window.sqlitePlugin.openDatabase("AddressBook", "1.0", "Address Book", 200000); // Open SQLite Database 

    var dataset; 

    var DataType; 

    function initDatabase() // Function Call When Page is ready. 

    { 

     try { 

      if (!window.sqlitePlugin.openDatabase) // Check browser is supported SQLite or not. 

      { 

       alert('Databases are not supported in this browser.'); 

      } 

      else { 

       createTable(); // If supported then call Function for create table in SQLite 

      } 

     } 

     catch (e) { 

      if (e == 2) { 

       // Version number mismatch. 

       alert("Invalid database version."); 

      } else { 

       alert("Unknown error " + e + "."); 

      } 

      return; 

     } 

    } 

    function createTable() // Function for Create Table in SQLite. 

    { 

     db.transaction(function (tx) { tx.executeSql(createStatement, [], showRecords, onError); }); 

    } 

    function insertRecord() // Get value from Input and insert record . Function Call when Save/Submit Button Click.. 

    { 

     var usernametemp = $('input:text[id=username]').val(); 

     var useremailtemp = $('input:text[id=useremail]').val(); 
     db.transaction(function (tx) { tx.executeSql(insertStatement, [usernametemp, useremailtemp], loadAndReset, onError); }); 

     //tx.executeSql(SQL Query Statement,[ Parameters ] , Sucess Result Handler Function, Error Result Handler Function); 

    } 

    function deleteRecord(id) // Get id of record . Function Call when Delete Button Click.. 

    { 

     var iddelete = id.toString(); 

     db.transaction(function (tx) { tx.executeSql(deleteStatement, [id], showRecords, onError); alert("Delete Sucessfully"); }); 

     resetForm(); 

    } 

    function updateRecord() // Get id of record . Function Call when Delete Button Click.. 

    { 

     var usernameupdate = $('input:text[id=username]').val().toString(); 

     var useremailupdate = $('input:text[id=useremail]').val().toString(); 

     var useridupdate = $("#id").val(); 

     db.transaction(function (tx) { tx.executeSql(updateStatement, [usernameupdate, useremailupdate, Number(useridupdate)], loadAndReset, onError); }); 

    } 

    function dropTable() // Function Call when Drop Button Click.. Talbe will be dropped from database. 

    { 

     db.transaction(function (tx) { tx.executeSql(dropStatement, [], showRecords, onError); }); 

     resetForm(); 

     initDatabase(); 

    } 

    function loadRecord(i) // Function for display records which are retrived from database. 

    { 

     var item = dataset.item(i); 

     $("#username").val((item['username']).toString()); 

     $("#useremail").val((item['useremail']).toString()); 

     $("#id").val((item['id']).toString()); 

    } 

    function resetForm() // Function for reset form input values. 

    { 

     $("#username").val(""); 

     $("#useremail").val(""); 

     $("#id").val(""); 

    } 

    function loadAndReset() //Function for Load and Reset... 

    { 

     resetForm(); 

     showRecords() 

    } 

    function onError(tx, error) // Function for Hendeling Error... 

    { 

     alert(error.message); 

    } 

    function showRecords() // Function For Retrive data from Database Display records as list 

    { 

     $("#results").html('') 

     db.transaction(function (tx) { 

      tx.executeSql(selectAllStatement, [], function (tx, result) { 

       dataset = result.rows; 

       for (var i = 0, item = null; i < dataset.length; i++) { 

        item = dataset.item(i); 

        var linkeditdelete = '<li>' + item['username'] + ' , ' + item['useremail'] + ' ' + '<a href="#" onclick="loadRecord(' + i + ');">edit</a>' + ' ' + 

               '<a href="#" onclick="deleteRecord(' + item['id'] + ');">delete</a></li>'; 

        $("#results").append(linkeditdelete); 

       } 

      }); 

     }); 

    } 

    $(document).ready(function() // Call function when page is ready for load.. 

    { 
     ; 

     $("body").fadeIn(2000); // Fede In Effect when Page Load.. 

     initDatabase(); 

     $("#submitButton").click(insertRecord); // Register Event Listener when button click. 

     $("#btnUpdate").click(updateRecord); 

     $("#btnReset").click(resetForm); 

     $("#btnDrop").click(dropTable); 

    }); 

    </script> 

</head> 
<body> 

    <h1> 
     Form 
    </h1> 
    <form id="mycontact"> 
     <fieldset> 
      <legend> 
       Your details 
      </legend> 
      <ol> 
       <li> 
        <label for="username"> 
         Name 
        </label> 
        <input id="username" type="text" placeholder="First and last name" required autofocus pattern="" /> 
        <input type="hidden" id="id" /> 
       </li> 
       <li> 

        <label for="useremail">Email</label> 

        <input id="useremail" type="text" placeholder="[email protected]" required pattern="" /> 

       </li> 
      </ol> 
     </fieldset> 

     <input type="button" id="btnReset" value="Reset"/> 

     <input type="button" id="submitButton" value="Save"/> 

     <input id="btnUpdate" type="button" value="Update"/> 

     <input id="btnDrop" type="button" value="Drop"/> 

    </form> 
    <br /> 

    <div id="results"> 


    </div> 

    <script type="text/javascript" src="cordova.js"></script> 
    <script type="text/javascript" src="scripts/platformOverrides.js"></script> 
    <script type="text/javascript" src="scripts/index.js"></script> 
</body> 

創建一個CRUD操作但執行此代碼後,我在控制檯中出現錯誤爲「index.html:24未捕獲TypeError:無法讀取未定義的屬性'openDatabase',我真的很困惑我做錯了什麼,可以幫助我解決這個問題

回答

0

錯誤明確地告訴您在嘗試進行開放式數據庫調用時window.sqlitePlugin不存在。

首先,你應該確保你等到科爾多瓦已經試圖通過在科爾多瓦的deviceready事件wrappering您打開數據庫使用SQLite的插件之前完成加載:

var db = null; 

document.addEventListener('deviceready', function() { 
    db = window.sqlitePlugin.openDatabase({name: 'demo.db', location: 'default'}); 
}); 

這個例子就在頂部顯示插件的文檔: https://github.com/litehelpers/Cordova-sqlite-storage