1. #1
    Ext User
    Join Date
    Nov 2008
    Posts
    17
    Vote Rating
    0
    nikhilwalker is on a distinguished road

      0  

    Default Using Auto Complete with ExtJS Text Field

    Using Auto Complete with ExtJS Text Field


    Hi All,

    I am looking for an example showing the usage of autocomplete feature of TextField. I want to use autocomplete feature to suggest different countries.

    I am referring the Combox examples at http://extjs.com/deploy/dev/examples/samples.html

    Or can any one provide me link or starting point

  2. #2
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    87
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    TextField doesn't have autocomplete support. Only ComboBox has, but you can make it look like a textfield by adding hideTrigger:true.

    ps. What is wrong with the combobox examples from the SDK? Don't they show you how to use the typeAhead config option?

  3. #3
    Ext User
    Join Date
    May 2008
    Posts
    1
    Vote Rating
    0
    jraq is on a distinguished road

      0  

    Default


    I have a question similar to nikhilwalker. I have implemented a combobox from the examples however, how would I go about being able to submit the typed it text and not be forced to select the first result. With the example from the SDK you are forced to select one of the items from the drop downs.

    My goal is to create search box as found at google. Typing provides hints, but you dont have to actually choose one.

    I tried 'forceSelection' but that defaults to false anyway. I'm new to ExtJS but my guess is that the reason i'm having trouble is that the example from the sdk uses the onSelect handler. Any help/suggestions would be greatly appreciated.

    I know I'm encouraged to post code but it really is directly from the combobox w/ templates example that searches this forum.

    Thanks
    -j

  4. #4
    Ext User
    Join Date
    Dec 2007
    Posts
    3
    Vote Rating
    0
    djdykes is on a distinguished road

      0  

    Default


    was a solution ever found to this?
    Posting the text entered rather then the actual value?

  5. #5
    Ext User
    Join Date
    Jul 2008
    Posts
    60
    Vote Rating
    0
    villemustonen is on a distinguished road

      0  

    Default


    I am also trying to implement this sort of TextField looking ComboBox. If the user types "met" and a match for "metallica" is found, and the user presses Enter, the value "met" should be in the field, instead of "Metallica". "Metallica" should only be chosen when the user presses the down-arrow key and implicitly selects it.

    I tried overwriting onTypeAhead() in ComboBox but this doesn't help.

  6. #6
    Ext JS Premium Member
    Join Date
    May 2009
    Posts
    22
    Vote Rating
    0
    peet is on a distinguished road

      0  

    Default


    send the entire contents of the combobox for each keystroke to the server (queryParam i think). On the server, parse out the last word, get suggestions, and send what was typed prepended to each suggestion. So they are not forced to select a suggested phrase, send the typed text as first choice.

  7. #7
    Sencha User
    Join Date
    Jan 2012
    Posts
    3
    Vote Rating
    0
    nani123 is on a distinguished road

      0  

    Default Ajax Request with Text field not return the json data

    Ajax Request with Text field not return the json data


    hi im facing one problem(http://dev.sencha.com/deploy/ext-4.0...um-search.html) for this example
    i created one text fied search for ajax using sencha php file its working fine(http://www.sencha.com/forum/topics-remote.php) .

    same file i copied and past it in local and save it as .php in server folder, it does not return the data, can any one plzz help me.. its urgent

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

      0  

    Default want autocomplete to filter box of grid panel

    want autocomplete to filter box of grid panel


    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!!!

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi