Voir sur GitHub

Bootstrap Table Methods

L'API des méthodes de Bootstrap Table.

Sur cette page

Syntaxe d’appel de méthode : $('#table').bootstrapTable('method', parameter).

Remarque : Les noms de méthode ci-dessous (par exemple, append, check, getData) sont des noms de méthode exacts à utiliser lors de l’appel des méthodes Bootstrap Table via JavaScript.

Par exemple : $('#table').bootstrapTable('append', data)

append

  • Paramètre : data

  • Détail :

    Ajoute les data au tableau.

  • Exemple : Append

check

  • Paramètre : index

  • Détail :

    Coche une ligne. L’index de ligne commence à 0.

  • Exemple : Check/Uncheck

checkAll

  • Paramètre : undefined

  • Détail :

    Coche toutes les lignes de la page courante.

  • Exemple : Check/Uncheck All

checkBy

  • Paramètre : params

  • Détail :

    Coche une ligne par un tableau de valeurs, les params contiennent :

    • field : nom du champ utilisé pour trouver les enregistrements.
    • values : tableau de valeurs pour les lignes à cocher.
    • onlyCurrentPage (default false) : Si true, seule la dataset visible sera cochée. Si la pagination est utilisée, les autres pages seront ignorées.
  • Exemple : Check/Uncheck By

checkInvert

  • Paramètre : undefined

  • Détail :

    Inverse la sélection des lignes de la page courante. Déclenche les événements onCheckSome et onUncheckSome.

  • Exemple : Check Invert

collapseAllRows

  • Paramètre : undefined

  • Détail :

    Réduit toutes les lignes si l’option de vue détaillée est définie sur true.

  • Exemple : Expand/Collapse All Rows

collapseRow

  • Paramètre : index

  • Détail :

    Réduit la ligne avec l’index passé en paramètre si l’option de vue détaillée est définie sur true.

  • Exemple : Expand/Collapse Row

collapseRowByUniqueId

  • Paramètre : uniqueId

  • Détail :

    Réduit la ligne avec l’uniqueId passé en paramètre si l’option de vue détaillée est définie sur true.

  • Exemple : Expand/Collapse Row by uniqueId

destroy

  • Paramètre : undefined

  • Détail :

    Détruit le Bootstrap Table.

  • Exemple : Destroy

expandAllRows

  • Paramètre : undefined

  • Détail :

    Détend toutes les lignes si l’option de vue détaillée est définie sur true.

  • Exemple : Expand/Collapse All Rows

expandRow

  • Paramètre : index

  • Détail :

    Détend la ligne qui a l’index passé en paramètre si l’option de vue détaillée est définie sur true.

  • Exemple : Expand/Collapse Row

expandRowByUniqueId

  • Paramètre : uniqueId

  • Détail :

    Détend la ligne avec l’uniqueId passé en paramètre si l’option de vue détaillée est définie sur true.

  • Exemple : Expand/Collapse Row by uniqueId

filterBy

  • Paramètre :

    • filter - An Object of filter Default: {}
    • options - An Object of options Default:
      {
          'filterAlgorithm': 'and'
      }
  • Détail :

    (Peut être utilisé uniquement côté client) Filtrer les données dans le tableau. Il y a plusieurs façons de filtrer :

    • Laissez les options vides pour utiliser le filtre and.
    • Définissez le filterAlgorithm (voir au paramètre) sur or pour utiliser le filtre or.
    • Passez une fonction au filterAlgorithm (voir au paramètre) pour utiliser un filtre custom.

    Algorithme de filtrage

    • And
      • Filtre {age: 10} pour afficher les données uniquement si l’âge est égal à 10. Vous pouvez également filtrer avec un tableau de valeurs, comme : {age: 10, hairColor: ['blue', 'red', 'green']} pour trouver des données où l’âge est égal à 10 et la couleur des cheveux est bleue, rouge ou verte.
    • Or
      • Filtre {age: 10, name: "santa"} pour afficher toutes les données qui ont un âge de 10 ou le nom est égal à santa.
    • Custom
      • Filtrer par votre algorithme personnalisé
      • Paramètres de fonction :
        • Row
        • Filters
      • Retourne true pour conserver la ligne et false pour filtrer la ligne.
  • Exemple : Filter By

