Live Search Combo Box Isn't Working ExtJS 4.2.1

Eldwin Eldwin

I'm not sure what's wrong with my code. However after I type 4 characters on combobox, all of value will be displayed, not filtered based on characters that I have typed. Because of that my live search is broken. Please see attached image for better illustration.

Illustration Image

I'm creating combobox inside panel as one of item

    {
        xtype: 'combobox',
        fieldLabel: 'Guest Name',
        padding: '10px 10px 20px 10px',
        allowBlank: false,
        id: 'guest_id_payment',
        name: 'guest_id',
        // Template for the dropdown menu.
        // Note the use of "x-boundlist-item" class,
        // this is required to make the items selectable.
        tpl: Ext.create('Ext.XTemplate',
            '<tpl for=".">',
                '<div class="x-boundlist-item">{identity_number} - {name}</div>',
            '</tpl>'
        ),
        // template for the content inside text field
        displayTpl: Ext.create('Ext.XTemplate',
            '<tpl for=".">',
                '{identity_number} - {name}',
            '</tpl>'
        ),
        valueField: 'identity_number',
        store: 'SGuest',
        height: 20,
        queryMode: 'remote'
    }

This is the store:

Ext.define('ghb.store.SGuest', {
extend: 'Ext.data.Store',
model: 'ghb.model.MGuest',
autoLoad: true,
autoSync: true,

proxy: {
    pageParam: false,
    startParam: false,
    limitParam: false, 

    type: 'ajax',
    api: {
        create: '/ghb_manager/add_guest',
        read: '/ghb_manager/data_guest',
        update: '/ghb_manager/edit_guest',
        destroy: '/ghb_manager/delete_guest'
    },
    reader: {
        type: 'json',
        root: 'data'
    },
    writer: {
        type: 'json',
        encode: true,
        writeAllFields: true,
        root: 'data'
    },
    root: 'data'
}
});

I'm also add change event listener

       '#guest_id_payment':{
            change: this.changeGuestCombo
        },

This is the function of change event listener, loading another store (not the store of ComboBox)

changeGuestCombo: function(self, newValue, oldValue, eOpts){
    var store = Ext.getStore('SReservation');
    store.load({
        params: {
            data: self.getValue(),
        }
    });
},

N.B. I'm using 4.2.1

Eldwin Eldwin

I found the problem. When we use tpl & displayTpl on Combobox, the livesearch feature won't work

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

Live Search Combo Box Isn't Working ExtJS 4.2.1

From Dev

Why Isn't My 2D Box Collider Working?

From Dev

Why Isn't My 2D Box Collider Working?

From Dev

CodeKit Live Refresh Isn't Working

From Dev

CodeKit Live Refresh Isn't Working

From Dev

Can´t load store of a combo in ExtJS4

From Dev

Why isn't box-shadow working?

From Dev

ExtJS grid combo renderer not working

From Dev

Datepicker isn't working inside search popup

From Dev

Unity GUI combo box with search

From Dev

ExtJs 3.4 : Set tool tip for combo box

From Dev

Display combo box when checkbox is checked - Extjs

From Dev

Dynamic store not loading data in combo box extjs

From Dev

Extjs how to add close icon to the combo box

From Dev

ExtJs 3.4 : Set tool tip for combo box

From Dev

dynamically change the combo box store in extjs

From Dev

My custom WebStorm Live Template isn't working

From Dev

Why isn't persistence working on Lubuntu 12.04 Live-USB?

From Dev

Extjs how to remove and undo list items from extjs combo box

From Dev

How to disable form2 combo boxes based on form1 combo box value?

From Dev

Swift 4 - The background function isn't working

From Dev

Live search combo in Ext JS 4.2.2

From Dev

Problems with BindlingList<T> and combo box

From Dev

Why my dialog box isn't working out?

From Dev

Select box as category filter isn't working on Chrome, IE.

From Dev

select2 search box dropdown not working

From Dev

Search for file in folder1 and execute a script if that file isn't in folder2

From Dev

Angular 2 AsynPipe isn't working with an Observable

From Dev

maximumSelectionSize isn't working in Select2