PDA

View Full Version : Trying to add repeatable datefield via Xtemplate into a DataView



bvt_surface_fleet
23 Nov 2011, 10:02 AM
var subclinTpl = new Ext.XTemplate(
'<table class="x-grid3" style="width:100%;">',
'<tr >',
'<th class="x-grid3-header" colspan="2">SUBCLIN Objects</th>',
'</tr>',
'<div class="thumb-wrap">',
'<tpl for=".">',
'<table>',
'<tr >',
'<td class="x-grid3-header">SubClin</td>',
'<td c lass="x-grid3-row">{subclin}</td>',
'</tr>',
'<tr >',
'<td class="x-grid3-header">Quantity</td>',
'<td class="x-grid3-row">{quantity}</td>',
'</tr>',
'<tr >',
'<td class="x-grid3-header">Forecast Date</td>',
'<td class="x-grid3-row">',
'<tpl if="edit_perm==\'Yes\'">',
'{[this.getName(xindex)]}',
'</tpl>',
'<tpl if="edit_perm==\'No\'">',
'{forecast}',
'</tpl>',
'</td>',
'</tr>',
'<tr >',
'<td class="x-grid3-header">Destination</td>',
'<td class="x-grid3-row">{destination}</td>',
'</tr>',
'</table>',
'<hr>',
'</tpl>',
'</div>',
'</table>'
,{
//compiled: true,
getName:function(n){
newName = '<div id="p_s_forecast'+(n-1)+'"></div>';
return newName;
}
}
);

subClinStore.load({
callback: function(){
editPerm = this.data.items[0].data.edit_perm;
if (editPerm == "Yes")
v_disabled = false;
else
v_disabled = true;

//Add Button

if (editPerm == "Yes"){

len = this.data.items.length;

for(i=0;i<len;i++){
//Convert Forecast date fields
//cdd = this.data.items[0].data.contract_delivery_date;
var fcast = new Ext.form.DateField({
id: 'p_s_forecast_date'+i,
editable: false,
width: 100,
value: this.data.items[i].data.forecast,
disabled: v_disabled,
format: 'd/m/Y',
allowBlank: false

});

console.log('p_s_forecast'+i);

fcast.render('p_s_forecast'+i);


}

}

}
});
When it renders it throws the error
ct is null
ct.dom.insertBefore(this.el.dom, position);

Now I have got the same code to work when the field is not repeated in the template.

The only difference here is that the field i'm trying to generate dynamically n number of the same field dependant on the data.

Does anyone have any suggestions?

mitchellsimoens
23 Nov 2011, 11:35 AM
It looks like the element you are trying to render to is not rendered yet.

bvt_surface_fleet
24 Nov 2011, 4:00 AM
I tried to put a timeout function around the part in the call back that builds the field. This does not work either.

bvt_surface_fleet
24 Nov 2011, 7:14 AM
I had to wait until the component was rendered. So as it was a secondary tab on a tab panel I moved the creation of the ExtJs styled fields from the load callback section, to a on tabchange event.