Quel est le moyen le plus simple d'afficher la valeur NULL en tant que chaîne vide à la place de la chaîne "null" dans une grille ExtJS?

Question

J'ai un script côté serveur (PHP) retournant des données JSON pour remplir une grille ExtJS.

Ces données proviennent d'une requête MySQL contenant des valeurs NULL.

Lorsque PHP il code dans la notation JSON, il conserve la valeur NULL intacte:

{"id":"33","name":"Test1","url":null,"cls":"x-tree-noicon","expanded":true} 

Mais ... quand ces données sont affichées dans la grille ExtJS, il montre une « nulle » chaîne dans l'endroit de la valeur NULL. Je ne veux pas qu'il affiche «null». Je veux juste qu'il soit vide (une chaîne vide).

Quelle est la manière la plus facile d'y parvenir?

Merci.

Answer 1

Je ne sais pas si le plus simple mais la première chose qui me vient à l'esprit est la création d'un renderer personnalisé. Vous pouvez utiliser quelque chose comme ceci:

function render(value){ 
    if(value === null){ 
     value = ''; 
    } 
    return value; 
} 

Answer 2

La réponse de WoLpH est correcte. Ma propre question était en quelque sorte "incorrect" ... :-)

En fait, je traite avec un treegrid (Ext.ux.tree.TreeGrid), et non pas une grille commune ExtJS (Ext.grid.GridPanel).

Les colonnes de la grille d'arbre sont et non de type Ext.grid.Column, comme la grille commune. Ils sont du type Ext.list.Column.

Cela signifie que l'option de configuration renderer ne s'applique pas (elle existe et fonctionne sur Ext.grid.Column, mais pas sur Ext.list.Column).

Pour modifier le rendu d'une colonne Ext.list.C, il existe l'option de configuration tpl disponible, qui utilise le mécanisme Ext.XTemplate.

Ci-dessous, je partage la configuration de mon treegrid colonne qui fait ce que je voulais:

tpl: '<tpl if="url === null"></tpl><tpl if="url !== null">{url}</tpl>' 

La configuration ci-dessus fait ma colonne rendre une chaîne vide pour les valeurs NULL, au lieu d'un "null "chaîne, dans le treegrid!

---

Note finale: J'ai voté pour la réponse de WoLpH parce que c'est correct. Ma question était trompeuse, et je préférais ne pas la modifier/éditer, mais partager mes propres conclusions comme une autre réponse. Je le remercie aussi parce que cela m'a permis de me concentrer sur les bonnes choses. Merci.

Answer 3

Votre autre option serait de le gérer à partir de l'arrière. Vous devez vérifier l'ensemble de résultats pour toutes les instances de NULL et les convertir en chaînes vides avant de le renvoyer au client.

Answer 4

Avez-vous défini un Ext.data.Model? si vous définissez et Ext.data modèle et l'utilisation dans le Ext.data.Store lire la chaîne JSON est très facile ...

Vous avez juste besoin de déclarer le type de champ: « auto »

essayez ceci:

Ext.define('testModel', { 
     extend : 'Ext.data.Model', 
     fields :[ 
        {name: 'Id', type: 'int'}, 
        {name: 'name', type: 'string'}, 
        {name: 'url', type: 'auto'}, 
        {name: 'cls', type: 'string'},      
        {name: 'expanded', type: 'boolean'} 
        ]  
    }); 


var testStore = Ext.create('Ext.data.Store', { 
         model : 'testModel', 
         proxy : { 
             type : 'memory', 
             reader : {type:'json'} 
            } 
       }); 

et d'utiliser le testStore pour remplir les données de votre grille.

Answer 5

Dans ExtJS 3.4, il existe une propriété useNull qui peut être définie pour un champ numérique (mais pas de chaînes).

http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.data.Field-cfg-useNull

(facultatif) Utilisation lors de la conversion des données reçues en un type de numéro (soit int ou float). Si la valeur ne peut pas être analysée, null sera utilisé si useNull est vrai, sinon la valeur sera 0. Par défaut, faux

par défaut à: false

Par ex

{ 
    name: 'myId', 
    type: 'int', 
    useNull: true 
},