J'ai un ExtJSContrôle ListView avec 4 colonnes. L'une des colonnes contient du texte qui étend la largeur de la colonne, ainsi une partie du texte se trouve sous la colonne suivante.ExtJS: comment envelopper du texte dans un ListView avec des colonnes?
Comment puis-je mettre white-space-normal pour les cellules dans le listview?
Cela devrait être dans la définition de la colonne:
{
header: 'Besked',
dataIndex: 'besked',
tpl: '<p style=\"white-space:normal\";>{besked}</p>'
}
** @ sdavids: ** Merci, cela fonctionne comme un charme :) – Chau
Sdavids solution œuvres et je voté pour cela.
Mais juste au cas où vous préférez en utilisant une classe CSS au lieu de styles voici comment:
{
header: 'Besked',
dataIndex: 'besked',
cls: 'listViewColumnWrap'
}
Ensuite, vous avez besoin de cette ligne dans certains fichier css:
.listViewColumnWrap { white-space:normal; }
En fait, il serait préférable d'ajouter simplement les cls à la colonne au lieu de l'encapsuler dans un modèle de données. – sdavids
Cette est un moyen multi-navigateur de remplacer les classes css par défaut pour que toutes vos vues de liste, grilles et menus de sélection de liste déroulante enveloppent tous leur contenu textuel:
.x-list-body dt {white-space: normal;}
.x-list-body dt em { white-space: pre-wrap !important; word-wrap: break-word !important;}
.x-grid3-row-flag { white-space: normal; background-color: #ffc; }
.x-grid3-cell-inner, .x-grid3-hd-inner{ white-space: normal; }
.x-grid3-cell-inner { white-space: pre-wrap !important; word-wrap: break-word !important;}
.x-combo-list-inner .x-combo-list-item { white-space: normal; }
.x-combo-list-item { white-space: pre-wrap !important; word-wrap: break-word !important;}
Avez-vous essayé de le définir dans le modèle (propriété 'tpl' de l'objet de configuration de colonne). Si oui, alors comment? – Mchl
** @ Mchl: ** Non, je n'ai pas essayé sur l'objet de configuration de la colonne - uniquement sur l'ensemble du contrôle ListView. J'aurais dû lire votre commentaire correctement: $ – Chau