Extjs Grille De Filtre Dynamique ListFilter

Je suis en train de mettre en œuvre Ext.ux.de la grille.le filtre.ListFilter à l'aide d'une banque de données (plutôt que d'une liste codée en dur) couverts ici, dans le ExtJS 4 de l'API. Les données proviennent de l'amende et je vois une option de filtre sur cette colonne, mais il dit simplement: "Chargement..." où les options de filtre sont censés être:

Extjs Grille De Filtre Dynamique ListFilter

Je suis sûr que j'ai cette configuré comme par l'API, les specs, mais n'ont pas eu de chance avec cette. Quelqu'un a mis en œuvre correctement?

Le magasin que j'utilise pour obtenir les options de filtre est mis en place comme ceci:

//get the levels for filtering
var levelStore = Ext.create('Ext.data.Store', {
    fields: ['levels'],
    proxy: {
        type: 'ajax', 
        url: '../json?queryName=levels',
        reader: 'json'
    },
    autoLoad: true
});

J'ai mis en place le filtre config dans la colonne comme suit:

{
header: 'Level',
dataIndex: 'levels',
width: 160,
sortable: true,
filter: {
    type: 'list',
    store: levelStore
}

Certaines pensées que j'ai eues:

Faire j'ai besoin de mon option de filtre de magasin de données d'une colonne titre, comme "nom" au lieu de "niveau"?

Est-ce à essayer d'obtenir les options de la banque avant qu'ils sont chargés de l'ajax, et il y a de quelconque façon de la raconter à la charge de ces options de filtre après l'ajax est revenu?

Ai-je besoin pour mettre en œuvre ma configuration de filtre séparé de la colonne de config pour l'utiliser? (toutes mes autres configurations de filtrage, sont à droite dans la colonne de config et semblent bien fonctionner)

EDIT:

La réponse json ressemble à quelque chose comme cela, vous ne savez pas si il est à l'origine du problème:

[{"levels":"Level 1"},{"levels":"Level 2"},{"levels":"Level 3"}]

OriginalL'auteur Geronimo | 2012-01-31

  1. 2

    Je l'ai résolu maintenant. J'ai fini la configuration du filtre avec un vide tableau d'options options: [] et puis mettre un rappel sur le magasin qui ajoute les options de filtre pour le vide d'un tableau d'options. Comme ceci:

    La colonne modèle (avec filtre config):

    {
    header: 'Level',
    dataIndex: 'levels',
    itemId: 'levels',
    width: 160,
    sortable: true,
    filter: {
        type: 'list',
        options: [],
        phpMode: true,
    }
}

    La boutique:

    var levelStore = Ext.create('Ext.data.Store', {
    fields: ['levels'],
    proxy: {
        type: 'ajax', 
        url: '../json?queryName=levels',
        reader: 'json'
    },
    autoLoad: {
        callback: function() {
            grid.getView().getHeaderCt().child('#levels').initialConfig.filter.options = levelStore.collect('levels');
        }
    }
});

    ("grille" est la variable que j'ai nommé ma grille avec les filtres)

    J'ai besoin exactement la même chose, mais je ne sais pas comment je ferais pour Ext js 3, je me sens appréciée pour la réponse.

    OriginalL'auteur Geronimo

  2. 0

    J'ai le même lors de l'utilisation de ExtJs 4.0.2a. Jeve find whatautoLoadmust false for store and some patch toExt.ux.de la grille.menu.ListMenu`.

    La boutique:

    var levelStore = Ext.create('Ext.data.Store', {
  fields: ['levels'],
  proxy: {
    type: 'ajax', 
    url: '../json?queryName=levels',
    reader: 'json'
  },
  autoLoad: false
});

    Et remplacer la méthode show de ext-4.0.2a/examples/ux/grid/menu/ListMenu.js avec:

    show : function () {
        var lastArgs = null;
        console.debug('show filter menu');
        return function(){
            if (this.loadOnShow && !this.loaded) {
                  this.store.load();
            }
            if(arguments.length === 0){
                this.callParent(lastArgs);
            } else {
                lastArgs = arguments;
                this.callParent(arguments);
            }
        };
    }()
    J'ai fait ce que vous avez dit. Mais maintenant obtenir une erreur Uncaught TypeError: Cannot call method 'each' of null

    OriginalL'auteur Wivern

  3. -1

    C'est simple

    filter: {
    type: 'list',
    options: levelStore.collect('levels') 
}
    Mon problème était que la levelStore n'était pas chargée au moment de la grille de rendu. Cette solution permettrait de retourner un tableau vide.

    OriginalL'auteur jprism