Results 1 to 8 of 8

Thread: ComboBox autocomplete with local mode - substring search instead of prefix match

  1. #1
    Ext JS Premium Member
    Join Date
    Nov 2008
    Location
    Warsaw area, Poland
    Posts
    64
    Vote Rating
    1
      0  

    Default Answered: ComboBox autocomplete with local mode - substring search instead of prefix match

    Hi, I have a combobox configured for autocompletion in queryMode: "local":

    Code:
    editor: {xtype: 'combobox', store: dataSrcSt, valueField: 'Id', displayField: 'Description', allowBlank: false, queryMode: 'local', typeAhead: true, minChars: 2}
    And the autocomplete seems to work - it matches a correct entry if a prefix of the display value is entered. But what should I do to filter the entries by matching a substring anywhere in the display value ( 'displayValue like *typedText*', not 'like typedText*')

    ExtJS 4.1

    Thanks
    RG

  2. You can try this:
    PHP Code:
    Ext.onReady(function() {

    var 
    simpleCombo Ext.create('Ext.form.field.ComboBox', {
      
    fieldLabel'Select a single state',
      
    displayField'name',
      
    valueField'abbr',
      
    width320,
      
    labelWidth130,
      
    queryMode'local',
      
    typeAheadtrue,
      
    minChars2,
      
    name'agentDownline',
      
    store: new Ext.data.SimpleStore({
          
    fields: ['abbr''name''slogan'],
          
    data: [
            [
    'VA''Virginia',      'Mother of States'],
            [
    'WA''Washington',    'Green Tree State'],
            [
    'WV''West Virginia''Mountain State'],
            [
    'WI''Wisconsin',     'America\'s Dairyland'], 
            [
    'WY''Wyoming',       'Like No Place on Earth']
          ]
      }),
      
    listeners: {
        
    buffer50,
        
    change: function() {
          var 
    store this.store;
          
    //store.suspendEvents();
          
    store.clearFilter();
          
    //store.resumeEvents();
          
    store.filter({
              
    property'name',
              
    anyMatchtrue,
              
    value   this.getValue()
          });
        }
      }
    });

    Ext.create("Ext.Window", {
        
    itemssimpleCombo
    }).show(); 
    Is that what you are looking for?

  3. #2
    Sencha User
    Join Date
    Oct 2011
    Location
    Ukraine
    Posts
    154
    Answers
    11
    Vote Rating
    8
      0  

    Default Hii

    You can try this:
    PHP Code:
    Ext.onReady(function() {

    var 
    simpleCombo Ext.create('Ext.form.field.ComboBox', {
      
    fieldLabel'Select a single state',
      
    displayField'name',
      
    valueField'abbr',
      
    width320,
      
    labelWidth130,
      
    queryMode'local',
      
    typeAheadtrue,
      
    minChars2,
      
    name'agentDownline',
      
    store: new Ext.data.SimpleStore({
          
    fields: ['abbr''name''slogan'],
          
    data: [
            [
    'VA''Virginia',      'Mother of States'],
            [
    'WA''Washington',    'Green Tree State'],
            [
    'WV''West Virginia''Mountain State'],
            [
    'WI''Wisconsin',     'America\'s Dairyland'], 
            [
    'WY''Wyoming',       'Like No Place on Earth']
          ]
      }),
      
    listeners: {
        
    buffer50,
        
    change: function() {
          var 
    store this.store;
          
    //store.suspendEvents();
          
    store.clearFilter();
          
    //store.resumeEvents();
          
    store.filter({
              
    property'name',
              
    anyMatchtrue,
              
    value   this.getValue()
          });
        }
      }
    });

    Ext.create("Ext.Window", {
        
    itemssimpleCombo
    }).show(); 
    Is that what you are looking for?

  4. #3
    Ext JS Premium Member
    Join Date
    Nov 2008
    Location
    Warsaw area, Poland
    Posts
    64
    Vote Rating
    1
      1  

    Default

    Yes, that's the solution. Thanks!

  5. #4
    Sencha User kitteh's Avatar
    Join Date
    Jul 2013
    Posts
    1
    Vote Rating
    0
      0  

    Default THANKS

    Thanks from me too, it helped me alot!!!

  6. #5
    Sencha User jdflores's Avatar
    Join Date
    Aug 2011
    Posts
    18
    Vote Rating
    3
      1  

    Default Try enableRegEx

    The combobox has an extra property as of 4.1.3, it's called 'enableRegEx'. If the mode is local it will do the matching without having to listen for a change in this field.

  7. #6
    Sencha User
    Join Date
    May 2014
    Posts
    5
    Vote Rating
    0
      0  

    Default Autocomplete works with enableRegEx but filtering does not.

    Quote Originally Posted by jdflores View Post
    The combobox has an extra property as of 4.1.3, it's called 'enableRegEx'. If the mode is local it will do the matching without having to listen for a change in this field.

    I set enableRegEx to true and autocomplete works fine but it does not filter the combobox content. Is there any way to fix this?

  8. #7
    Ext JS Premium Member
    Join Date
    Sep 2011
    Posts
    23
    Vote Rating
    0
      0  

    Default

    I see it getting filtered, but it disappears right away, so I can't select the value. Im using 4.0.7 and tested your example, does the same.

  9. #8
    Sencha User
    Join Date
    Aug 2015
    Posts
    1
    Vote Rating
    0
      0  

    Default really nice

    really nice thank you-i need for combo multi select

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •