Dev Faq
7
votes

JQGRID: Comment changer de rembourrage cellulaire

J'utilise JQGrid3.6.5 sur Google hébergé JQueryui1.8.2 et JQuery1.4.2

Je veux changer le rembourrage de la cellule d'un JQGrid. À des fins de test, je veux la définir à 10px tout autour de chaque cellule.

La seule option que j'ai rencontrée alors que Googling est la suivante:

  1. Ajouter un rembourrage avec CSS. par exemple. # grille-id td, # grille-id {remplissage: 10px; }
  2. SET CELLLAYOUT OPTION À 21 (PADDINGLEFT + PADINGRIGHT + BORDGLEFT)

    Lorsque je n'ai aucune largeur fixée sur aucune des colonnes de mon colmodel, cela fonctionne comme prévu. Bien que lorsque je redimensionniste l'un des en-têtes, ou définissez une largeur de colonne dans le colmodel, les en-têtes et les cellules ne sont plus alignés.

    Quelqu'un sait comment résoudre ce problème ou savoir une autre façon de modifier le rembourrage des cellules?

0 commentaires

6 Réponses :

2
votes

selon le JQGRID Developer , l'option CellLayout est la manière préférée. Malheureusement, le Documentation est un peu cryptique:

Cette option détermine le rembourrage + la largeur de la cellule de la cellule. Cela ne devrait généralement pas être modifié, mais si des modifications personnalisées de TD sont effectuées dans le fichier CSS de la grille, cela devra être modifié. La valeur initiale de 5 signifie paddinglef⇒2 + paddingright⇒2 + Borderleft⇒1 = 5

3 commentaires

C'est ce que ma question est basée sur ma question. (Et ce que je ne peux pas avoir du travail comme prévu)

Hmm ... Si c'est ce que Tony (le développeur) a recommandé, alors je ne sais pas quoi d'autre de vous dire. Vous devrez peut-être modifier les fichiers JQGrid afin d'obtenir cela pour travailler.

Merci d'avoir pointé la celluleLayout. Il a résolu un problème similaire que j'avais.

2
votes

J'ai trouvé la solution et je suis un peu honte de ne pas la trouver plus tôt: p

Apparemment, les en-têtes de grille sont TH mais pas dans la même table que la grille elle-même. Donc, en modifiant # grille-id {...} à corps .ui-jQgrid-htable th {...} je l'ai eu pour travailler comme prévu.

1 commentaires

Il n'est pas suffisant pour ne pas changer que le style Seulement des cas, par exemple pour l'emballage de mots, vous devez également appliquer les mêmes règles de style pour emballer sur .ui-JQGrid .ui-JQGrid-HTABLE TH DIV..CHEERS

0
votes

J'ai finalement compris comment définir le remplissage sur le JQGrid Th et TD code> correctement. Ceci est ma solution:

1.Override .ui-jQgrid .ui-jQgrid-HTABLE TH DIV CODE> CSS Class P> 

.ui-jqgrid tr.jqgrow td{
     height: auto;
     white-space: normal;
     padding: 10px;
}

0 commentaires
1
votes

J'ai résolu un cas similaire en enveloppant le contenu de chaque cellule avec un DIV que je à son tour rembourré. Cela vous donnera un comportement correct depuis la colonne avec des séjours fixes à votre configuration JQGrid. xxx

et stylé le div.cell comme ceci (.sass). xxx

0 commentaires
5
votes

Ajoutez une nouvelle classe CSS aux colonnes que vous devez styles: xxx pré>

note classes: "grille-col" code> dans cet extrait. p >

Numérotez les colonnes avec CSS en utilisant ! IMPORTANT CODE> Pour donner à ces règles la priorité la plus élevée: P> 

.grid-col {
  padding-right: 5px !important;
  padding-left: 5px !important;
}

0 commentaires
1
votes 
 tr.jqgrow td { padding: 0px 2px 0px !important; }
This will create cell-padding for both header and content cells.
0 commentaires

Articles qui pourrait vous intéresser :

Impossible d'importer le module "@ angular / material"
Interaction profonde avec break and catch
Utilisation de node.js comment renommer tous les fichiers d'un dossier
Google Chrome Uncaught (promis) DOMException lors de la lecture AUDIO