0

phonegap を使用してローカル データベースを作成しようとしています。しかし、プログラムを実行しようとすると、次のエラーが発生します。 : 5 at file:///android_asset/www/js/script.js:61 これは、データベースを作成するスクリプト コードであり、その後に index.html ファイルが続きます。ユーザーが入力するフォームを作成し、それをリストビューにリストしたい助けてくれてありがとう。

 function onLoad(){ 
        // Wait for PhoneGap to load
           document.addEventListener("deviceready", onDeviceReady, false);
           }


    // PhoneGap is ready
       function onDeviceReady() {
           var db = window.openDatabase("Database", "1.0", "Database", 200000);    
           var submitBtn = $("#submit");

           submitBtn.click(function(){
               db.transaction(populateDB, errorCB, successCB);
           });       
       }


       // Populate the database
       function populateDB(u) {
           var setNom = $("#nom");
           var setRace = $("#race");
           var setCouleur = $("#couleur");

           u.executeSql('DROP TABLE IF EXISTS ADOPTER');
           u.executeSql('CREATE TABLE IF NOT EXISTS ADOPTER (nom, race, couleur)');
           u.executeSql('INSERT INTO ADOPTER (nom, race, couleur) VALUES ("' + setNom.val() + '", "' + setRace.val() + '", "' + setCouleur.val() + '", "' + '")');
       }


       // Query the database
       function queryDB(u) {
           u.executeSql('SELECT * FROM ADOPTER', [], querySuccess, errorCB);
       }

       // Query the success callback
       function querySuccess(u, results) {
           var len = results.rows.length;
           console.log("ADOPTER table: " + len + " rows found.");
           for (var i=0; i<len; i++){
               var getNom = results.rows.item(i).nom;
               var getRace = results.rows.item(i).race;
               var getCouleur = results.rows.item(i).couleur;

               var nom = $(".nom");
               var race = $(".race");
               var couleur = $(".couleur");

               nom.replaceWith("<p>" + getNom + "</p>");
               race.replaceWith("<p>" + getRace + "</p>");
               couleur.replaceWith("<p>" + getCouleur + "</p>");

               console.log("Row = " + i + " NOM = " + results.rows.item(i).nom + " RACE =  " + results.rows.item(i).race + " COULEUR =  " + results.rows.item(i).couleur);
           }
       }

       // Transaction error callback
       function errorCB(err) {
           console.log("Error processing SQL: "+err.code);
       }

       // Transaction success callback
       function successCB() {
           var db = window.openDatabase("Database", "1.0", "Database", 200000);
           db.transaction(queryDB, errorCB);
       }




<!DOCTYPE html> 
<html>
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>Fido Finder</title>

    <link href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" rel="stylesheet" type= "text/css"/>

    <script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript">    </script>
    <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js" type="text/javascript"></script>

    <script src="cordova.js" type="text/javascript"></script>

    <script src="js/script.js" type="text/javascript" charset="utf-8"></script>

</head> 


<body onload="onLoad();"> 

<div data-role="page" id="page" >

    <div data-role="panel" id="navpanel" data-display="overlay" data-position="left">
        <div data-role="controlgroup" data-corners="false">
            <a href="#header_accueil" data-rel="close" data-role="button" data-icon="delete">Fermer le panneau</a>
            <a href="index.html" rel="external" data-role="button">Accueil</a>
            <a href="adopter.html" rel="external" data-role="button">adopter un chien</a>
            <a href="perdus.html" rel="external" data-role="button">chiens perdus</a>
            <a href="add_perdu.html" rel="external" data-role="button">Signaler chien perdu</a>
        </div>
    </div>

    <div id="header_perdus" data-role="header">
        <h1 id="titre">Nouveau chien à adopter</h1>
        <a id="bars-button" data-icon="bars" class="ui-btn-left" href="#navpanel">Menu</a>
    </div>

    <div data-role="content">   

        <form id="formulaire">
            <fieldset>
                <div data-role="fieldcontain">

                    <label>Nom du Chien:</label>
                    <input type="text" id="nom" /></br>

                     <label>Race:</label>
                     <input type="text" id="race" /></br>

                     <label>Couleur:</label>
                     <input type="text" id="couleur" /></br>

                      <a href="adopter.html" id="submit" data-role="button" onclick="">Soumettre</a>
                </div>
            </fieldset>
        </form>

    </div>

    <div data-role="footer" data-position="fixed">
        <div data-role="navbar">
            <ul>
                <li class="footer">Wilder Lanctôt 2013</li>
            </ul>
        </div>
    </div>

</div>

</body>
</html>
4

1 に答える 1