path: root/files/fr/web/api/idbindex/index.html

---
title: IDBIndex
slug: Web/API/IDBIndex
tags:
  - API
  - Database
  - IDBIndex
  - IndexedDB
  - Interface
  - Reference
  - Storage
  - TopicStub
translation_of: Web/API/IDBIndex
---
<p>{{APIRef("IndexedDB")}}</p>

<div>
<p>L'interface <strong><code>IDBIndex</code></strong>de l'{{domxref("IndexedDB_API","API IndexedDB")}} est un accès à un index d'un magasins d'objet. Un index permet de trier les enregistrements d'un magasin d'objet sur une autre clé que la clé primaire.</p>

<p>Un index contient des enregistrements persistent. Chaque enregistrement est composé d'une clé ( la valeur du chemin de clé) et d'une valeur (la clé primaire de l'enregistrement dans le magasin d'objet). Les enregistrements de l'index se mettent automatiquement à jour lorsque un enregistrement du magasin d'objet est ajouté , mise à jour ou supprimé. Chaque enregistrement de l'index ne peut référer qu'a un enregistrement du magasin d'objet. Un magasin d'objet peut avoir plusieurs index et lorsque le magasin d'objet change tout les index sont mis à jour automatiquement.</p>

<p>On peut retrouver les enregistrement sur une partie des clés, voir {{domxref("IDBKeyRange","intervalle de clé")}}.</p>

<p>{{AvailableInWorkers}}</p>

<h2 id="Méthodes">Méthodes</h2>

<p>Hérite de: <a href="/en/DOM/EventTarget" title="en/DOM/EventTarget">EventTarget</a></p>

<dl>
 <dt>{{domxref("IDBIndex.count()")}}</dt>
 <dd>Fait un {{domxref("IDBRequest","requête")}} sur l'index. La requête compte le nombre d'enregistrements dans cet index ou sur l'{{domxref("IDBKeyRange","intervalle de clé")}} passé en paramètre.</dd>
 <dt>{{domxref("IDBIndex.get()")}}</dt>
 <dd>Fait une {{domxref("IDBRequest","requête")}} pour renvoyer le premier enregistrement correspondant à la clé ou l'{{domxref("IDBKeyRange","")}} du magasin d'objet suivant l'index.</dd>
 <dt>{{domxref("IDBIndex.getKey()")}}</dt>
 <dd>Fait une {{domxref("IDBRequest","requête")}} pour renvoyer la clé primaire correspondant à la clé ou à l'{{domxref("IDBKeyRange","intervalle de clé")}} de l'index. Si une clé est trouvé le résultat de la requête contiendra seulement la clé primaire de l'enregistrement et non l'enregistrement comme le fait {{domxref("IDBIndex.get")}}.</dd>
 <dt>{{domxref("IDBIndex.getAll()")}}</dt>
 <dd>Fait une {{domxref("IDBRequest","requête")}} qui renvoie un tableau ordonné suivant les clés, des clones structurés des enregistrements de l'{{domxref("IDBIndex","index relié")}}. On peut limité le nombre d'enregistrements en les filtrants suivant leurs clés ou en paramétrant le compteur.</dd>
 <dt>{{domxref("IDBIndex.getAllKeys()")}}</dt>
 <dd>Ferrais une {{domxref("IDBRequest","requête")}} qui renverrait la liste de toutes les clés des enregistrements de l'index. On pourrait limiter le nombre d'enregistrements en les filtrants suivant leurs clés ou en paramétrant le compteur.</dd>
 <dt>{{domxref("IDBIndex.openCursor()")}}</dt>
 <dd>Fait une {{domxref("IDBRequest","requête")}} récursive suivant un {{domxref("IDBCursorWithValue","curseur avec valeur")}} qui itère l'index {{domxref("IDBObjectStore","relié")}} sur l'{{domxref("IDBKeyRange","intervalle de clé")}} spécifié.</dd>
 <dt>{{domxref("IDBIndex.openKeyCursor()")}}</dt>
 <dd>Fait une {{domxref("IDBRequest","requête")}} récursive suivant un {{domxref("IDBCursor","curseur")}} qui itère l'index {{domxref("IDBObjectStore","relié")}} sur l'{{domxref("IDBKeyRange","intervalle de clé")}} spécifié.</dd>
