Comment mettre en évidence les lignes jqGrid en fonction de la sélection des cases à cocher ?

Mise en surbrillance des lignes en fonction de l'état de la case à cocher dans jqGrid

Lorsque vous travaillez avec jqGrid, vous pouvez rencontrer un scénario dans lequel vous souhaitez mettre en surbrillance des lignes en fonction de l'état d'une case à cocher. Cette fonctionnalité peut fournir une représentation claire et visuelle des lignes sélectionnées.

Mise en œuvre :

jQuery UI ThemeRoller

Un outil plus simple L’approche consiste à utiliser jQuery UI ThemeRoller pour styliser la cellule de votre case à cocher. Cette méthode consiste à personnaliser l’apparence de la cellule en fonction de l’état coché. Vous pouvez y parvenir en ajoutant le CSS suivant à votre code :

.ui-jqgrid .ui-sgfcb .ui-state-checked {
  background-color: #ffff99;
}

Style personnalisé

Si vous préférez une approche plus personnalisée, vous pouvez implémenter votre propre style. en utilisant le rappel rowattr. Ce rappel vous permet de définir des attributs personnalisés pour chaque ligne de la grille, vous permettant de modifier dynamiquement l'apparence de la ligne en fonction de la valeur de la case à cocher. Un exemple d'implémentation serait :

rowattr: function (rd) {
  if (rd.GroupHeader === "1") {
    return {"class": "highlighted-row"};
  }
}

Dans ce cas, la classe de lignes en surbrillance contiendrait votre style personnalisé pour les lignes en surbrillance.

Autres considérations :

• Assurez-vous que la colonne des cases à cocher ne peut pas être triée pour éviter un comportement inattendu lors du tri.
• Envisagez d'utiliser cellclasses pour personnaliser davantage l'apparence des cellules individuelles en fonction de leurs données.
• Les cellules en surbrillance seront visuellement visibles, améliorant ainsi l'expérience utilisateur lors de la navigation dans la grille.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!