trying to select combobox's item with onclick instead dbclick [Extjs]

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • isirdiego
    New Member
    • Mar 2016
    • 1

    trying to select combobox's item with onclick instead dbclick [Extjs]

    i'm trying to select my combobox items with only one click, but, when clicked once, this doesn't works, just when i click two times this has been selected, but i don't need that. But, here's an interesting (weird) thing, sometimes works with one click and other times with the double click.

    here's my code:

    Code:
    items: [{
        xtype: 'combo',
        anchor: '100%',
        padding: 10,
        fieldLabel: 'Type',
        name: 'fieldType',
        labelStyle: "font-weight:bold;",
        store: new Ext.data.Store({
            fields: [{
                name: 'description',
                type: 'string'
            }, {
                name: 'name',
                type: 'string'
            }, {
                name: 'uuid',
                type: 'string'
            }],
            autoLoad: true,
            hideTrigger: true,
            minChars: 1,
            triggerAction: 'query',
            typeAhead: true,
            proxy: {
                type: 'ajax',
                url: "../",
                extraParams: {
                    action: "catalog",
                    catalog: "fieldtypeoptions",
                    params: JSON.stringify({
                        uuidToken: Ext.connectionToken
                    })
                },
                reader: {
                    type: 'json',
                    root: 'dataTypesList'
                },
                listeners: {
                    exception: function(proxy, response, operation, eOpts) {
                        var responseArray = JSON.parse(response.responseText);
                        Ext.Notify.msg(responseArray.message, {
                            layout: "bottomright",
                            delay: 5000,
                            type: "error"
                        });
                    }
                },
            }
        }),
        typeAhead: true,
        triggerAction: 'all',
        valueField: 'uuid',
        displayField: 'description',
        listeners: {
            change: function(combo, value) {
                console.log(value);
                console.log(combo);
                console.log(combo.getValue());
            },
            click: function() {
                alert('One click event');
            }
        },
        element: 'combo'
    }, {
        xtype: 'fieldcontainer',
        anchor: "100%",
        layout: 'hbox',
        padding: 10,
        fieldDefaults: {
            msgTarget: 'under',
            labelAlign: 'top'
        },
        items: [{
            xtype: 'numberfield',
            minValue: 0,
            maxValue: 100,
            emptyText: 'Length',
            name: 'length',
            allowBlank: false,
            flex: 1,
            listeners: {
                afterrender: function(field) {
                    Ext.create('Ext.tip.ToolTip', {
                        target: field.getId(),
                        html: 'Length'
                    });
                }
            }
        }, {
            xtype: 'numberfield',
            emptyText: 'Decimal',
            name: 'decimal',
            minValue: 0,
            allowBlank: false,
            maxValue: 100,
            flex: 1,
            listeners: {
                afterrender: function(field) {
                    Ext.create('Ext.tip.ToolTip', {
                        target: field.getId(),
                        html: 'Decimal'
                    });
                }
            }
        }]
    }]
    
    
    i'm trying to select my combobox items with only one click, but, when clicked once, this doesn't works, just when i click two times this has been selected, but i don't need that. But, here's an interesting (weird) thing, sometimes works with one click and other times with the double click.
    
    here's my code:
    
        items: [{
        xtype: 'combo',
        anchor: '100%',
        padding: 10,
        fieldLabel: 'Type',
        name: 'fieldType',
        labelStyle: "font-weight:bold;",
        store: new Ext.data.Store({
            fields: [{
                name: 'description',
                type: 'string'
            }, {
                name: 'name',
                type: 'string'
            }, {
                name: 'uuid',
                type: 'string'
            }],
            autoLoad: true,
            hideTrigger: true,
            minChars: 1,
            triggerAction: 'query',
            typeAhead: true,
            proxy: {
                type: 'ajax',
                url: "../",
                extraParams: {
                    action: "catalog",
                    catalog: "fieldtypeoptions",
                    params: JSON.stringify({
                        uuidToken: Ext.connectionToken
                    })
                },
                reader: {
                    type: 'json',
                    root: 'dataTypesList'
                },
                listeners: {
                    exception: function(proxy, response, operation, eOpts) {
                        var responseArray = JSON.parse(response.responseText);
                        Ext.Notify.msg(responseArray.message, {
                            layout: "bottomright",
                            delay: 5000,
                            type: "error"
                        });
                    }
                },
            }
        }),
        typeAhead: true,
        triggerAction: 'all',
        valueField: 'uuid',
        displayField: 'description',
        listeners: {
            change: function(combo, value) {
                console.log(value);
                console.log(combo);
                console.log(combo.getValue());
            },
            click: function() {
                alert('One click event');
            }
        },
        element: 'combo'
    }, {
        xtype: 'fieldcontainer',
        anchor: "100%",
        layout: 'hbox',
        padding: 10,
        fieldDefaults: {
            msgTarget: 'under',
            labelAlign: 'top'
        },
        items: [{
            xtype: 'numberfield',
            minValue: 0,
            maxValue: 100,
            emptyText: 'Length',
            name: 'length',
            allowBlank: false,
            flex: 1,
            listeners: {
                afterrender: function(field) {
                    Ext.create('Ext.tip.ToolTip', {
                        target: field.getId(),
                        html: 'Length'
                    });
                }
            }
        }, {
            xtype: 'numberfield',
            emptyText: 'Decimal',
            name: 'decimal',
            minValue: 0,
            allowBlank: false,
            maxValue: 100,
            flex: 1,
            listeners: {
                afterrender: function(field) {
                    Ext.create('Ext.tip.ToolTip', {
                        target: field.getId(),
                        html: 'Decimal'
                    });
                }
            }
        }]
    }]
    I'm a little newbie with extjs, so, i just don't know for what reason this is happening... so, if anyone can help me with this, i'll be very grateful!
    Last edited by Rabbit; Mar 28 '16, 08:27 PM. Reason: Please use [code] and [/code] tags when posting code or formatted data.
Working...