PDA

View Full Version : [4.1 beta 1] and [4.1 beta 2] combox wont hide when click a item



dedoz
29 Jan 2012, 2:17 PM
combox wont hide after selecting a item (click) (works when clicking 3 or 2 times but i guess that not the behavior expected)

4.1-pr1 : works
4.1 beta 1 : doesnt work
4.1 beta 2 : doesnt work



Ext.onReady(function() {
Ext.direct.Manager.addProvider(Ext.app.REMOTING_API);

Ext.define('model.ACR', {
extend: 'Ext.data.Model',
fields: [
{name:'acrId' ,type:'int'},
{name:'acrNom' ,type:'string'},
{name:'acrDesc' ,type:'string'}
],
idProperty: 'acrId',
proxy:
{ type: 'direct',
api:{read : acrDefaultQuery.acrSelect}
}
});

Ext.define('store.ACR', {
extend: 'Ext.data.Store',
model: 'model.ACR',
autoLoad: false
});

var acrStore = Ext.create('store.ACR');
acrStore.load();

Ext.define('combo.ACR', {
extend: 'Ext.form.ComboBox',
store : acrStore,
queryMode : 'local',
fieldLabel: 'Roles de usuario',
displayField: 'acrNom',
valueField : 'acrId',
width: 400
});

var acrCombo = Ext.create('combo.ACR',{
renderTo : Ext.getBody()
});
});


Ext js its too buggi, every month they release some new version (like the road from 4.0 to 4.0.6) with 3453457345 bugs fixed.

i cant use 4.0.7, it wont load on firefox with firebug open, theres some forum posts bout this. so i went 4.1-pr1.

cant use 4.1-pr1 it has a bug on table layout, (table layout was fine in 4.0.7 --- 4.1-pre1 broken --- 4.1 - beta 1 works again, fun stuff)

so i went 4.1-beta1, and now this combobox bug. and of course theres alot of bugs reported.

so i went 4.1-beta2 and there record.save() (such a common line) its broken, i reported this and it was accepted as a bug (the combobox is not working also)

at the moment its been a real bad experience, trying to use extjs to develop something. at least i didnt pay yet to use on commercial development ...

mitchellsimoens
30 Jan 2012, 7:13 AM
What browser are you using? I used this code on b1 and b2 using Chrome and Firefox and the list hide as expected:


var panel = new Ext.panel.Panel({
renderTo : document.body,
width : 400,
height : 400,
title : 'Test',
items : [
{
xtype : 'combobox',
fieldLabel : 'Test',
queryMode : 'local',
displayField : 'name',
valueField : 'name',
store : new Ext.data.Store({
fields : ['name'],
data : [
{ name : 'One' },
{ name : 'Two' },
{ name : 'Three' },
{ name : 'Four' },
{ name : 'Five' }
]
})
}
]
});

mitchellsimoens
30 Jan 2012, 7:14 AM
Also, you shouldn't use Ext.define within Ext.onReady

PHaroZ
30 Jan 2012, 7:16 AM
Perhaps it could be linked to http://www.sencha.com/forum/showthread.php?176485-comboBox-with-loadRawData

dedoz
31 Jan 2012, 8:15 PM
mitchell thats not the code i posted.
combobox works well when you static local data. im example is diferent

evant
31 Jan 2012, 9:13 PM
It shouldn't make any difference where the data comes from, once it's in the store the behaviour doesn't change.

It would be useful if you could post your full data and also the browser you're using.

Another thing to note is you're using a rather strange pattern for creating/extending. Probably doesn't make any difference in this case, but if you create multiple instances it means they will all share the same store instance.

ironandsteel
1 Feb 2012, 7:54 PM
I am seeing that I need to double-click to close the combobox, at least in my case. My combo is in dockeditems, and its store is loaded remotely. What is far worse though is that I am not consistently getting the change event. Earlier this evening I was getting it only the first time. At the moment I'm not getting it at all...

,{
xtype: 'combo'
,id: 'catComboID'
,hiddenName:"catCombo"
,store: catStore
,mode:'local'
,displayField:'display'
,cls: "catComboStyle"
,listConfig: {
width:'500',
loadingText: 'Loading...',
emptyText: 'No categories found.',
// Custom rendering template for each item
getInnerTpl: function() {
return '<div class="oneCatItem">{display}&nbsp({value})&nbsp<span class="catcount">{count}</span></div>';
}
}
,queryMode: 'local'
,typeAhead: true
,forceSelection:true
,emptyText: "ALL CATEGORIES"
,flex:1
,listeners:{"select":function(theCombo, theRecords)
{
var catCode = theRecords[0].data.value;
var selOnly = Ext.getCmp('checkedOnly').getValue();
this.ownerCt.ownerCt.store.clearFilter(false);
this.ownerCt.ownerCt.store.filter([
{id: "sel", property: "sel", value: selOnly },
{id: "catcode", property: "catcode", value: catCode}
]);
}
}
}

