PDA

View Full Version : Proxy action problem - can't get data



hermann.s
16 Sep 2013, 6:03 AM
Greetings,

I have the following setup :

Ext.define('Base.GridPanel', {
extend: 'Ext.grid.Panel',
xtype: 'gridpanel',

store :
{
proxy:
{
type: 'ajax',
url: '/Task/GetMyTaskData',
reader:
{
type: 'json',
root: 'data'
}
},
autoLoad: true
},

constructor: function(id, title, fields, columns)
{
this.id = id;
this.title = title;

this.fields = fields;
this.columns = columns;

this.callParent();
}
});

Then I create the GridPanel like shown below, however the data is not displayed.


new Base.GridPanel('@BFE.Frontend.MyTask.GridPanel', 'My Tasks', @Html.Raw(Model.GetStoreModel()), @Html.Raw(Model.GetColumnModel()));

This is the Controller action and the result it returns :

public string GetMyTaskData()
{
DataTable Data = new MyTaskModel().GetData(BaseParam);
string Result = JsonConvert.SerializeObject(new { data = Data, total = Data.Rows.Count });
return Result;
}


{"data":[{"Case_ID":"DD0024693","BP_Name":"CSS Test AG ","Task":"Answer BA specific Questionnaire","Title":"DD Initalised"},{"Case_ID":"DD0024694","BP_Name":"mo ","Task":"Select Group Company","Title":"DD Initalised"],"total":2}

However no data is loaded, although I can see the response from the server. Anyone know what might be wrong?

skirtle
16 Sep 2013, 4:02 PM
Your store needs either a model or fields config. The fields property you're setting on the grid won't help.

You've also got a dodgy xtype on your class definition and I'd ditch that custom constructor if I were you. If you need to do some customization do it in initComponent or a similar method.

hermann.s
17 Sep 2013, 12:44 AM
I changed my constructor to :

constructor: function(id, title, fields, columns)
{
this.id = id;
this.title = title;


this.store.fields = fields;
this.columns = columns;


this.callParent();
}

and now I get 2 blank rows, the data is there, but not displayed.

Also, as for not using initComponent(), I just followed what I read here (http://www.sencha.com/forum/showthread.php?200118-Class-system-the-use-of-constructor-and-initConfig).


What does initConfig do?
Not needed when extending an existing class. The function initConfig() is documented here. When creating your own class, not extending an existing class, this.initConfig(config) should be called inside the constructor method to make sure the getter and setter methods are properly initialized. When extending, the getter and setter methods are created automatically.

skirtle
17 Sep 2013, 2:58 AM
initComponent is not initConfig. I'd also be wary of relying on a Touch thread when trying to understand ExtJS, they are not always the same.

Your constructor is typical of a Java developer who's new to ExtJS. Get rid of the constructor and just pass in the config options in a config object instead. They'll automatically be copied to this prior to initComponent being called. The fields will still be a problem but you'd solve that by setting the store config in initComponent, picking the fields config off the this reference. You'd remove the store config from the prototype entirely, which is probably for the best as currently you're changing it on each instantiation.

My guess about the blank rows is that there's a mistake in either the field names or the column dataIndexes but you haven't posted those so it's difficult to know.

hermann.s
17 Sep 2013, 4:04 AM
Could you show me how you would implement this, as an example?

skirtle
17 Sep 2013, 5:31 AM
Something like:


Ext.define('Base.GridPanel', {
extend: 'Ext.grid.Panel',

initComponent: function() {
this.store = {
autoLoad: true,
fields: this.fields,

proxy: {
type: 'ajax',
url: '/Task/GetMyTaskData',

reader: {
type: 'json',
root: 'data'
}
}
};

this.callParent();
}
});

Then:


new Base.GridPanel({
id: '@BFE.Frontend.MyTask.GridPanel',
title: 'My Tasks',
fields: @Html.Raw(Model.GetStoreModel()),
columns: @Html.Raw(Model.GetColumnModel())
});

Personally I'd ditch the id too.

hermann.s
17 Sep 2013, 5:53 AM
Personally I'd ditch the id too.

Thanks for the reply,
why would you ditch the id?

skirtle
17 Sep 2013, 10:04 AM
The use of fixed ids, especially in conjunction with getCmp, tends to be the first step on a slippery slope. There's pretty much always a better way depending on how you're using the id. e.g. Component query, itemId, stateId or just passing a reference around.