</dl>

<h2 id="Propriétés">Propriétés</h2>

<dl>
 <dt>{{domxref("IDBIndex.isAutoLocale")}} {{readonlyInline}} {{ Non-Standard_inline() }}</dt>
 <dd>Renvoie un {{domxref("Boolean","booléen")}} indiquant si la valeur de <code>locale</code> à été paramétré sur <code>auto</code> lors de la mise en place de l'index (voir les paramètres <code>{{domxref("IDBObjectStore.createIndex")}}</code>).</dd>
 <dt>{{domxref("IDBIndex.locale")}} {{readonlyInline}} {{ Non-Standard_inline() }}</dt>
 <dd>Renvoie la localisation de l'index (par exemple fr, ou <code>en-US</code>) <code>si la localisation à été spécifie lors de la mise en place de l'index</code> (voir les paramètres {{domxref("IDBObjectStore.createIndex")}}).</dd>
 <dt>{{domxref("IDBIndex.name")}} {{readonlyInline}}</dt>
 <dd>Renvoie le nom de l'index.</dd>
 <dt>{{domxref("IDBIndex.objectStore")}} {{readonlyInline}}</dt>
 <dd>Renvoie un {{domxref("IDBObjectStore","accès au magasin d'objet")}} que référence l'index.</dd>
 <dt>{{domxref("IDBIndex.keyPath")}} {{readonlyInline}}</dt>
 <dd>Renvoie le chemin de clé de l'index. Si l'index n'est pas <a href="https://developer.mozilla.org/fr/IndexedDB/Index#gloss_auto-populated" title="en/IndexedDB/Index#gloss auto-populated">automatiquement mise à jour</a> la propriété vaux <code>null</code>.</dd>
 <dt>{{domxref("IDBIndex.multiEntry")}} {{readonlyInline}}</dt>
 <dd>Renvoie un {{domxref("Boolean","booléen")}} qui indique comment l'index gère le chemin de clé si c'est un tableau.</dd>
 <dt>{{domxref("IDBIndex.unique")}} {{readonlyInline}}</dt>
 <dd>Renvoie un {{domxref("Boolean","booléen")}} qui indique l'index interdit la duplication d'enregistrement sur sa clé.</dd>
</dl>

<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>Finalement, On itère sur tous les enregistrements pour en 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 notranslate">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 =   '&lt;td&gt;' + cursor.value.id + '&lt;/td&gt;'
                           + '&lt;td&gt;' + cursor.value.lName + '&lt;/td&gt;'
                           + '&lt;td&gt;' + cursor.value.fName + '&lt;/td&gt;'
                           + '&lt;td&gt;' + cursor.value.jTitle + '&lt;/td&gt;'
                           + '&lt;td&gt;' + cursor.value.company + '&lt;/td&gt;'
                           + '&lt;td&gt;' + cursor.value.eMail + '&lt;/td&gt;'
                           + '&lt;td&gt;' + cursor.value.phone + '&lt;/td&gt;'
                           + '&lt;td&gt;' + cursor.value.age + '&lt;/td&gt;';
      tableEntry.appendChild(tableRow);

      cursor.continue();
    } else {
      console.log('Tous les enregistrements ont été affichés.');
    }
  };
};</pre>

<p class="note">Pour un exemple de travail complet, voir notre <a href="https://github.com/mdn/to-do-notifications/">To-do Notifications</a> app (<a href="http://mdn.github.io/to-do-notifications/">view example live</a>).</p>

