-->

extjs: How to l set value for combobox when loadin

2020-03-26 02:03发布

问题:

  1. I am looking for a load listener, that when the combobox is up, load will be called and preform an ajax to the server to take the correct display value for the combobox. But, load function is never called.. how can i fix it ?

  2. I want to display a text before the combobox, so i added the attribute fieldLabel: 'Save logs to:'. But the text is not displayed.

Thx, Yoni

this.log_save_combo = new Ext.form.ComboBox
    ({
        store: ['Device', 'USB1', 'USB2']
        , id: 'cplogs_log_save_combo'
        , name: 'cplogs_log_save_combo'
        , triggerAction:'all'
        , fieldLabel: 'Save logs to:'
        , editable: false
        //, value: "Device"
        , listeners: {
                'load': function(){
                        alert("in load function");
              }
    });

回答1:

There is no load event for a combo.. hence the code you wrote is not getting executed. You already have a store defined with values.. are you trying to load new values to the store that is attached to the combo box? What do you mean by "combobox is up"?

To load a combo box with values from the server, you only need to load the store. Refer to this article on how to load the combobox.

----------------------------------------- UPDATE -----------------------------------------

  1. Are you trying to load a form with values? In that case you can load the values using the load method available with the BasicFrom. Refer to this example. Even though it uses XML you can easily change to load data from JSON.

  2. In order to display label field, you need to set your layout property of your container as

    layout: 'form'



回答2:

As a general solution to the problem, I've gone with

listeners:{
    scope: this,
    afterRender: this.selectFirstComboItem
}

with

selectFirstComboItem: function(combo) {
    // This will tell us if the combo box has loaded at least once
    if (typeof combo.getStore().lastOptions !== "undefined") {
        // Grab the first value from the store
        combo.setValue(combo.getStore().first().get(combo.valueField));
    }
    else {
        // When the store loads
        combo.getStore().on("load", function(store, items){
            // Grab the first item of the newly loaded data
            combo.setValue(items[0].get(combo.valueField));
        });
    }
}


回答3:

One of the things that I have wanted to do is have a default value from the store be selected when the combobox is rendered. Setting the combo box value to the first value from the store has worked pretty well.

Ext.create('Ext.form.field.ComboBox', {
...
value : this.myStore.first().get('aFieldName')


回答4:

  1. First Load the store with store.load()
  2. In the callback set the value with setValue()

Example:

store.load({
        callback: function () {
             form.findField('name_of_the_combo').setValue('your_value');
         }
    });


回答5:

There is no load event for combo. What you can do is load the data in the combo from store on load of your form. After that you can set the field level on select event of combo.

Example:

listeners:{
    select: function(){
       Ext.getCmp('id_of_the_field')
      .getEl()
      .down('label.x-form-cb-label')
      .update('Save logs to:');                             
    }
}