Question

我有一个ExrJs组合。

new Ext.form.ComboBox({
        //store : myStore,
        //displayField : 'code',
        //valueField : 'code',
        fieldLabel : 'Tour Code',
        id : 'idTourCode',
        //allowBlank : false,
        typeAhead : true,
        forceSelection : true,
        mode : 'local',
        triggerAction : 'all',
        selectOnFocus : true,
        editable : false,
        hidden : false,
        disabled : true,
        minChars : 1,
        hideLabel : true,
        style : 'marginleft:10px',
        width : 361,
        emptyText : 'Tour Code'
        //flex : 1
    });

我发送一个Ajax请求并从postgresql数据库中检索数据，并尝试将此响应设置为组合的存储，如下所示。

var jsonData = Ext.util.JSON.decode(response.responseText);
                            console.log(jsonData);
                            if (jsonData.tourRef.length > 0) {
                                Ext.getCmp('idTourCode').bindStore(jsonData.tourRef);
                                Ext.getCmp('idTourCode').setRawValue(jsonData.tourRef.code);
                                Ext.getCmp('idTourCode').setHiddenValue(jsonData.tourRef.code);
                            }

我的回答是这样的。

{'tourRef':[{ 'code' : '16/01/2014 17:31:03-ROUTE 5(COLOMBO 08,10)' } , { 'code' : '21/01/2014 10:27:54-ROUTE 5(COLOMBO 08,10)' }  ]}

现在组合有两个空行，firebug控制台说 Ext.getCmp（'idTourCode'）。setHiddenValue（jsonData.tourRef.code）;

我正在使用ExtJs 3.4

我的代码有什么问题，我该如何解决？

亲切的问候

Ext.Ajax.request({
                          method: 'GET',
                          loadMask: true,
                          scope: this,
                          url: "http://" + host + "/" + projectName + "/"
                                + "TourReference",
                          success: function (response, request) {
                            Ext.MessageBox.alert('success', response.responseText);
                            var jsonData = Ext.util.JSON.decode(response.responseText);
                            console.log(jsonData);
                            if (jsonData.tourRef.length > 0) {
                                Ext.getCmp('idTourCode').bindStore(jsonData.tourRef);
                                Ext.getCmp('idTourCode').setRawValue(jsonData.tourRef.code);
                                Ext.getCmp('idTourCode').setHiddenValue(jsonData.tourRef.code);
                            }
                            Ext.Msg.show({
                                  title: 'Success',
                                  msg: 'success',
                                  buttons: Ext.MessageBox.OK,
                                  icon: Ext.MessageBox.INFO
                            });

                          },
                          failure: function (response, request) {
                            Ext.MessageBox.alert('failure', response.responseText);
                            Ext.Msg.show({
                                  title: 'Error',
                                  msg: 'error',
                                  buttons: Ext.MessageBox.OK,
                                  icon: Ext.MessageBox.ERROR
                            });
                          },
                          params : {
                            dateFrom : Ext.getCmp('fromDateCombo').getValue(),
                            dateTo : Ext.getCmp('toDateCombo').getValue(),

                          }
                     });

Answer 1

以下代码可以解决您的问题。对不起我在评论中的英语不好。

var host = '127.0.0.1',
    projectName = 'superTours';

new Ext.form.ComboBox({
    typeAhead : true,
    id: 'idTourCode', // this is VERY VERY bad. Try to don't use 'id' anywhere
    forceSelection : true,
    mode : 'local',
    triggerAction : 'all',
    selectOnFocus : true,
    editable : false,
    mode : 'local',
    triggerAction : 'all',
    disabled : true,
    hideLabel : true,
    style : 'marginleft: 10px;',
    width : 361,
    emptyText : 'Select a Tour Code',
    /* very important params below */
    valueField: 'code',
    displayField: 'code',
    store: {
        xtype: 'jsonstore',
        autoLoad: false, // I set this parameter to false to prevent automatical load data to store after combo render
        url: 'http://' + host + '/' + projectName + '/' + 'TourReference',
        root: 'tourRef',
        fields: [ 'code' ],
        listeners: {
            load: function(store, records, options) {
                console.log('Combo store: data loaded');
            },
            loadexception: function() {
                // error while loading data
                console.log(arguments);
            }
        }
    }
});

我可以看到，你的组合必须被禁用。使用商店参数'autoLoad：false'，在您想要之前不会加载它。

如果要将日期发送到脚本，则应从日期字段中删除“更改”和“选择”侦听器，然后添加“显示”按钮。此按钮将日期字段参数发送到服务器。将此代码添加到按钮的处理程序：

handler:function(Btn) {
    var datefrom = Ext.getCmp('fromDateCombo').getValue(),
        dateto = Ext.getCmp('toDateCombo').getValue();
    Ext.getCmp('idTourCode').enable();
    Ext.getCmp('idTourCode').getStore().reload({
        params: {
            dateFrom: datefrom,
            dateTo: dateto
        }
    });
}

ExtJS 3.4：从ajax响应中设置组合商店

1 个答案: