1. #1
    Sencha User
    Join Date
    Jan 2013
    Posts
    6
    Vote Rating
    0
    Annu is on a distinguished road

      0  

    Default Filter(textbox) of Grid Panel having autocomplete functionality like combobox.

    Filter(textbox) of Grid Panel having autocomplete functionality like combobox.


    Hi,
    I am using 4.1.3.
    I create grid panel having its filter functionality to columns. But i want to add autocomplete functionality to filter text. I mean Like extjs combobox I want autocomplete loading Filter Textbox in grid panel.

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi!

    why not use a combo with trigger hide, it will serve your needs...
    sample:-
    Code:
    {
       xtype:'combo'
       triggerAction:'all',
       typeAhead:true,
       mode:'remote',
       minChars:2,
       forceSelection:true,
       hideTrigger:true
    }
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha User
    Join Date
    Jan 2013
    Posts
    6
    Vote Rating
    0
    Annu is on a distinguished road

      0  

    Default


    Hi,

    I already used a combobox and its working fine. But now I want autocomplete functionality with Grid panel. It have filter On columns and i want autocomplete on that filter.
    Here is my code: I am using some perl code also.

    var filters_config = {
    ftype: 'filters',
    filterCls: 'filter-sort .x-column-header-text',
    onCheckChange: function (item, value) {
    this.getMenuFilter().setActive(value);
    },

    // This function will return filter settings for all columns and build query to set filter setting on respective column.
    onBeforeLoad : function (store, options) {
    options.params = options.params || {};
    this.cleanParams(options.params);
    var params = this.buildQuery(this.getFilterData());
    Ext.apply(options.params, params);
    if(params.filter) {
    filterSetting = Ext.decode(params.filter);
    } else {
    filterSetting = null;
    }
    },
    };

    var grid = Ext.create('Ext.grid.Panel', {
    title: "<% 'tabdiv_' . $tab_divid_cnt |n%>",
    id: "<% $grid_id |js,h%>",
    columns: column,
    store: grid_store,
    columnLines: true,
    loadMask: true,
    tbar: tbar,
    features: [filters_config],
    renderTo: Ext.get('<% 'tabdiv_' . $tab_divid_cnt |n%>'),
    layout: 'fit',
    header: false,
    enableColumnMove: false,
    % if ( not $fetch_data_from_server) {
    autoHeight: true,
    viewConfig: {
    deferEmptyText: false,
    emptyText: "<% defined $no_result_html ? $no_result_html : escape_html($no_result) |n%>",
    autoscroll: true,
    enableTextSelection: true
    },
    % } else {
    height: Ext.getBody().getViewSize().height - 150,
    width: Ext.getBody().getViewSize().width - 240,
    % }
    listeners: {
    afterrender: function(grid) {
    if (!columnSetting && <% $fetch_data_from_server || 0 |h%>) {
    grid.getStore().guaranteeRange(0, <% $display_size |n%>);
    }
    else if (filterSetting) {
    // This is use to set filter icon when page get reload
    grid.filters.createFilters();
    }
    },
    columnhide: function(columns, column, opt) {
    if (Ext.getCmp(columns.container.id)) {
    var columnStruc = columns.items.items;
    if (Ext.getCmp(gridId).filters.getFilterData()[0]) {
    filterSetting = createFilterSetting(Ext.getCmp(gridId).filters.getFilterData());
    columnStruc[0]['filterSetting'] = filterSetting;
    }
    bx.extStateful.saveState(columns.container.id, columnStruc, <% $uid |n%>, 'PUT');
    }
    },
    columnshow: function(columns, column, opt) {
    if (Ext.getCmp(columns.container.id)) {
    var columnStruc = columns.items.items;
    if (Ext.getCmp(gridId).filters.getFilterData()[0]) {
    filterSetting = createFilterSetting(Ext.getCmp(gridId).filters.getFilterData());
    columnStruc[0]['filterSetting'] = filterSetting;
    }
    bx.extStateful.saveState(columns.container.id, columnStruc, <% $uid |n%>, 'PUT')
    }
    }
    }
    });


    Weather I required to add some parameters in filters_config or any other way to add autocomplete functionality.I want autocomplete means when i type a letter in filter textbox of grid panel, related search list according to that letter is needed to displayed.

    thanks!!!

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar