2013년 10월 17일 목요일

Populating CheckboxGroups

1. We will start by creating a form containing a CheckboxGroup listing some
technologies that will form the base of our examples. We will then add this
group to a Form Panel:
var checkboxGroup = new Ext.form.CheckboxGroup({
columns: 2,
fieldLabel: 'Technologies',
name: 'technologies',
style: {
padding: '5px 10px 5px 10px'
},
items: [{
xtype: 'checkbox',
boxLabel: 'JavaScript',
name: 'technologies',
inputValue: 'javascript'
}, {
xtype: 'checkbox',
boxLabel: 'C#',
name: 'technologies',
inputValue: 'c#'
}, {
xtype: 'checkbox',
boxLabel: 'HTML',
name: 'technologies',
inputValue: 'html'
}, {
xtype: 'checkbox',
boxLabel: 'SQL',
name: 'technologies',
inputValue: 'sql'
}, {
xtype: 'checkbox',
boxLabel: 'Python',
name: 'technologies',
inputValue: 'python'
}, {
xtype: 'checkbox',
boxLabel: 'CSS',
name: 'technologies',
inputValue: 'css'
}]
});
var formPanel = new Ext.form.Panel({
renderTo: Ext.getBody(),
title: 'Technologies',
tbar: [{
text: 'Submit',
handler: function(){
console.log(formPanel.getValues());
}
}],
items: [checkboxGroup]
});

2. We can now call the CheckboxGroup's setValue method to pre-check some of
the checkboxes:
checkboxGroup.setValue({
technologies: ['javascript', 'css']
});

댓글 없음:

댓글 쓰기