Question

我正在尝试使用jQuery mobile创建一个简单的应用程序，它将数据存储到数据库中。目前应用程序不会更改页面，我已经尝试了一些没有运气的方法，有人可以看看。代码如下。

<script type="text/javascript">
document.addEventListener("deviceready" onDeviceReady, false);
var db;

function onDeviceReady()
{
db = window.openDatabase("test", "1.0", "test", 1000000);
db.transaction(createDB, errorhandler, dbready); 
}

function createDB(tx)
{
tx.executesql('CREATE TABLE IF NOT EXISTS demo(tittle, image, description)');
}  
function errorhandler(e)
{
console.log("There is an error in the SQL code: " + e.message);
}
function dbready()
{
console.log("dababase created");
}
function insertDB(tx)
{
var _tittle = $("[name='tittle']").val();
var _image = $("[name='description']").val();
var _description = $("[name='description']").val();
var sql = 'INSERT INTO demo(tittle, image, description) VALUES (?,?,?)';
tx.executesql(sql, [_tittle, _image, _description], checkQueryDB, errorhandler);
}

function checkQueryDB(tx)
{
console.log("query");
tx.executesql('SELECT * FROM demo',[], displayList, errorhandler);
}


function displayList(tx, result)
{
var htmlstring = '';
var len = results.rows.length;
for(var i=0; i<len; i++)
    {
    htmlstring += '<li>' + results.rows.item(i).tittle + results.rows.item(i).image + results.rows.item(i).description + '</li>';
    }
    $('#resultList').html(htmlstring);
    $('#resultList').listview('refresh');
    }

    function submitForm()
    {
    db.transaction(insertDB, errorhandler);
    //$.mobile.changePage($("#pagetwo"));
    //$("#pagetwo").pagecontainer ("change");
    $.mobile.pagecontainer.pagecontainer("change", "#pagetwo", { reverse: false, transition: "slide" } );            //$.mobile.changepage('#pagetwo', { reverse: false, transition: "slide" } );

    return false;
    }       

    </script>  


<div data-role= "page" id="pageone">
          <div data-role="header">
        <h1>welcome</h1>
          </div>
          <div data-role="main" class="ui-content">
        <form method="POST" onsubmit="return submitForm()" id="myForm" data-ajax="false">
          <label for="tittle" class="ui-hidden-accessible">Tittle</label>
          <input type="text" name="tittle" placeholder="Tittle"><br>

          <label for="image" class="ui-hidden-accessible">Image</label>
          <input type="text" name="image" placeholder="Image URI"><br>

          <input type="text" name="description" placeholder="description">
          <input type="submit" value="submit">
        </form>
          </div>

          <div data-role="footer">
        <h1>Footer Text</h1>
          </div>
        </div> 


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

          <div data-role="header">
            <h1>Database</h1>
          </div>

          <div data-role="main" class="ui-content">

            <div id="output">
            </div>            

            <ul data-role="listview"  id="resultList">
        </ul> 
          </div>

          <div data-role="footer">
        <h1>Footer Text</h1>
          </div>
        </div>

Answer 1

试试此解决方案。

var db = window.openDatabase('TabOrder', '', 'Bar Tab Orders', 2500000);
db.transaction(function(tx) {
  tx.executeSql('DROP TABLE IF EXISTS SubmiteData;', null, null, globalError);
  tx.executeSql('CREATE TABLE IF NOT EXISTS SubmiteData (SubmiteDataId integer primary key, UserId text, AuthNo number, LocId number,ProdId number, CardId number, OrgLat text,Lng text, OrgTime text)', null, 
    function() {
      SubmiteData("USER1",12345678,23434, 21212, 220232, "9", "45", "23/06/2014");
    },
    globalError);
});

function SubmiteData(UserId, AuthNo, LocId,ProdId, CardId, OrgLat, OrgLng, OrgTime){
  db.transaction(function(tx){
    tx.executeSql('INSERT INTO SubmiteData(UserId, AuthNo, LocId, ProdId, CardId, OrgLat, OrgLng, OrgTime) VALUES (?,?,?,?,?,?,?,?)', [UserId, AuthNo, LocId,ProdId, CardId, OrgLat, OrgLng, OrgTime], 
      null,
      globalError
    );
  });
}

function Wood(UserId, AuthNo, LocId,ProdId, CardId, OrgLat, OrgLng, OrgTime){
  db.transaction(function(tx) {
     tx.executeSql('SELECT * FROM SubmiteData',
             [],
             function(tx, results)
             { 
               for (var i=0; i<results.rows.length; i++) 
               {   
                 var row=results.rows.item(i);
                 // alert("Id: " + row['UserId']);
                 var stringout = "LocId: " + row['LocId'] + "\n"; 
                 alert(stringout); 
               } 
             },                
             globalError
     );
   });

};

$（（）的函数 { $（＆＃39;＃显示＆＃39;）。单击（伍德）; }）;

http://jsfiddle.net/WcV6Y/105/

phonegap jquery移动数据库

1 个答案: