PDA

View Full Version : Form autoLoad keeps "Loading..."



ukino
19 Jun 2009, 2:59 AM
Hi all,

I have a problem and I've looked for a solution but I've found nothing.

I have this form:



{
id: 'tab-tipo-tariffe',
xtype: 'form',
autoLoad: {
url:'actions/services.php',
method: 'GET',
params: {
'get_checkboxes': 1
}
},
renderer:
{
render: function(el, response, updater, callback)
{
var form = Ext.getCmp('tab-tipo-tariffe');

form.add.apply(form, [].concat(Ext.decode(response.responseText) ) );
form.doLayout();

if(callback)callback();
}
}
}
and this is the output of services.php


[{
xtype: 'checkboxgroup',
columns: 2,
vertical: true,
items: [
{boxLabel: 'value5', name: '5'}
,{boxLabel: 'value12', name: '12'}
,{boxLabel: 'value4', name: '4'}
,{boxLabel: 'value1', name: '1'}
,{boxLabel: 'value0', name: '0'}
,{boxLabel: 'value6', name: '6'}
,{boxLabel: 'value9', name: '9'}
,{boxLabel: 'value13', name: '13'}
]
}]
Everything is ok except that, after loading the checkboxes, the "Loading..." text is still in the form.

Thanks.

Ukino

ukino
19 Jun 2009, 12:42 PM
Anyone? :(

ukino
23 Jun 2009, 2:39 PM
Up!

aconran
24 Jun 2009, 6:02 PM
The autoLoad configuration is inherited from Ext.Panel and is not intended to be used with an Ext.form.FormPanel.

After creating your FormPanel you can then call the load method on the Form. Check the Ext.form.Action.Load docs for the proper format that your server should return to load the data.

ukino
25 Jun 2009, 12:58 PM
With Ext.form.Action.Load I do nothing becouse I haven't to load data in fields, I have to CREATE the fields in the form.

Anyway, I solved the problem changing the PHP file and calling the add method in a <script> tag but now I have another problem: once I've created the checkboxes, I add them a "check" listener where I add a tab in a TabPanel. Until now, everythings is ok but if (in the "check" event) I try to add something in the panel I add in the TabPanel, it doesn't show anything. :s

This is my panel where I should load dinamically the fields in.



{
title: 'Tipo',
defaultType: 'textfield',
deferredRender: false,
defaults: {
border: false
},
bodyStyle: 'padding: 20px',
items: [
{
id: 'info-tipo-tariffe',
xtype: 'form',
monitorValid: true,
items: [
{
autoLoad: {
url:'actions/services.php',
method: 'GET',
scripts: true,
params: {
'action': 'get_checkboxes'
},
callback: function(el, success)
{
if (success)
{
alert("callback SI");

}
else
{
alert("callback NO");
}
}
}
},{
id: 'servizi-precedenti-tariffa',
xtype: 'tabpanel',
hidden: true
}
],
buttonAlign: 'left',
buttons: [
{
text: "Salva",
formBind: true,
handler: function(b, e)
{
var form = Ext.getCmp("tab-tipo-tariffe").getForm();

if (form.isValid())
{

}
}
}
]
}
]
}



And this is my PHP file code:



<?php
$res = mysql_query($sql);

$n_rows = mysql_num_rows($res);

if ($res)
{
if ($n_rows > 0)
{
$n = 1;

?>

<script type="text/javascript">

var form = Ext.getCmp('info-tipo-tariffe');

form.add({
id: 'checkbox-servizi-tariffa',
xtype: 'checkboxgroup',
columns: 2,
vertical: true,
allowBlank: false,
blankText: BLANK_TEXT,
items:[
<?php
while ($row = mysql_fetch_assoc($res))
{
?>
{
boxLabel: '<?=$row['nome']?>',
name: 's-<?=$row['id']?>',
id: 'c-<?=$row['id']?>',
listeners: {
'check': function(checkbox, checked)
{
var fieldset = Ext.getCmp("contenitore-servizi-precedenti-tariffa");
var checkboxgroup = Ext.getCmp("checkbox-servizi-tariffa");
var tabpanel = Ext.getCmp("servizi-precedenti-tariffa");

if (checked)
{
if (checkboxgroup.isValid())
{
tabpanel.setVisible(true);

tabpanel.add({
id: 'tab-<?=$row['id']?>-servizi-tariffa',
title: "<?=$row['nome']?>",
xtype: 'form'
});

tabpanel.setActiveTab("tab-<?=$row['id']?>-servizi-tariffa");
tabpanel.doLayout();

tabpanel.getItem("tab-<?=$row['id']?>-servizi-tariffa").add({xtype: 'textfield', fieldLabel: 'prova'});
}
}
else
{
tabpanel.remove("tab-<?=$row['id']?>-servizi-tariffa");

if (!checkboxgroup.isValid())
{
tabpanel.setVisible(false);
}
}
}
}
}
<?php

if ($n != $n_rows)
{
echo ",";
}

$n++;
}
?>
]
});
</script>

<?php
}
}


Thanks.
Ukino.