getData

  • Paramètre : params

  • Détail :

    Obtenez les données chargées du tableau au moment où cette méthode est appelée

    • useCurrentPage : si défini sur true, la méthode retournera les données uniquement sur la page courante.
    • includeHiddenRows : si défini sur true, la méthode inclura les lignes masquées.
    • unfiltered : si défini sur true, la méthode inclura toutes les données (non filtrées).
    • formatted : obtenir la valeur formatée à partir du formatter défini.
  • Exemple : Get Data

getFooterData

  • Paramètre : undefined

  • Détail :

    Obtenez les données chargées du pied au moment où cette méthode est appelée

  • Exemple : Get Footer Data

getHiddenColumns

getHiddenRows

  • Paramètre : show

  • Détail :

    Obtenez toutes les lignes masquées, et si vous passez le paramètre show true, les lignes seront à nouveau affichées. Sinon, la méthode ne retournera que les lignes masquées.

  • Exemple : Get Hidden Rows

getOptions

  • Paramètre : undefined

  • Détail :

    Retourne l’objet d’options.

  • Exemple : Get Options

getRowByUniqueId

  • Paramètre : id

  • Détail :

    Obtenez des données du tableau, la ligne qui contient l’id passé en paramètre.

  • Exemple : Get Row By Unique Id

getScrollPosition

  • Paramètre : undefined

  • Détail :

    Obtenez la position de défilement actuelle. L’unité est 'px'.

  • Exemple : Get Scroll Position

getSelections

  • Paramètre : undefined

  • Détail :

    Retourne les lignes sélectionnées. Lorsqu’aucun enregistrement n’est sélectionné, un tableau vide sera retourné. Les lignes sélectionnées seront désélectionnées lors de certaines actions, par exemple, la recherche ou le changement de page. Si vous souhaitez conserver les sélections, veuillez utiliser maintainMetaData.

  • Exemple : Get Selections

getVisibleColumns

hideAllColumns

hideColumn

  • Paramètre : field

  • Détail :

    Masquez la colonne field spécifiée. Le paramètre peut être une chaîne ou un tableau de champs.

  • Exemple : Show/Hide Column

hideLoading

  • Paramètre : undefined

  • Détail :

    Masquez le statut de chargement.

  • Exemple : Show/Hide Loading

hideRow

  • Paramètre : params

  • Détail :

    Masquez la ligne spécifiée. Les params doivent contenir au moins l’une des propriétés suivantes :

    • index : l’indice de la ligne.
    • uniqueId : la valeur de l’uniqueId pour cette ligne.
  • Exemple : Show/Hide Row

insertRow

  • Paramètre : params

  • Détail :

    Insérez une nouvelle ligne. Les params contiennent les propriétés suivantes :

    • index : l’indice de ligne où insérer.
    • row : les données de la ligne.
  • Exemple : Insert Row

load

  • Paramètre : data

  • Détail :

    Charge les data dans le tableau. Les anciennes lignes seront supprimées.

  • Exemple : Load

mergeCells

  • Paramètre : params

  • Détail :

    Fusionnez plusieurs cellules en une seule cellule. Les params contiennent les propriétés suivantes :

    • index : l’indice de la ligne.
    • field : le nom du champ.
    • rowspan : le nombre de lignes à fusionner.
    • colspan : le nombre de colonnes à fusionner.
  • Exemple : Merge Cells

nextPage

prepend

  • Paramètre : data

  • Détail :

    Ajoutez les data au début du tableau.

  • Exemple : Prepend

prevPage