<h2 id="Spécification">Spécification</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Spécification</th>
   <th scope="col">Statut</th>
   <th scope="col">Commentaire</th>
  </tr>
  <tr>
   <td>{{SpecName('IndexedDB', '#idl-def-IDBIndex', 'IDBIndex')}}</td>
   <td>{{Spec2('IndexedDB')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité avec les navigateurs</h2>

<p>{{ CompatibilityTable() }}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Fonctionnalité</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Support basique</td>
   <td>{{CompatChrome(23.0)}}{{property_prefix("webkit")}}<br>
    {{CompatChrome(24.0)}}</td>
   <td>10 {{property_prefix("moz")}}<br>
    {{CompatGeckoDesktop("16.0")}}</td>
   <td>10, en partie</td>
   <td>15</td>
   <td>7.1</td>
  </tr>
  <tr>
   <td><code>count()</code></td>
   <td>{{CompatChrome(23.0)}}</td>
   <td>{{ CompatGeckoDesktop("22.0") }}</td>
   <td>10, en partie</td>
   <td>15</td>
   <td>7.1</td>
  </tr>
  <tr>
   <td><code>getAll()</code> et <code>getAllKeys()</code></td>
   <td>{{CompatChrome(48.0)}}</td>
   <td>{{ CompatGeckoDesktop("24.0") }}<br>
    behind <code>dom.indexedDB.experimental</code>  pref</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
  </tr>
  <tr>
   <td>Disponible dans workers</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoDesktop("37.0")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>isAutoLocale</code> et <code>locale</code></td>
   <td>{{ CompatNo() }}</td>
   <td>
    <p>{{CompatGeckoDesktop("43.0")}}<br>
     behind <code>dom.indexedDB.experimental</code>  pref</p>
   </td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Fonctionnalité</th>
   <th>Android</th>
   <th>Android Webview</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>Firefox OS</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
   <th>Chrome for Android</th>
  </tr>
  <tr>
   <td>Support basique</td>
   <td>4.4</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{ CompatGeckoMobile("22.0") }}</td>
   <td>1.0.1</td>
   <td>10</td>
   <td>22</td>
   <td>{{ CompatNo() }}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>count()</code></td>
   <td>4.4</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{ CompatGeckoMobile("22.0") }}</td>
   <td>1.0.1</td>
   <td>10</td>
   <td>22</td>
   <td>{{ CompatNo() }}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>getAll()</code> et <code>getAllKeys()</code></td>
   <td>{{ CompatNo() }}</td>
   <td>{{CompatChrome(48.0)}}</td>
   <td>{{ CompatGeckoMobile("24.0") }}<br>
    avec <code>dom.indexedDB.experimental</code>  activer</td>
   <td>1.1 avec<br>
    <code>dom.indexedDB.experimental</code>  avtivé</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
   <td>{{CompatChrome(48.0)}}</td>
  </tr>
  <tr>
   <td>Disponible dans workers</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoMobile("37.0")}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
  <tr>
   <td><code>isAutoLocale</code> et <code>locale</code></td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo()}}</td>
   <td>{{CompatGeckoMobile("43.0")}}<br>
    avec <code>dom.indexedDB.experimental</code>  activé</td>
   <td>2.5<br>
    avec <code>dom.indexedDB.experimental</code>  activé</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
   <td>{{ CompatNo() }}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="Voir_aussi">Voir aussi</h2>

<ul>
 <li>{{domxref("IndexedDB_API.Using_IndexedDB","Utiliser IndexedDB")}}</li>
 <li>{{domxref("IDBDatabase","Débuter une connexion")}}</li>
 <li>{{domxref("IDBTransaction","Utilisé les transactions")}}</li>
 <li>{{domxref("IDBKeyRange","Définir l'intervalle des clés")}}</li>
 <li>{{domxref("IDBObjectStore","Accès aux magasins d'objets")}}</li>
 <li>{{domxref("IDBCursor","Utiliser les curseur")}}</li>
 <li>Exemple de référence: <a class="external" href="https://github.com/mdn/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a class="external" href="http://mdn.github.io/to-do-notifications/">voir l'exemple en direct</a>.)</li>
</ul>
</div>