搜索即用型Combobox

时间:2015-07-06 15:30:04

标签: php search extjs combobox

我对PHP编码完全陌生,具有html的基本知识。

尽管如此,我还是获得了simple改进网站公司表单页面的任务。它是用PHP编写的,你可能已经意识到了。

其中一项任务包括添加'搜索即用型'功能到包含供应商列表的文本输入组合框。从我的代码分析,我相信这个技巧应该在这段代码中实现:

 var storeSupplier = new Ext.data.JsonStore({
     url: 'php/selectSupplier.php',
     root: 'results',
     fields: ['idSupplier', 'nameSupplier']
 });

 selectSupplier = new Ext.form.ComboBox({
     width: 250,
     xtype: 'combo',
     mode: 'remote',
     triggerAction: 'all',
     editable: false,

     fieldLabel: 'Supplier',
     name: 'nameSupplier',
     displayField: 'nameSupplier',
     valueField: 'idSupplier',
     hiddenName: 'idSupplier',
     store: storeSupplier
 });

我已经查看了一些php文档和其他解决方案,但我无法理解也无法适应我的情况。我得到的最接近的是this Q& A,这似乎是我的编码,但他们并不是在谈论搜索和匹配值; this示例显示了我想要实现的内容(只是"开始使用"选项将是完美的)和this文档,它提供了一些有趣的方法,如FindRecordByValue(value) ,但我不知道如何正确使用它。

任何帮助将不胜感激。 欢呼声,

- 更新 - :

我注意到我的表单中的其他一些字段已经具有这种过滤功能。在上述情况下我无法做同样事情的原因是因为mode:远程status. The ones that are working are stated as模式:local

当我尝试以下方法时,我根本没有显示任何值:

listeners: {
    'keyup': function() {
        this.store.filter('nameSupplier', this.getRawValue(), true, false);
    },
    'beforequery': function(queryEvent) {
        queryEvent.combo.onLoad();
        queryEvent.combo.expand();
        // prevent doQuery from firing and clearing out my filter.
        return false;
    }
}

1 个答案:

答案 0 :(得分:0)

老实说,我仍然想知道它为什么会起作用,但是,我已经设法通过在我正在使用的商店的声明中添加以下代码行来解决问题。:

var storeSupplier = new Ext.data.JsonStore({
        url: 'php/selectSupplier.php', 
        autoLoad: true, // <<<<<<<<<<<<<<<<<<<ADDED THIS LINE
        root: 'results', 
        fields: ['idSupplier','nameSupplier']
});

selectSupplier = new Ext.form.ComboBox({
        width:          250,
        xtype:          'combo',
        mode:           'remote',
        triggerAction:  'all',
        editable:       true, // <<<<<<<<<<<<<<<<<<CHANGED THIS ONE

        fieldLabel:     'Supplier',
        name:           'nameSupplier',
        displayField:   'nameSupplier',
        valueField:     'idSupplier',
        hiddenName:     'idSupplier',
        store:  storeSupplier

});