PDA

View Full Version : How do i get at the checkbox?



Elijah
22 Mar 2010, 6:59 PM
If i have a form
var loginForm = new Ext.FormPanel({...
and a checkbox
{
xtype: 'checkbox',
fieldLabel: 'Remember location',
name: 'pref_location'
}

How can I in the handler:function(){.. get at the checkbox?

Syntax please.

been looking for over an hour. loginForm.pref_location.checked does not work yes been looking in the API but as always I cant find what I think I am looking for.

Elijah
23 Mar 2010, 5:55 AM
update.

Okay so I needed to add an id for the checkbox


{
xtype: 'checkbox',
fieldLabel: 'Remember location',
name: 'pref_location'
id: 'pref_location'
}

and to see if it was selected (returns true) I can do the following.

Ext.getCmp("pref_location").getValue()

radubrehar
23 Mar 2010, 6:13 AM
You should consider using the 'ref' config option:


{
xtype: 'checkbox',
fieldLabel: 'Remember location',
name: 'pref_location'
ref: 'pref_location'
}
//and access it with
this.pref_location
//'this' being the component the checkbox belongs to


Take a look at:
http://www.jslog.com/quick-tips-on-extjs-and-javascript

dlbjr
23 Mar 2010, 8:43 AM
var cb = new Ext.form.Checkbox({
fieldLabel: 'Remember location',
hideLabel: false,
boxLabel: '',
checked: false
});

var form = new Ext.form.FormPanel({
bodyStyle: 'padding:5px 5px 0',
labelWidth: 300,
labelAlign: 'top',
frame: true,
items: [cb]
});

alert(cb.getValue().toString());

phill54
23 Mar 2010, 9:15 AM
Hi,

how would i set checkbox values of a checkboxgroup?



var myFormPanel = new Ext.form.FormPanel({
id : 'myFormPanel',
items : [
{
xtype: 'fieldset',
id : 'myForm-fieldset',
items: [
new Ext.form.CheckboxGroup({
id: 'myForm-myGroup',
fieldLabel: 'myGroup',
columns: 2,
items : [
new Ext.form.Checkbox({
id: 'myBox1',
boxLabel: 'My Box #1',
name: 'myBox1'
}),
new Ext.form.Checkbox({
id: 'myBox2',
boxLabel: 'My Box #2',
name: 'myBox1'
})
]
})
]
}
]
});


Because this solution would only work if the checkbox wasn't part of a checkboxgroup:


myFormPanel.getForm().setValues({
myBox1 : true
});

and I can't find a way to set the value by using the setValues() function.

please do not respond somthing like


Ext.getCmp('myBox1').setValue(true);

I know this works but I'd like to know how to use the setValues() function as this seems to be the way it's supposed to be used.

dlbjr
23 Mar 2010, 9:39 AM
I like to create each item as an object then piece them together.
Seems easier and cleaner for me.



var cb1 = new Ext.form.Checkbox({
fieldLabel: '',
hideLabel: true,
boxLabel: 'My Box #1'
});

var cb2 = new Ext.form.Checkbox({
fieldLabel: '',
hideLabel: true,
boxLabel: 'My Box #2'
});

var cbGroup = new Ext.form.CheckboxGroup({
id: 'myForm-myGroup',
fieldLabel: 'myGroup',
columns: 2,
items: [cb1, cb2]
})

var form = new Ext.form.FormPanel({
bodyStyle: 'padding:5px 5px 0',
labelWidth: 300,
labelAlign: 'top',
frame: true,
items: [cbGroup]
});

cb1.setValue(true);
cb2.setValue(false);

phill54
23 Mar 2010, 9:45 AM
I like to create each item as an object then piece them together.
Seems easier and cleaner for me.[/code]

Thanks for the hint but that's not what I was looking for.

I have a listener function in another scope. within that listener function i'm accessing the formpanel object by using Ext.getCmp('myFormPanel') to get the formpanel. but all other elements of the form are not in my scope. so i thought using the setValues() function would be the most elegant way to access the formdata.
it also works perfectly except for checkboxgroups...

I'd like to avoid changing all scopes....

accguy
29 Mar 2011, 11:39 AM
phill54,

Have you figured this one out? I have been banging my head agianst the wall for
a couple of days on this same problem...

For me, if a user double clicks a Grid row, I get the rowId, and make a call to
the web server for an SQL call to get all the fields to fill in the form.

So, in my callback on success, I do this to get the form and load its data:

.
.
.
var newFormPanel = this.getComponent('ipRequestForm');
newFormPanel.loadData(data);
.
.
.


And, loadData() looks like this (from the form panel object I created):



loadData : function(data) {
if (data) {
this.data = data;
// This call loads all the data into the form, but, does not
// check checkboxes in that form...
this.getForm().setValues(data);
}
else {
this.clearForm();
}
},



Any help would be really appreciated.

acc.