movable

false garde la colonne là où vous la mettez.

Type	boolean
Par défaut	true
Modifiable en direct (update())	Oui — en redonnant les colonnes (update({ columns }))
Déclaré dans	packages/core/src/columns/defs.ts

Ce qu’il fait

Avec la fonction columns(), l’utilisateur déplace une colonne en tirant son titre ou au clavier ; le menu de colonne la déplace et l’épingle ; le sélecteur de colonnes la réordonne. movable: false refuse tout cela pour cette colonne : son titre ne se tire pas, l’« Épinglage » et les déplacements du menu sont désactivés, le sélecteur la montre verrouillée. Un état enregistré qui la place ailleurs est signalé et sa place est gardée.

Les autres colonnes bougent toujours autour d’elle. Pour garder une colonne en premier, mettez-la en premier dans la liste et donnez-lui movable: false (souvent avec pinned).

Exemple

import { createGrid, type GridMessages } from '@dzgrid/dom';
import { columns } from '@dzgrid/dom/columns';
import { FR_COLUMNS } from '@dzgrid/dom/locales/fr-columns';
import { FR } from '@dzgrid/dom/locales/fr';

type Tool = { id: string; name: string; shelf: number; notes: string };

const messages: GridMessages = { ...FR, text: { ...FR.text, ...FR_COLUMNS.text } };

createGrid<Tool>(document.getElementById('outils')!, {
  rows: [{ id: 't1', name: 'Marteau', shelf: 2, notes: 'Arrache-clou, 450 g' }],
  columns: [
    { id: 'name', header: 'Outil', movable: false },
    { id: 'shelf', header: 'Étagère', type: 'number' },
    { id: 'notes', header: 'Notes' },
  ],
  getRowId: (r) => r.id,
  messages,
  features: [columns()],
});

Démo

Tirez Notes avant Outil : elle se déplace. Outil reste à sa place.

Voir aussi

• pinned, resizable.
• Colonnes.