PDA

View Full Version : Using transform, combo only loads first item



evant
12 Jun 2007, 12:31 AM
See: http://www.bosweb.com.au/evan/test.html

The combo box only contains the first option from the transformed select. Am I doing something wrong here?

Also, the width on the drop down list is a little off.

Cheers,
Evan

tryanDLS
12 Jun 2007, 8:22 AM
You didn't specify a triggerAction, so the default is 'query', which in this case just shows the first value. Try using triggerAction:'all'.

The alignment issue is occurring b/c you're input tag has no left padding or margin and the dropdown gets automatically padded left:5px. You can also see this in the combo example if you change example.css to body padding:0. Not sure how this offset is being calculated, that it causes it to align correctly if there's left padding > 0. Have to look a further into that.

aek82
14 Aug 2007, 7:01 PM
I ran into a similar problem, albeit the situation that caused this problem was different. I added another function to the load event for a combobox's data store, however, after executing the function, I needed to remove that load event so it wouldn't execute again when the combobox was reloaded. (load function once, then throw away. I couldn't figure out a different way to tie an asychronous server side call to the load event.)

I tried a few times removing the function reference with the 'combobox.un()' function, but I couldn't get that to work. I ended up calling 'combobox.store.events['load'].clearListeners()'. This resulted in a problem described above.

To correct the problem, I ended up re initializing the data store and assigning it to the combo box.

The following code is really weird, but this is how I got it working:



var fs_widget;
var widgetqueryds;

function getwidgets(){
comboBoxwidgetds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: baseurl + "admin/widgetdata/widget/"
}),
reader: getwidgetsReader()
});

initwidgetEvent();

comboBoxwidgetds.load();

return comboBoxwidgetds;
}

function getwidgetsReader(){
var ret = new Ext.data.JsonReader({
root: 'widget',
totalProperty: 'total'
}, [
{name: 'id'},
{name: 'name'},
]);

return ret;
}

function initwidgetEvent()
{
comboBoxwidgetds.on('beforeload', function(){

});
}

function initComboBo()
{
fs_widget = new Ext.form.ComboBo{
store: getwidgets(),
displayField: 'name',
valueField: 'id',
triggerAction: 'all',
mode: 'remote',
emptyText: 'widgets',
width: 200,
name: 'fs_widget',
fieldLabel: 'widget',
editable: false,
hiddenName: 'fs_widget_hidden',
allowBlank: false
});
}

function initwidgetQueryDS(){
widgetqueryds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: baseurl + "admin/widgetdata/widgetquery/"
}),
reader: getwidgetQueryReader()
});

widgetqueryds.on('beforeload', function(){

if(querywidgetid)
{
widgetqueryds.baseParams = {

widgetid: querywidgetid
};
}

});

widgetqueryds.on('load', function(){

var record = widgetqueryds.getAt(0)

if(record)
{

fs_widget.store.on('load', function(){
fs_widget.setValue(record.data.pk, true);

resetYMMTListeners(record);
});
}

});

widgetqueryds.load()
}

function resetYMMTListeners(record)
{

fs_widget.store.events['load'].clearListeners();

record = null;

reInitStoreLoad(fs_widget, getwidgets());

}

function getwidgetQueryReader(){
var ret = new Ext.data.JsonReader({
root: 'widget',
totalProperty: 'total',
id: 'pk'
}, [
{name: 'pk'},
{name: 'part', mapping: 'fields.part'},
]);

return ret;
}


function reInitStoreLoad(combo, store)
{
if(store)
{
combo.store = store;
}
}


The two functions that accomplish resetting the data store to the combobox is called in resetYMMTListeners() and reInitStoreLoad().

All this does is clear the load listeners and reinitalize the data store which is returned by getWidgets().

-Alex

mystix
14 Aug 2007, 7:23 PM
load function once, then throw away.

to do that, just use the {single:true} config like so


myCombo.on('select', myFunctionReference, this, {single:true});