如何在其回调范围之外获取indexedDb请求的结果 [英] How do I get the results of an indexedDb request outside the scope of its callback

问题描述

我有一个带有输入框的表单，我希望使用IndexedDb objectStore中的值自动完成，这适用于两个位置过高的输入框。我使用一个简单的数组工作得很好，但我想用它来处理来自objectStore的值。
为此，我必须在交易中提供可用的值，以便我可以在自动完成功能中循环它们。

I have a form with a input box that I want to auto-complete with values from a IndexedDb objectStore, this works with two over positioned input boxes. I works fine with a simple array but I want to put it to work with the values from a objectStore. For this I have to put the values available out of the transaction so I can loop through them in the auto-complete function.

1-我怎么能将事务中的结果导入到其余代码中可用的对象中？

1- How can I get the results out of the transaction into a object available in the rest of the code?

2-我的循环语法是否为results.value.name.length（ name是我的objectStore索引）来处理结果对象？

2- Is my loop syntax ok "results.value.name.length" (name is my objectStore index) to work with the resultant object?

通过游标获取IndexedDb对象：

Getting the IndexedDb objects through a cursor:

var results = [];

var openDbRequest = indexedDB.open(DB_NAME);

openDbRequest.onsuccess = function (e) {
    var db = e.target.result;
    var tran2 = db.transaction("store");
    tran2.objectStore("store").openCursor().onsuccess = function(e) {
        var cursor = e.target.result;
        if (cursor) {
            results = cursor;
            cursor.continue();  
        };
    };                                      
};

自动完成功能

var auto = "";
var auto_disp = "";

function getName(results) {
    var input = document.forms['myform'].name.value;
    var len = input.length;
    if (input.length) {
        for (i=0; i<results.value.name.length; i++){            
            if (results.value.name[i].substr(0,len).toLowerCase() == input.toLowerCase()){
                auto_disp = input + results.value.name[i].substr(len);
                auto = results.value.name[i];
                break;
            }
        }
    }
document.forms['myform'].auto_name.value = auto_disp;
}

function setName() {
 document.forms['myform'].name.value = auto;
 hideAuto();
}

function hideAuto() {
 document.forms['myform'].auto_name.value = "";
}

HTML表格：

<div style="position: absolute; top: 0; left: 0; width: 200px; z-index: 1;">
 <input type="text" name="name" style="background-color: #fff; border: 1px solid #999; width: 200px; padding: 2px" disabled />
</div>

<div style="position: absolute; top: 0; left: 0; width: 200px; z-index: 2;">
 <input autocomplete="off" type="text" name="auto_name" style="background: none; color:#39f; border: 1px solid #999; width: 200px; padding: 2px" onfocus="getName()"onkeyup="getName()" onkeydown="if (event.keyCode == 13) {setName();};"/>
</div>

更新：尝试了不同的链接，现在我得到了光标，但是循环有问题，我我没有得到自动完成。

UPDATE: Tried a different chaining, now I get the cursor but there's something wrong with the loop, I'm not getting the auto-completion.

openDbRequest.onsuccess = function (e) {
    var db = e.target.result;

    var tran2 = db.transaction("store");
    tran2.objectStore("store").openCursor().onsuccess = function(e) {

        var cursor = e.target.result;
        if (cursor) { 
            var input = document.forms['myform'].country.value; //the inputted value
            var len = input.length;
            if (input.length) {
                for (i=0; i<cursor.length; i++){            
                    if (cursor.value.nome[i].substr(0,len).toLowerCase() == input.toLowerCase()){
                        auto_disp = input + cursor.value.nome[i].substr(len);
                        auto = cursor.value.nome[i];
                        break;                              
                    }
                }   
            }
            document.forms['myform'].auto_name.value = auto_disp;
            cursor.continue();  
        }   
    };
};

推荐答案

如果要在事务范围之外使用它，只需将其添加到变量

If you want to use it outside the transaction scope, just add it to a variable

var results = [];
var openDbRequest = indexedDB.open(DB_NAME);
openDbRequest.onsuccess = function (e) {
    var db = e.target.result;
    var tran2 = db.transaction("store");
    tran2.objectStore("store").openCursor().onsuccess = function(e) {
         var cursor = e.target.result;
         if (cursor) {
              results.push(cursor.value) 
              cursor.continue();
         };
    };
}; 

在此之后，你遍历结果对象，一旦检索到所有数据，事务范围将关闭。

After this you van iterate over the results object, and the transaction scope will close once all data is retrieved.

这篇关于如何在其回调范围之外获取indexedDb请求的结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！