PDA

View Full Version : [CLOSED] ComponentLoader inconsistency



RCN
Apr 11, 2012, 1:58 PM
Hi folks, im writing in relation to an issue that is driving me crazy

I have 2 GridPanels when i call the method ComponentLoader.ToJason i get the following results when pass them as parameters

Result 1:


{store:{model:Ext.define(Ext.id(), {extend: "Ext.data.Model", fields:[{name:"ID"}],idProperty:"ID" }),storeId:"_str",proxy:{type:"ajax",url:"/Ctrl/Method/",actionMethods:Ext.apply({}, {read:"POST"}, Ext.data.proxy.Ajax.prototype.actionMethods)},remo teSort:true},id:"_grd",height:200,xtype:"grid",region:"center",split:true,iconCls:"#Accept",title:"example",columns:{items:[{id:"ID",dataIndex:"ID",text:"_clnID"}]},viewConfig:{xtype:"gridview"}}


Result2:


{store:{model:Ext.define(Ext.id(), {extend: "Ext.data.Model", fields:[{name:"ID"}],idProperty:"ID" }),storeId:"_str",proxy:{type:"ajax",url:"/Ctrl/Method/",actionMethods:Ext.apply({}, {read:"POST"}, Ext.data.proxy.Ajax.prototype.actionMethods)},remo teSort:true},id:"_grd",height:200,xtype:"grid",region:"center",split:true,iconCls:"#Accept",title:"example",columns:{items:[{id:"ID",dataIndex:"ID",text:"_clnID"}]},viewConfig:{xtype:"gridview"}}


and as you can see the results of each call are the same

but if i add the GridPanel to a Panel and then call ComponentLoader.ToJson it will produce different results as shown bellow:

Result 1:


{border:false,xtype:"panel",region:"center",items:[{store:{model:Ext.define(Ext.id(), {extend: "Ext.data.Model", fields:[{name:"ID"}],idProperty:"ID" }),storeId:"_str",proxy:{type:"ajax",url:"/Ctrl/Method/",actionMethods:Ext.apply({}, {read:"POST"}, Ext.data.proxy.Ajax.prototype.actionMethods)},remo teSort:true},id:"_grd",height:200,xtype:"grid",region:"center",split:true,iconCls:"#Accept",title:"example",columns:{items:[{id:"ID",dataIndex:"ID",text:"_clnID"}]},viewConfig:{xtype:"gridview"}}],layout:"border",collapseMode:"header"}


Result 2:


{border:false,xtype:"panel",region:"center",items:[Ext.create("Ext.grid.Panel",{store:{model:Ext.define(Ext.id(), {extend: "Ext.data.Model", fields:[{name:"ID"}],idProperty:"ID" }),storeId:"_str",proxy:{type:"ajax",url:"/Ctrl/Method/",actionMethods:Ext.apply({}, {read:"POST"}, Ext.data.proxy.Ajax.prototype.actionMethods)},remo teSort:true},id:"_grd",height:200,xtype:"grid",region:"center",split:true,iconCls:"#Accept",title:"example",columns:{items:[{id:"ID",dataIndex:"ID",text:"_clnID"}]},viewConfig:{xtype:"gridview"}});],layout:"border",collapseMode:"header"}


The first result render properly but the second one is not rendered.

The difference between the is that the second creates a element that contains the store as show bellow:

"Ext.create("Ext.grid.Panel", [Same script for both situations]);

Any ideas to overcome this problem?

RCN
Apr 11, 2012, 2:50 PM
finally i figured out the problem.

View


<ext:Panel ID="Panel3" runat="server" PreventHeader="true" Border="false">
<Loader ID="Loader3" runat="server" Mode="Component" AutoLoad="true" Url="/Ctrl/Test/">
<Params>
<ext:Parameter Name="containerId" Value="Panel1" Mode="Value" />
</Params>
<LoadMask ShowMask="true" />
</Loader>
</ext:Panel>


The problem happens if i call ComponentLoader.ToJason passing the GridPanel (_grd) as parameter before adding it to the Panel (pnlCenter). If i comment the line 56 it will render properly.

i think that it should not produce differente results just because the method is called twice.

Controller


public ContentResult Test(string containerId)
{
//Grid
GridPanel grd = new GridPanel
{
ID = "_grd",
Height = 200,
Collapsible = false,
Split = true,
Region = Region.Center,
Title = "example",
Icon = Icon.Accept
};

grd.View.Add(new GridView { TrackOver = true });

//Store
Store str = new Store { ID = "_str", AutoLoad = false, RemoteSort = true };

//Proxy
AjaxProxy proxy = new AjaxProxy();

//Define a URL do representante
proxy.Url = "/crl/method/";

proxy.ActionMethods.Read = HttpMethod.POST;

//Adiciona o representante ao abastecedor
str.Proxy.Add(proxy);

//Adicona o abastecedor a grade
grd.Store.Add(str);

//Model
Model mdl = new Model();

ModelField clnMdl = new ModelField("ID");

//Column
Column cln = new Column();

cln.ID = "ID";

cln.DataIndex = "ID";

cln.Text = string.Format("_cln{0}", "ID");

mdl.Fields.Add(clnMdl);

cln.Sortable = true;

grd.ColumnModel.Columns.Add(cln);

str.Model.Add(mdl);

string makeProblem = ComponentLoader.ToJson(grd);

Panel pnlCenter = new Panel
{
Border = false,
Region = Region.Center,
CollapseMode = Ext.Net.CollapseMode.Header,
Layout = "BorderLayout",
Items =
{
grd
}
};

// Viewport
Viewport vwp = new Viewport
{
Border = false,
Layout = "BorderLayout",
Items =
{
pnlCenter
}
};


ContentResult r = new ContentResult();

r.Content = ComponentLoader.ToJson(vwp);

return r;
}

Vladimir
Apr 11, 2012, 3:20 PM
Each instance of control cannot be rendred twice because it can participate in one ASP.NET page life cycle only

RCN
Apr 11, 2012, 3:54 PM
i agree with you, but i was not flushing it for renderization, i just called ComponentLoader.ToJason

Vladimir
Apr 11, 2012, 3:56 PM
ComponentLoader internally renders component (to string) to get json reperesentation

Vladimir
Apr 11, 2012, 3:59 PM
What a sense to get json of grid and and its container?
You have to create two separate instance if you need to call ToJson twice (for example, create instance of grid in the function and call that function twice to get different instances)

RCN
Apr 11, 2012, 4:42 PM
First of all i would like to explain that it was a mistake of mine. I had two different codes and the unique difference between them was that one call ComponentLoader.ToJason for debug reasons before flushing it for renderization, as shown in the example provided.

so, its not a "real" problem. but i wonder why it changes the results if i call the method (no matter the reason) before flushing it for renderization

Vladimir
Apr 11, 2012, 6:42 PM
Well, it is limitation of dynamic rendering (ComponentLoader.ToJson uses dynamic rendering functionality)
Once rendered, a widget cannot be rendered again (widget gone through all stages already (OnInit, OnLoad, OnPreRender, OnRender and etc) and its internal state doesn't allow a rendering again)

geoffrey.mcgill
Apr 11, 2012, 7:10 PM
Hi,

I'm looking into this. I think we need to change something, because .ToJson() is confusing.

RCN
Apr 11, 2012, 7:18 PM
Thumbs up for both of you.

Daniil
Jun 07, 2012, 12:24 PM
Hi,

The ComponentLoader ToJson method has been renamed to ToConfig, revision #3989.

Thanks for the suggestion.