cold123
2 Feb 2012, 6:02 AM
don't do "arcStore.load();" and you will be fine :)

ironandsteel
2 Feb 2012, 6:26 AM
don't do "arcStore.load();" and you will be fine :)

I don't follow- i assume you are referring to my catStore, right. At the moment, I am prefetching it, and I have it set to autoload. How should I load it?


catStore.prefetch(
{
start: 0
,limit: 5000
});

cold123
2 Feb 2012, 6:32 AM
I don't follow- i assume you are referring to my catStore, right. At the moment, I am prefetching it, and I have it set to autoload. How should I load it?


catStore.prefetch(
{
start: 0
,limit: 5000
});


remove
catStore.prefetch();

in combo definition remove
mode:'local'
queryMode: 'local'

add
queryMode: 'remote'



or if you need to keep local mode use
queryMode: 'local'

but prefetch or load store after combo is created

dedoz
3 Feb 2012, 7:15 PM
yeah this works using queryMode : 'remote' but it if you already loaded the store ? there no reason to load it again, thats why im using querymode: local.

it seems like doing store.load() triggers some errors in combobox,
well for now ill be using queryMode : 'remote' only + not loading store before user clicks the combobox

dedoz
3 Feb 2012, 7:48 PM
Probably doesn't make any difference in this case, but if you create multiple instances it means they will all share the same store instance.

when you set the store in a component like store : 'someString'
it uses 1 single store instance, if im not wrong the only diference doing store: myStore Vs store : 'myStore' is that the first just set the store with that instance, the second will look for a instance with storeId : 'myStore' wich is the same.


as i know (and tested) this two codes are equivalent


var acrStore = Ext.create('store.ACR');
Ext.define('combo.ACR', {
extend: 'Ext.form.ComboBox',
store : acrStore,
... other configs ....
});




Ext.create('store.ACR',{storeId:'acrStore'});

Ext.define('combo.ACR', {
extend: 'Ext.form.ComboBox',
store : 'acrStore',
... other configs ....
});


setting the store in a component definition (Ext.define) means all instances of that componet will use the same instance of the store, doing store: 'myStore' doesnt mean 'myStore' points to store definition, means 'myStore' is a instance of a store which has its storeId set to 'myStore'.


(sorry for my english :d)

skirtle
6 Feb 2012, 12:18 AM
To use different instances of the store on each combobox you can do something like this:


Ext.define('MyStore', {
extend: 'Ext.data.Store',
alias: 'store.mystore',
...
});

Ext.define('combo.ACR', {
extend: 'Ext.form.field.ComboBox',
store: {type: 'mystore'},
...
});

dedoz
6 Feb 2012, 1:01 AM
very nice skirtle, where is the documentation for such declaration ? {type: "someStore"}

skirtle
6 Feb 2012, 2:14 AM
I'm not sure where it's documented. I found it in the code.

You can see the aliases for the standard store types in the docs. If, for example, you go to the ArrayStore docs you'll see it says 'store: array' at the top of the docs. That corresponds to this in the code:


Ext.define('Ext.data.ArrayStore', {
extend: 'Ext.data.Store',
alias: 'store.array',
...

dedoz
6 Feb 2012, 7:11 AM
yeah almost all Ext classes have alias, is just another name to use them, but that says nothing bout setting a store with a object that has a property type, didnt had time to test this, ill check later, thanks for your answer tho

whalethewise
7 Feb 2012, 9:08 AM
I have the same issue when I loadRawData into ComboBox store I need double click on item to select it and combobox doesnt fire any event after that.

Anybody know of any fix available?

Thanks

ironandsteel
7 Feb 2012, 9:12 AM
For some reason, if I use querymode remote, then my combo works ok. I see the loading mask on my dropdown list the first time, and it is cached thereafter. When I set it to querymode local, it was requiring a double-click to make a selection and close the window, and at some point in my code experiments, I was getting no select event at all. Something is messed up with combobox...

aw1zard2
7 Feb 2012, 9:50 AM
I'm just curious after you init the combobox if you do combobox.getStore().load(); does this behave normally or does the combobox do the double click to hide the list? Might also try the the getStore().load() in the onReady and see if it behaves the same.

I don't use the onReady no more in 4+ development, I use the launch for Applications.
I wouldn't use the onReady for defining the components just put them above it.
But I would use the onReady/launch for preloading combos and various things.

Since the Ext.onReady means all components are done initializing and dom/css is done.
After that you can load combo's, show screens, and etc. Even in 3.x I didn't set components in the onReady.

whalethewise
7 Feb 2012, 10:23 AM
I use loadRawData() on my store becasue chunk of data loaded with separate ajax call.

It was working in 4.0.7.

whalethewise
7 Feb 2012, 11:15 AM
the workaround for me is to use store's proxy's data field.
for memory proxy load() method of store uses proxy reader to read data from this field

store.getProxy().data = mydata;
store.load();