PDA

View Full Version : [CLOSED-EXTJSIV-308] store is loading twice when there is a groupField specified



karnak
24 Mar 2011, 9:01 AM
Greetings!

My store is loading twice on initial page load when I specify a groupField for the store (the loadMask is not displaying over the grid as well on initial page load). When I remove the groupField from the store, then the load only fires once (as it should) on initial page load (and the loadMask display correctly also). Here is my code:



<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="CSS/ext-all.css" rel="stylesheet" type="text/css" />
<script src="Scripts/bootstrap.js" type="text/javascript"></script>

<script type="text/javascript">

Ext.require(['Ext.data.*', 'Ext.grid.*']);

Ext.onReady(function () {

Ext.QuickTips.init();

Ext.regModel('myOrder', {
fields: ['OrderNumber', 'EOrderNumber', 'SubmitterName', 'SubmitterEmail', 'CompanyName', 'OrderDate', 'OrderTime', 'CustomerNumber', 'WorkPhone'],
idProperty: 'OrderNumber'
});

// create the Data Store
var store = new Ext.data.Store({
storeId: 'orders',
model: 'myOrder',
groupField: 'OrderDate',
remoteSort: true,
proxy: {
// load using script tags for cross domain, if the data in on the same domain as
// this page, an HttpProxy would be better
type: 'ajax',
url: 'getdata.aspx?operation=readOrdersM',
reader: {
type: 'json',
model: 'myOrder',
root: 'data',
totalProperty: 'total',
idProperty: 'OrderNumber'
}
}
});

// create the grid
var grid = new Ext.grid.GridPanel({
store: store,
viewConfig:
{
forceFit: true
},
features: [{
ftype: 'grouping'

}],
headers: [
{ text: "Id", width: 50, dataIndex: 'OrderNumber', sortable: true },
{ text: "EOrder Number", width: 100, dataIndex: 'EOrderNumber', sortable: true },
{ text: 'Order Date', width: 75, dataIndex: 'OrderDate', sortable: true },
{ text: 'Order Time', width: 75, dataIndex: 'OrderTime', sortable: false },
{ text: "Name", width: 175, dataIndex: 'SubmitterName', sortable: true },
{ text: "Email", dataIndex: 'SubmitterEmail', sortable: true },
{ text: "Company", flex: 1, dataIndex: 'CompanyName', sortable: true },
{ text: "Internal Customer Number", dataIndex: 'CustomerNumber', sortable: true },
{ text: "Work Phone", dataIndex: 'WorkPhone', sortable: true }
]
});

grid.getSelectionModel().on('selectionchange', function (sm, selectedRecord) {
if (selectedRecord.length) {
//alert('you clicked on ' + selectedRecord[0].get('OrderDate'));
}
});

Ext.create('Ext.Viewport', {
layout: {
type: 'border',
padding: 5
},
defaults: {
split: true
},
items: [
{
region: 'north',
collapsible: false,
split: false,
height: 85
},
{
region: 'west',
collapsible: true,
floatable: true,
title: 'Starts at width 30%',
split: true,
width: '30%',
html: 'west<br>I am floatable'
},
{
region: 'center',
layout: 'fit',
collapsible: true,
floatable: true,
split: true,
items: grid
},
{
region: 'east',
collapsible: true,
floatable: true,
split: true,
width: 200,
title: 'East',
layout: {
type: 'vbox',
padding: 5,
align: 'stretch'
},
items: [{
xtype: 'textfield',
fieldLabel: 'Text field'
}, {
xtype: 'component',
html: 'I am floatable'
}]
},
{
region: 'south',
collapsible: true,
split: true,
height: 200,
title: 'South',
layout: {
type: 'fit',
padding: 5
},
html: 'South Central'
}]
});

store.proxy.extraParams = { showAll: 1 };
store.load();
});


</script>

</head>
<body>
<form id="form1" runat="server">

</form>
</body>
</html>

Thanks!

evant
25 Mar 2011, 7:27 PM
I can't confirm this, if I copy your code I only see the load fired once. Please check in the next release.

karnak
26 Mar 2011, 6:41 AM
Evan,

Are you able to reproduce the issue in dev prev 5 ?

Thanks!