[英]Wrong order when using Javascript and SQLite
Dear Stackoverflow users, 尊敬的Stackoverflow用户,
The database we created is as follows: 我们创建的数据库如下:
function populateDB(tx) {
tx.executeSql('DROP TABLE IF EXISTS Gerechten');
tx.executeSql('CREATE TABLE IF NOT EXISTS Gerechten (id INTEGER PRIMARY KEY AUTOINCREMENT, Cat TEXT NOT NULL, Name TEXT NOT NULL, Desc TEXT NOT NULL)');
tx.executeSql('INSERT INTO Gerechten(Cat,Name,Desc) VALUES ("Voorgerecht", "Tomatensoep", "Heerlijke romige tomatensoep")');
tx.executeSql('INSERT INTO Gerechten(Cat,Name,Desc) VALUES ("Hoofdgerecht", "Pizza", "Kaas en tomaat")');
tx.executeSql('INSERT INTO Gerechten(Cat,Name,Desc) VALUES ("Voorgerecht", "Groentensoep", "Goed gevulde groentensoep")');
tx.executeSql('INSERT INTO Gerechten(Cat,Name,Desc) VALUES ("Voorgerecht", "Kippensoep", "Kippensoep met stukjes kip")');
tx.executeSql('INSERT INTO Gerechten(Cat,Name,Desc) VALUES ("Hoofdgerecht", "Biefstuk", "Biefstuk, wordt geserveerd met patat of rijst")');
}
I have a problem with a Javascript loop, the code is as follows: 我的Javascript循环有问题,代码如下:
function queryDB(tx){
tx.executeSql('SELECT DISTINCT "Cat" FROM Gerechten',[],function (tx, results) {
var len = results.rows.length, i;
msg = "<p>Found rows: " + len + "</p>";
document.write(msg + '<br/>');
for (i = 0; i < len; i++){
document.write(results.rows.item(i).Cat + '<br/>');
tx.executeSql('SELECT * FROM Gerechten WHERE "Cat" ="'+results.rows.item(i).Cat+'"',[],function (tx, results2) {
var len2 = results2.rows.length, y;
msg = "<p>Found rows: " + len2 + "</p>";
document.write(msg + '<br/>');
for (y = 0; y < len2; y++){
document.write(results2.rows.item(y).Name + '<br/>');
}
}, null);
}
}, null);
}
The problem with the code is that the Categories get outputted first after which the names are displayed (in the right order): 代码的问题在于,首先输出类别,然后按正确的顺序显示名称:
Voorgerecht
Hoofdgerecht
Tomatensoep
Groentensoep
Kippensoep
Pizza
Biefstuk
The right order should be: 正确的顺序应为:
Voorgerecht
Tomatensoep
Groentensoep
Kippensoep
Hoofdgerecht
Pizza
Biefstuk
Does anyone know how to solve this issue? 有谁知道如何解决这个问题?
Kind regards, 亲切的问候,
Dennis 丹尼斯
Your problem is that executeSql
executes your function (its last parameter) asynchronously, so your outer loop is likely to print all categories before the queries of the inner loop have finished executing. 您的问题是executeSql
异步执行您的函数(最后一个参数),因此外循环可能会在内循环的查询完成执行之前打印所有类别。
You should use only a single query so that you can process all results in the correct order. 您应该只使用一个查询,以便可以正确的顺序处理所有结果。 Try something like this: 尝试这样的事情:
SELECT * FROM Gerechten ORDER BY Cat
and print the category whenever the value in the Cat
column changes (see Jose's answer). 并在Cat
列中的值更改时打印类别(请参阅Jose的答案)。
You honestly don't need to be querying the database so many times, assuming this: 老实说,您无需多次查询数据库,前提是:
SELECT * FROM Gerechten 选择*从Gerechten
and your results contain the following, you could do as below and still produce the same results . 并且您的结果包含以下内容,则可以执行以下操作,并且仍然产生相同的结果 。 Obviously you will need to implement it to match your web sql database api, but the logic should remain the same. 显然,您将需要实现它以匹配您的Web sql数据库api,但是逻辑应保持不变。
var results = [
{
"Cat" : "Voorgerecht",
"Name" : "Tomatensoep",
"Desc" : "Heerlijke romige tomatensoep"
},{
"Cat" : "Hoofdgerecht",
"Name" : "Pizza",
"Desc" : "Kaas en tomaat"
},{
"Cat" : "Voorgerecht",
"Name" : "Groentensoep",
"Desc" : "Goed gevulde groentensoep"
},{
"Cat" : "Voorgerecht",
"Name" : "Kippensoep",
"Desc" : "Kippensoep met stukjes kip"
},{
"Cat" : "Hoofdgerecht",
"Name" : "Biefstuk",
"Desc" : "wordt geserveerd met patat of rijst"
}
];
//sorts by the Category
results.sort(compare);
var initial = "";
for(var y = 0; results.length; y++) {
if(initial != results[y].Cat){
initial = results[y].Cat;
document.write(initial + "<br/>");
}
document.write(" " + results[y].Name + "<br/>");
}
function compare(a,b) {
if (a.Cat < b.Cat)
return 1;
if (a.Cat > b.Cat)
return -1;
else
return 0;
}
OUTPUT 输出值
Voorgerecht
Tomatensoep
Groentensoep
Kippensoep
Hoofdgerecht
Pizza
Biefstuk
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.