Obejmuje to przykładowy kod z poprzedniego pytania "indeksydB Fuzzy Szukaj". Jak mogę związać wynik kursora do pola wprowadzania, aby utworzyć automatyczne kompletne efekt i wypełnić wiele skrzynek wprowadzania formularza z różnymi wartościami z obiektu ObjectStore, gdy wybrany jest wynik? Chciałbym to zrobić bez żadnych bibliotek.

Skrzynki wejściowe HTML.

 <input name="name" id="name"> //search by name, when a name is selected the last name and age are automatically attached to the other input boxes
 <input name="lastname" id="lastname">
 <input name="age" id="age">

Javascript.

var result = [];
db.transaction(['table'], IDBTransaction.READ_ONLY)
.objectStore('table')
.openCursor(
IDBKeyRange.bound(searchTerm, searchTerm + '\uffff'),
IDBCursor.PREV)
.onsuccess = function (e) {
    e || (e = event);
    var cursor = e.target.result;
    if (cursor) {
        result.push([cursor.value.column1, cursor.value.sortcolumn]);
        cursor.continue();
    } else {
        if (result.length) {
        result.sort(function (a, b) {
         return a[1] - b[2];
      });
    }

    // Process code here
    }
};
0
Ruben Teixeira 4 październik 2012, 18:10

2 odpowiedzi

Najlepsza odpowiedź

Cóż, w twoim przypadku możesz tylko chcieć, aby pierwsze rezultat, że zwrot kursora, więc wystarczy sprawdzić, czy został powrócony wynik, coś takiego:

<input name="name" id="name">
<input name="lastname" id="lastname">
<input name="age" id="age">
<script>
document.getElementById('name').oninput = function () {
  var searchTerm = this.value;

  var result = [];
  db.transaction(['table'], IDBTransaction.READ_ONLY)
    .objectStore('table')
    .openCursor(
      IDBKeyRange.bound(searchTerm, searchTerm + '\uffff'), // The important part
      IDBCursor.PREV)
    .onsuccess = function (e) {
      e || (e = event);
      var cursor = e.target.result;
      if (cursor) {
        // Here I assume that your table with 'lastname' and 'age'

        // Return result to "lastname" input
        document.getElementById('lastname').value = cursor.value.lastname;

        // Return result to "age" input
        document.getElementById('lastname').value = cursor.value.age;
      }
    };
}
</script>
1
Fong-Wan Chau 6 październik 2012, 23:34

OK, więc wiem, że jest złe formularz do publikowania linków tutaj jako odpowiedzi, ale zrobiłem artykuł na ten temat w HTML5Rocks. Jest zbyt długi, że mogę tu wyciąć i wkleić, ale myślę, że to dokładnie to, czego chcesz. http://www.html5rocks.com/en/tutors/indexeddb/uidatabinding/.

1
Raymond Camden 7 październik 2012, 01:46