PDA

View Full Version : How to set initial value for dynamically created radiogroups



ysonni
13 May 2014, 11:56 PM
Description - I Have radiogroups on my EXTJS page which are dynamically populated data from Database and on Submit button I am saving the initial value of checked radiogroups.

Issue: I am not able to set default initial value of dynamic radiogroups on a page load; I want to check the first checkbox for each dynamic radiogroups.

Also I am facing same issue while populating saved data from database, in this case data is getting load on store but it is not setting to radiogroups for that initial values.

Example:
Radiogroup - Financing
This radio group has 3 radio checkbox with initial values 0, 1 & 2. if i am saving the initial value - 2 for financing group then then 3rd radio checkbox should be selected while populating the last saved value on a page. Also first checkbox should me checked on a page load.

scottmartin
15 May 2014, 8:43 AM
You can use setValue to set any form value
http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.form.RadioGroup-method-setValue

ysonni
20 May 2014, 2:29 AM
I tried this solution but is not working for me since I am dynamically populating data in radiogroup

This solution will work for static radiogroup only.

I have below code where i am creating an array of items for the data fetched from database as given below

From database itself we are getting which value of radiogroup should be checked.

e.g records[i].data.checked is true where i =0 and records[i].data.checked is false where i = 1 and so on.
We tried to set the value forcefully in "For loop", but its not working.

Please see the below code Snape and help.

var radiostore = Ext.create('Ext.data.Store', {
storeId: 'radio',
autoLoad: true,
fields: ['boxLabelId', 'boxLabel', 'inputValue', 'name', 'checked'],
proxy: {
type: 'rest',
url: 'FilmRiskScoring/GetRiskQuestionDetails',
timeout: 120000,
noCache: false,
reader: {
type: 'json',
root: 'groupitems',
totalProperty: 'total'
},
baseParams: {
operation: 'showall'
},
},
});

radiostore.load({
callback: function (records, operation, success) {

for (var i = 0; i < records.length; i++) {
for (var j = 0; j <= itemsinLabel.length; j++) {
if (records[i].data.name == itemsinLabel[j]) {
count = count + 1;
}
}
if (count == 0) {
var k = itemsinLabel.length;
itemsinLabel[k] = records[i].data.name;
}
else {
count = 0;
}
}

for (var j = 0; j < itemsinLabel.length; j++) {
itemsInGroup = [];
for (var i = 0; i < records.length; i++) {
if (records[i].data.name == itemsinLabel[j]) {

itemsInGroup.push(records[i].data);
}
}

var myGroup = {
xtype: 'radiogroup',
layout: 'vbox',
labelWidth: 145,
labelSeparator: '',
margin: '0 0 15 0',
fieldLabel: itemsinLabel[j] + '<span style="color:Red";>*</span>:',
items: itemsInGroup,
id: itemsinLabel[j]



};
itemsinmyGroup.push(myGroup);


}

Here is control getting created on form
{
xtype: 'container',
layout: 'hbox',
defaultType: 'label',
items: [

{
xtype: 'radiogroup',
layout: 'vbox',
items: itemsinmyGroup
}]
}