Maison > interface Web > js tutoriel > Comment mettre en surbrillance une ligne dans JqGrid lorsqu'une case est cochée ?

Comment mettre en surbrillance une ligne dans JqGrid lorsqu'une case est cochée ?

Barbara Streisand
Libérer: 2024-11-10 20:26:03
original
523 Les gens l'ont consulté

How to Highlight a Row in JqGrid When a Checkbox is Checked?

Comment mettre en surbrillance une ligne lorsqu'une case à cocher est vraie dans JqGrid

Dans un jqGrid, vous pouvez facilement mettre en surbrillance une ligne lorsque la case à cocher est vrai. Voici un guide étape par étape :

  1. Utiliser le rappel rowattr :
    La version 4.3.2 de jqGrid a introduit le rappel rowattr, qui vous permet de définir des attributs personnalisés pour chaque ligne. C'est parfait pour surligner en fonction d'une valeur de case à cocher.
  2. Créer une fonction Rowattr :
    Définissez une fonction rowattr qui vérifie la valeur de la colonne GroupHeader (ou toute autre colonne de case à cocher que vous avez ). Si la valeur est « 1 », renvoie un nom de classe qui définit le style de surbrillance.
gridview: true,
rowattr: function (rd) {
    if (rd.GroupHeader === "1") { // Adjust this to match your checkbox column
        return {"class": "myAltRowClass"};
    }
}
Copier après la connexion
  1. Définissez la classe de surbrillance :
    Dans votre CSS , créez une classe appelée myAltRowClass qui spécifie le style de surbrillance, tel qu'un arrière-plan jaune.
  2. Inclure des modèles de colonnes :
    Pour rationaliser votre code, utilisez des modèles de colonnes pour définir des propriétés communes pour plusieurs colonnes. Par exemple, si toutes vos entrées de texte ont la même taille et la même longueur maximale :
cmTemplate: {align: 'center', sortable: false, editable: true, width: 80},
Copier après la connexion
  1. Utilisez des modèles de cases à cocher :
    De même, vous pouvez créer un modèle pour vos colonnes de cases à cocher :
var myCheckboxTemplate = {formatter: 'checkbox', edittype: 'checkbox', type: 'select',
        editoptions: {value: "1:0"}};
Copier après la connexion

Ensuite, dans votre colModel, au lieu de définir des objets complexes pour chaque colonne de cases à cocher, utilisez simplement le modèle :

{name: 'GroupHeader', index: 'GroupHeader', template: myCheckboxTemplate}
Copier après la connexion

En suivant ces étapes, vous pourrez mettre en évidence les lignes en fonction des valeurs des cases à cocher dans votre jqGrid.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal