1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
|
---
title: IDBIndex.openCursor()
slug: Web/API/IDBIndex/openCursor
tags:
- API
- IDBIndex
- IndexedDB
- Méthode
- Reference
- openCursor
translation_of: Web/API/IDBIndex/openCursor
---
<div>{{APIRef("IndexedDB")}}</div>
<p>La méthode <strong><code>openCursor()</code></strong> de l'interface {{domxref("IDBIndex")}} renvoie un objet {{domxref("IDBRequest")}} et, dans un <em>thread</em> séparé, crée <a href="/fr/docs/Web/API/IDBCursor">un curseur</a> sur l'intervalle de clé fourni en argument.</p>
<p>La méthode la positionne le curseur de façon approprié, selon la direction indiquée :</p>
<ul>
<li>Si aucun intervalle de clé n'est spécifié ou qu'il vaut {{jsxref("null")}}, l'intervalle résultant contiendra l'ensemble des enregistrements</li>
<li>L'évènement <code>success</code> est toujours déclenché :
<ul>
<li>Si un enregistrement est trouvé la propriété <code>result</code> de l'évènement contient le nouvel objet {{domxref("IDBCursor")}} et la valeur (<code>value</code>) de ce curseur est un clône de la valeur référencée</li>
<li>Si aucun enregistrement n'est trouvé la propriété <code>result</code> de l'évènement vaudra <code>null</code>.</li>
</ul>
</li>
</ul>
<p>{{AvailableInWorkers}}</p>
<h2 id="Syntaxe">Syntaxe</h2>
<pre class="syntaxbox">var request = myIndex.openCursor(keyRange,direction);</pre>
<h3 id="Paramètres">Paramètres</h3>
<dl>
<dt><code>keyRange</code> {{optional_inline}}</dt>
<dd>L'intervalle de clé ({{domxref("IDBKeyRange")}}) sur lequel se déplace le curseur. Si aucun argument n'est passé, la valeur par défaut sera un intervalle qui englobe tous les enregistrements du magasin d'objets.</dd>
<dt><code>direction</code> {{optional_inline}}</dt>
<dd>La direction dans laquelle se déplace le curseur (la propriété <code>direction</code> de l'objet {{domxref("IDBCursor.direction")}}). La valeur par défaut est <code>"next"</code>.</dd>
</dl>
<h3 id="Valeur_de_retour">Valeur de retour</h3>
<p>Un objet {{domxref("IDBRequest")}} sur lequel les évènements associés à l'opération seront déclenchés.</p>
<h3 id="Exceptions">Exceptions</h3>
<p>Cette méthode peut déclencher une {{domxref("DOMException")}} dont le type peut être l'un des suivant :</p>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Type d'exception</th>
<th scope="col">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>TransactionInactiveError</td>
<td>La transaction pour cet index est inactive.</td>
</tr>
<tr>
<td><code>TypeError</code></td>
<td>La valeur du paramètre pour la direction est invalide.</td>
</tr>
<tr>
<td>DataError</td>
<td>
<p>La clé ou l'intervalle de clé fourni contient une clé invalide.</p>
</td>
</tr>
<tr>
<td><code>InvalidStateError</code></td>
<td>L'index a été supprimé ou déplacé.</td>
</tr>
</tbody>
</table>
<h2 id="Exemple">Exemple</h2>
<p>Dans l'exemple suivant, on ouvre une transaction puis un magasin d'objet et enfin l'index <code>lName</code>.</p>
<p>Ensuite, on parcourt les enregistrements pour insérer les données dans un tableau HTML. En utilisant la méthode {{domxref("IDBIndex.openCursor")}} qui travaille de la même façon que la méthode {{domxref("IDBObjectStore.openCursor")}} de l'{{domxref("IDBObjectStore","accès")}} au magasin d'objet sauf que les enregistrements sont renvoyés dans l'ordre de l'index et non celui du magasin d'objet.</p>
<pre class="brush:js">function displayDataByIndex() {
tableEntry.innerHTML = '';
//ouvre un transaction
var transaction = db.transaction(['contactsList'], 'readonly');
//accés au magasin d'objet
var objectStore = transaction.objectStore('contactsList');
//on récupère l'index
var myIndex = objectStore.index('lName');
//un curseur qui itère sur l'index
var request = myIndex.openCursor();
request.onsuccess = function(event) {
var cursor = request.result;
if(cursor) {
var tableRow = document.createElement('tr');
tableRow.innerHTML = '<td>' + cursor.value.id + '</td>'
+ '<td>' + cursor.value.lName + '</td>'
+ '<td>' + cursor.value.fName + '</td>'
+ '<td>' + cursor.value.jTitle + '</td>'
+ '<td>' + cursor.value.company + '</td>'
+ '<td>' + cursor.value.eMail + '</td>'
+ '<td>' + cursor.value.phone + '</td>'
+ '<td>' + cursor.value.age + '</td>';
tableEntry.appendChild(tableRow);
cursor.continue();
} else {
console.log('Tous les enregistrements ont été affichés.');
}
};
};</pre>
<div class="note">
<p><strong>Note :</strong> pour un exemple fonctionnel complet, voir notre <a href="https://github.com/mdn/to-do-notifications/">application To-do</a> (<a href="https://mdn.github.io/to-do-notifications/">exemple</a>).</p>
</div>
<h2 id="Spécifications">Spécifications</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Spécification</th>
<th scope="col">État</th>
<th scope="col">Commentaires</th>
</tr>
<tr>
<td>{{SpecName('IndexedDB', '#widl-IDBIndex-openCursor-IDBRequest-any-range-IDBCursorDirection-direction', 'openCursor()')}}</td>
<td>{{Spec2('IndexedDB')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
<p>{{Compat("api.IDBIndex.openCursor")}}</p>
<h2 id="Voir_aussi">Voir aussi</h2>
<ul>
<li><a href="/fr/docs/Web/API/API_IndexedDB/Using_IndexedDB">Utiliser IndexedDB</a></li>
<li>Initier une connexion : {{domxref("IDBDatabase")}}</li>
<li>Utiliser les transactions : {{domxref("IDBTransaction")}}</li>
<li>Définir un intervalle de clés : {{domxref("IDBKeyRange")}}</li>
<li>Récupérer et modifier les données : {{domxref("IDBObjectStore")}}</li>
<li>Utiliser les curseurs {{domxref("IDBCursor")}}</li>
<li>Exemple de référence : <a href="https://github.com/mdn/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">exemple <em>live</em></a>).</li>
</ul>
|