refresh

  • Paramètre : params

  • Détail :

    Rafraîchir/recharger les données du serveur distant. Prend en charge les configurations de paramètre suivantes :

    • silent (par défaut: false) : Définissez sur true pour rafraîchir les données silencieusement sans afficher le statut de chargement.
    • url : Optionnel, remplace temporairement l’URL de requête actuelle.
    • pageNumber : Optionnel, spécifiez le numéro de page vers lequel naviguer.
    • pageSize : Optionnel, spécifiez le nombre d’enregistrements à afficher par page.
    • query : Optionnel, ajoutez des paramètres de requête supplémentaires pour cette requête.

    Exemple d’utilisation :

    // Rafraîchissement silencieux
    $('#table').bootstrapTable('refresh', {silent: true})
    
    // Modifier l'URL et les paramètres de pagination
    $('#table').bootstrapTable('refresh', {
      url: '/new/api/endpoint',
      pageNumber: 2,
      pageSize: 20
    })
    
    // Ajouter des paramètres de requête
    $('#table').bootstrapTable('refresh', {
      query: {status: 'active', category: 'electronics'}
    })
  • Exemple : Refresh

refreshOptions

  • Paramètre : options

  • Détail :

    Rafraîchissez les options du tableau.

  • Exemple : Refresh Options

remove

  • Paramètre : params

  • Détail :

    Supprimez des données du tableau. Les params contiennent les propriétés suivantes :

    • field : Le nom du champ utilisé pour faire correspondre les lignes à supprimer. Vous pouvez utiliser le champ spécial $index pour supprimer des lignes par indice de ligne.
    • values : Un tableau de valeurs de champ pour les lignes à supprimer. Si vous utilisez le champ spécial $index, vous pouvez passer un tableau d’indices de ligne.

    Exemples d’utilisation :

    // Supprimer par champ id
    $('#table').bootstrapTable('remove', {
      field: 'id',
      values: [1, 2, 3]
    })
    
    // Supprimer par indice de ligne (commence à 0)
    $('#table').bootstrapTable('remove', {
      field: '$index',
      values: [0, 2, 4]
    })
    
    // Supprimer par autre champ
    $('#table').bootstrapTable('remove', {
      field: 'name',
      values: ['John', 'Jane']
    })
  • Exemple : Remove

removeAll

  • Paramètre : undefined

  • Détail :

    Supprimez toutes les données du tableau.

  • Exemple : Remove All

removeByUniqueId

  • Paramètre : id

  • Détail :

    Supprimez des données du tableau, la ligne qui contient l’id passé en paramètre.

  • Exemple : Remove By Unique Id

resetSearch

  • Paramètre : text

  • Détail :

    Définissez le text de recherche.

  • Exemple : Reset Search

resetView

  • Paramètre : params

  • Détail :

    Réinitialisez la vue Bootstrap Table. Par exemple, réinitialisez la hauteur du tableau, les params contiennent :

    • height : la hauteur du tableau.
  • Exemple : Reset View

