PDA

View Full Version : How set default value in Combobox for ext4.1



mmuruev
27 Sep 2012, 3:48 AM
Hello,
I know that this is problem present in api description but I use value field without any visible improvement
:-? . I have my values in FireBug but I still can't see this values in combobox field it just empty as JSON from it.

autoSelect:false, value: [{name: 'AAAA'}],
displayField:'name',
valueField:'name',
listeners:{
afterrender:{
fn: function(elem)
{
console.log('call ->>AAA');
elem.setValue('AAAA');
}
}
}

Also autoSelect working in very strange way it select only if I open list by mouse not put value as default. Is this ok? Because it no that I expected.

danguba
27 Sep 2012, 4:39 AM
Have you tried
value: 'AAAA'

mmuruev
27 Sep 2012, 5:28 AM
Yes, I did. First time I just make as was mention in official doc and after starting experiments but not succeed.

danguba
27 Sep 2012, 6:52 AM
Hmmm... strange... using value: 'AAAA' works for me.... Can you post more code?

mmuruev
27 Sep 2012, 7:46 AM
Yes, I can. Which part of code may be useful?

danguba
28 Sep 2012, 12:10 AM
Could you make some kind of example with that weird behavior that I could just copy and test it on my computer?

mmuruev
28 Sep 2012, 3:45 AM
Problem is then I test part of my code at http://jsfiddle.net (http://jsfiddle.net/) it just work properly and I can see value from value: .:-? Actually code with listeners work too on jsfiddle. Any Ideas? Is possible that CSS can make this weirdness.

danguba
28 Sep 2012, 5:16 AM
I don't think CSS could cause it. It is more likely that you are overriding combobox default behavior somewhere.

mmuruev
28 Sep 2012, 5:33 AM
https://gist.github.com/3799868 here is my form code. with combobox.

danguba
30 Sep 2012, 9:56 PM
Just tried it and everything worked as it should

mmuruev
30 Sep 2012, 10:04 PM
:-?Strange.

danguba
30 Sep 2012, 10:12 PM
I agree :) My best guess is that you are overriding combobox default behavior somewhere (probably in some other files you are loading)

mmuruev
30 Sep 2012, 11:41 PM
Just checked without external css. The same reaction not appear value

danguba
30 Sep 2012, 11:58 PM
Yeah. I was almost certain CSS is not causing it.

mmuruev
2 Oct 2012, 2:51 AM
I think I've found source of the problem this peace of code

var grid = Ext.create('Ext.grid.Panel', {
height:500,
layout:'fit',
renderTo:Ext.Element.get('table_apache_config'),
frame:false,
title:'VirtualHosts',
store:store,
listeners:{
itemdblclick:function (grid, record, item, index, event) {
var row = grid.getStore().getAt(index);
windowFormHandler(row);
}
},
columns:[
{
xtype:'actioncolumn',
width:30,
sortable:false,
items:[
{
icon:'icons/edit-button.png',
tooltip:'Information',
handler:function (grid, rowIndex, colIndex) {
var row = grid.getStore().getAt(rowIndex);
windowFormHandler(row);
}
}
]
},


{
header:'IP',
width:120,
sortable:true,
dataIndex:'ip',
field:{
xtype:'textfield'
}
}


],
dockedItems:[
{
xtype:'toolbar',
items:[
{
text:'Add',
iconCls:'icon-add',
handler:function () {
// empty record
store.insert(0, new Apache_config());
//rowEditing.startEdit(0, 0);
windowFormHandler(store.getAt(0));
}
},
'-',
{
itemId:'delete',
text:'Delete',
iconCls:'icon-delete',
disabled:true,
handler:function () {
var selection = grid.getView().getSelectionModel().getSelection()[0];
if (selection) {
store.remove(selection);
}
}
}
]
}
]
});


grid.getSelectionModel().on('selectionchange', function (selModel, selections) {


grid.down('#delete').setDisabled(selections.length === 0);
});
Problem is here
// empty record
store.insert(0, new Apache_config());
//rowEditing.startEdit(0, 0);
windowFormHandler(store.getAt(0)); If I just create widndowFormHandler(); I have my default value in the combo. Also this code give me second problem because windowFormHandler is pop up modal window with form
/* Window with form for Edit Apache config storage
*/
var windowFormHandler = function (row) {


var formWindow = Ext.create('Ext.window.Window', {
//padding: '0 0 0 20',
width:400,
autoHeight:true,
id:'formWindow',
layout:'fit',
modal:true,
renderTo:Ext.getBody(),
listeners:{
beforeclose:function (panel) {
// check any logical conditions here, then
// return true to allow the window to close
// or false to keep it open.
//store.remove(store.getAt(0));
return true;
}
},
items:[
{
itemId:'form',
xtype:'writerform',
listeners:{
create:function (form, data) {
store.insert(0, data);
}
}
}
]
});
formWindow.child('#form').setActiveRecord(row || null);
formWindow.show();




};, If I call it an just close window I will have empty record in my store. This code I took from official examples but it was not for window. I think it's just design problem. Any advice how to improve this code? I mean without empty new object it not working.
Update:
I found why I use this strange because it was only way for add new record. But it have another and problem in
onCreate:function () { var form = this.getForm();


if (form.isValid()) {
this.fireEvent('create', this, form.getValues());
form.reset();
Ext.getCmp('formWindow').close();
}


} This event create not fired up. Handler not call

items:[ {
itemId:'form',
xtype:'writerform',
listeners:{
create:function (form, data) {
store.insert(0, data);
}
}
}
] :-/

mmuruev
3 Oct 2012, 12:34 AM
I think I resolve the problem. :D

listeners:{

'create':function (form, data) {
var record = new Apache_config();
data.updateRecord(record);
store.add(record);
},


'validitychange':function (th, isvalid, eOpts) {
if (isvalid) {
this.down('#save').enable();
this.down('#create').enable();
}
else {
this.down('#save').disable();
this.down('#create').disable();
}
} Not sure only about data.updateRecord() may be exist another way? But this is working.