PDA

View Full Version : reRender a CheckboxGroup



syncLuiz
15 Nov 2010, 4:24 AM
Good day Friends!

How can I reRender a CheckboxGroup?
The sample:




<html>
<head>
<title>Getting Started Example</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript">


Ext.onReady(function()
{
Ext.QuickTips.init();

// value in check.html is here:
// {"success":true,"msg":"","data":[{"boxLabel":"teste1a", "name":"teste1a" }]}

var store = new Ext.data.JsonStore({
url: 'check.html'
,root:'data'
,fields:['boxLabel', 'name']
});


var ch1 =new Ext.form.CheckboxGroup
({
fieldLabel: 'Checkboxes',
xtype:'checkboxgroup'
,id:'checkgroup_teste'
,columns:4
,items:
[{
boxLabel:'teste1'
,name:'teste1'
}]
})


var lb1 =new Ext.Panel
({
id:'painel_teste'
,layout:'form'
,items:[ch1] // insert the checkboxgroup
})

var myView = new Ext.Viewport
({
id:'view'
,renderTo: document.body,
frame: true,
title: 'Lista',
layout:'fit',
items:
[{
xtype:'form'
,frame:true
,items:[lb1], // insert the panel with checkboxgroup
buttons:
[{
xtype: 'button'
,text: 'Cadastrar'
,handler: function()
{
// I can get the new values, but we can't see them in the page
// Strange: Inside the function load the levels is diferent of this:
var str = ch1.items.get(0).boxLabel + " " + ch1.items.get(0).checked;
Ext.Msg.alert('', str )
}
}]
}]
});

store.load
({
callback: function(records,o,s)
{
var arrayfinal=[];
for(var i=0; i<records.length; i++)
{
arrayfinal.push({id:'rek'+i, xtype:'checkbox', boxLabel:records[i].get('boxLabel'), name:records[i].get('name'), checked:true})
}
// Strange: Inside the function handler the levels is diferent of this:
ch1.items.items=(arrayfinal)
// I tried every things, but I coudn't reRender the checkboxbroup
//lb1.render()
//ch1.doLayout()
//ch1.doLayout()
//lb1.doLayout()
// How can I override the "doLayout" in ch1(CheckboxGroup) ?
myView.doLayout();
}
});
});
</script>
</head>
<body>
</body>
</html>

Joshua Pruitt
25 May 2012, 8:33 AM
Hi! Old post, but did you ever manage to resolve this?

sword-it
29 May 2012, 5:20 AM
Hi,

Try using add method of panel.

See below:



ch1.panel.removeAll(true);
ch1.panel.add(arrayfinal);


Regards.