scrollTo

  • Paramètre : value|object

  • Détail :

    • value
      • Faites défiler jusqu’à la position value numérique, l’unité est 'px', définissez 'bottom' pour faire défiler jusqu’en bas.
    • object
      • Faites défiler jusqu’à l’unité (px ou rows (l'indice commence à 0)) Défaut: {unit: 'px', value: 0}
  • Exemple : Scroll To

selectPage

showAllColumns

showColumn

  • Paramètre : field

  • Détail :

    Affichez la colonne field spécifiée. Le paramètre peut être une chaîne ou un tableau de champs.

  • Exemple : Show/Hide Column

showLoading

  • Paramètre : undefined

  • Détail :

    Affichez le statut de chargement.

  • Exemple : Show/Hide Loading

showRow

  • Paramètre : params

  • Détail :

    Affichez la ligne spécifiée. Les params doivent contenir au moins l’une des propriétés suivantes :

    • index : l’indice de la ligne.
    • uniqueId : la valeur de l’uniqueId pour cette ligne.
  • Exemple : Show/Hide Row

sortBy

  • Paramètre : params

  • Détail :

    Trie le tableau par le champ spécifié. Les params doivent contenir au moins l’une des propriétés suivantes :

    • field : le nom du champ.
    • sortOrder : l’ordre de tri, ne peut être que ‘asc’ ou ‘desc’.
  • Exemple : Sort By

sortReset

  • Paramètre : undefined

  • Détail :

    Réinitialise l’état de tri du tableau, que ce soit causé par l’utilisateur ou programmatiquement.

  • Exemple : Sort reset

toggleDetailView

  • Paramètre : index

  • Détail :

    Bascule la ligne qui a l’index passé en paramètre si l’option de vue détaillée est définie sur true.

  • Exemple : Toggle Detail View

toggleFullscreen

  • Paramètre : undefined

  • Détail :

    Basculer en mode plein écran.

  • Exemple : Toggle Fullscreen

togglePagination

  • Paramètre : undefined

  • Détail :

    Basculez l’option de pagination.

  • Exemple : Toggle Pagination

toggleView

  • Paramètre : undefined

  • Détail :

    Basculez entre la vue carte/tableau.

  • Exemple : Toggle View

uncheck

  • Paramètre : index

  • Détail :

    Décochez une ligne. L’index de ligne commence à 0.

  • Exemple : Check/Uncheck

uncheckAll

  • Paramètre : undefined

  • Détail :

    Décochez toutes les lignes de la page courante.

  • Exemple : Check/Uncheck All

uncheckBy

  • Paramètre : params

  • Détail :

    Décochez une ligne par un tableau de valeurs. Les params contiennent :

    • field : nom du champ utilisé pour trouver les enregistrements.
    • values : tableau de valeurs pour les lignes à décocher.
    • onlyCurrentPage (default false) : Si true, seule la dataset visible sera décochée. Si la pagination est utilisée, les autres pages seront ignorées.
  • Exemple : Check/Uncheck By

updateByUniqueId

  • Paramètre : params

  • Détail :

    Mettez à jour la ou les lignes spécifiées. Chaque param contient les propriétés suivantes :

    • id : un identifiant de ligne où l’id doit être le champ uniqueId attribué au tableau.
    • row : les nouvelles données de ligne.
    • replace (optionnel) : définissez sur true pour remplacer la ligne au lieu de l’étendre.
  • Exemple : Update By Unique Id

updateCell

  • Paramètre : params

  • Détail :

    Mettez à jour une cellule. Les params contiennent les propriétés suivantes :

    • index : l’indice de la ligne.
    • field : le nom du champ.
    • value : la nouvelle valeur du champ.

    Pour désactiver la réinitialisation du tableau, vous pouvez définir {reinit: false}.

  • Exemple : Update Cell

updateCellByUniqueId

  • Paramètre : params

  • Détail :

    Mettez à jour la ou les cellules spécifiées. Chaque param contient les propriétés suivantes :

    • id : identifiant de ligne où l’id doit être le champ uniqueId attribué au tableau.
    • field : nom du champ de la cellule à mettre à jour.
    • value : la nouvelle valeur de la cellule.

    Pour désactiver la réinitialisation du tableau, vous pouvez définir {reinit: false}.

  • Exemple : Update Cell By Unique Id

updateColumnTitle

  • Paramètre : params

  • Détail :

    Mettez à jour le titre du champ de la colonne. Les params contiennent les propriétés suivantes :

    • field : le nom du champ.
    • title : le titre du champ.
  • Exemple : Update Column Title

updateFormatText

  • Paramètre : formatName, text

  • Détail :

    Mettez à jour le texte de format des localisations.

  • Exemple : Update Format Text

updateRow

  • Paramètre : params

  • Détail :

    Mettez à jour la ou les lignes spécifiées. Chaque param contient les propriétés suivantes :

    • index : l’indice de ligne à mettre à jour.
    • row : les nouvelles données de ligne.
    • replace (optionnel) : définissez sur true pour remplacer la ligne au lieu de l’étendre.
  • Exemple : Update Row