从数据库动态显示选择菜单值?

时间:2014-03-31 10:57:02

标签: javascript jquery sqlite jquery-mobile

我是jquery的新手,如何从salite db动态插入选择菜单值?我可以选择值如何插入选择菜单?我需要插入"选择主题"选择框。可以通过onChange完成吗?任何人都可以帮助我。

Java脚本:

<script type="text/javascript" charset="utf-8">  
  document.addEventListener("deviceready", onDeviceReady, false);  
  function onDeviceReady() {             
    var db = window.sqlitePlugin.openDatabase({name: "MYDB"}); 
    db.transaction(function(tx) {
      tx.executeSql("select * from LOGS;", [], function(tx, res) {
        console.log("Row = " + i + ", subject= " + res.rows.item(i).subject ");
      });
    });  
  }  
</script>

HTML:

<div data-role="main" class="ui-content">
  <div data-role="fieldcontain">
    <label for="select-choice-1" class="select">Choose subject</label>
    <select name="select-choice-1" id="select-choice-1">
        <option value="standard">Select subject</option>

    </select>
    <label for="select-choice-2" class="select">Choose test</label>
    <select name="select-choice-2" id="select-choice-2">
        <option value="standard">Select Test</option>
    </select>
  </div>
</div>

enter image description here用户界面

3 个答案:

答案 0 :(得分:0)

您需要在使用之前声明onDeviceReady:)

function onDeviceReady() {             

    var db = window.sqlitePlugin.openDatabase({name: "MYDB"}); 

    db.transaction(function(tx) {

        tx.executeSql("select * from LOGS;", [], function(tx, res) {

            console.log("Row = " + i + ", subject= " + res.rows.item(i).subject ");
        });
    });  
} 

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

除此之外我不明白为什么它不起作用。请记住,deviceready是一个手机功能 - 如果你想在不同的环境中使用它,你可以考虑使用document onload。

答案 1 :(得分:0)

试试这样。我不确定你的想法。

db.transaction(function (tx) {
    tx.executeSql("select * from LOGS;", [], function (tx, res) {
        $("#select-choice-1").append($("<option/> ", {
            value: res.rows.item(i).subject,
            html: res.rows.item(i).subject
        }));
    });

答案 2 :(得分:0)

var db = window.sqlitePlugin.openDatabase({name: "MYDB"});
                                             db.transaction(function (tx) {
                                              tx.executeSql("select * from Locationlog;", [], function (tx, res) {
                                             for (var i = 0; i < res.rows.length; i++) {
                                               $("#select-choice-1").append('<option value='+res.rows.item(i).Category+'>'+res.rows.item(i).Category+'</option>');
                                                            }
                                               $("#select-choice-1").listview('refresh');
                                                          });
                                                   });

我附加了循环并刷新了列表视图。它对我有用