2010-01-03 6 views
2

Sur CF9, une colonne CFGrid avec type = "combobox" aura "typeAhead" défini sur false dans le javascript sous-jacent. typeahead est l'effet auto-complet pour un combobox, que vous pouvez voir ici, dans la colonne « Light »: http://www.extjs.com/deploy/dev/examples/grid/edit-grid.htmlComment définissez-vous typeAhead = true sur une colonne ColdFusion 9 EXTJS Grid?

Je voudrais savoir comment ajouter cette fonctionnalité typeahead dans une grille basée sur ExtJS en utilisant ColdFusion 9 et CFGrid/CFGridColumn avec les fonctions Coldfusion.Grid associées.

Merci pour votre aide.

+1

FYI: J'ai ajouté cette demande d'amélioration de demander intercommunication options de configuration sur CFGridColumn: http://cfbugs.adobe.com/cfbugreport/flexbugui/cfbugtracker/main.html#bugId=81416 –

Répondre

3

Voilà comment:

vous créez une fonction js qui ressemble à ceci:

function formatGrid(){ 
    var grid = ColdFusion.Grid.getGridObject("configgrid"); 
    var colModel = grid.getColumnModel(); 

    colModel.setRenderer(1,function(value, p, record, rowIndex, colIndex){ 
     var val = ""; 
     var editor = colModel.getCellEditor(colIndex,rowIndex); 
     Ext.apply(editor.field,{typeAhead:true,editable:true}); 
     return value; 
    });  

} 

Dans l'appel setRenderer, le « 1 » fait référence à l'indice de base zéro de la colonne » re modifier. Si vous avez plusieurs colonnes de liste déroulante, vous pouvez facilement extraire cette fonction pour qu'elle soit plus générique et accepter un modèle de colonne et un index de colonne.

Ensuite, pour appeler la fonction, sur CF8 vous pouvez utiliser

<cfset ajaxOnLoad("formatGrid")> 

Sur CF9 vous pouvez utiliser l'attribut onload de la balise cfgrid, et réglez-le sur « formatGrid » (ou tout ce que vous voulez appeler votre fonction)

pour ce que ça vaut, j'ai vu enfin la lumière après avoir vu la présentation de Cutter sur CF9/Ajax ici: http://experts.na3.acrobat.com/p62805180/

cela m'a donné ce que je devais obtenir le rendu appliqué au modèle de la colonne. Ensuite, j'ai cherché dans la source ce que ColdFusion créait pour le modèle de colonne, et j'ai vu "editable: false" pour le champ déroulant. Turning editable: true on était la pièce manquante pour obtenir typeAhead: true to work.

+0

@Marc - Grand pointe! Merci de l'avoir posté. – Leigh

Questions connexes