[FIXED][3.0] My store changed from an object variable to a class variable!!!

**frew** · 7 Apr 2009 9:08 AM

Hello friends!

So I again updated to the latest svn and now I am having issues with my stores being shared throughout all of my grids. Again, this is very likely to be my bug, uncovered by the slightly different environment of Ext 3..

Here is a Working Showcase :-)

Code:

<html>
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
   <title>Aircraft Ducting Repair, Inc.</title>
      <script type="text/javascript" src="js/lib/ext3/adapter/ext/ext-base.js"></script>
   <script type="text/javascript" src="js/lib/ext3/ext-all-debug.js"></script>
   <link rel="stylesheet" type="text/css" href="js/lib/ext3/resources/css/ext-all.css" />
   <script type="text/javascript">
Ext.ns('ACDRI.ui');
ACDRI.ui.Grid = Ext.extend(Ext.grid.GridPanel, {
      onRender: function(ct, position) {
         ACDRI.ui.Grid.superclass.onRender.call(this, ct, position);
         this.getStore().load();
      },
      initComponent: function() {
         this.baseParams = this.baseParams || {};
         var storeCfg = {
               proxy: new Ext.data.HttpProxy({ url: this.url }),
               reader: new Ext.data.JsonReader({
                     root: 'data',
                     totalProperty: 'total'
                  }, this.record),
               remoteSort: true,
               baseParams: this.baseParams
            };

         if (this.sortInfo) {
            Ext.apply(storeCfg, {sortInfo: this.sortInfo});
         }
         var store = new Ext.data.Store(storeCfg);
         var sm = new Ext.grid.CheckboxSelectionModel();

         var config = {
            store: store,
            loadMask: true,
            sm: sm,
            baseParams: this.baseParams
         };
         Ext.apply(this, Ext.apply(this.initialConfig, config ));
         ACDRI.ui.Grid.superclass.initComponent.apply(this, arguments);
      }
   });
   </script>
   <script type="text/javascript">
ACDRI.ui.WorkOrders = Ext.extend(ACDRI.ui.Grid, {
      initComponent: function() {
      this.url = 'bar';
         this.sortInfo = {
            field: 'repair_order_date_received',
            direction: 'desc'
         };
         this.record = Ext.data.Record.create([
            {name: 'id', type: 'string'}
            ]);
         var config = {
            title: 'Work Orders',
            columns: [{
                  header: 'ID',
                  tooltip: 'ID used to identify the Work Order',
                  dataIndex: 'id',
                  hidden: true
               }]};
         Ext.apply(this, Ext.apply(this.initialConfig, config ));
         ACDRI.ui.WorkOrders.superclass.initComponent.apply(this, arguments);
      }
   });

Ext.reg('workorders', ACDRI.ui.WorkOrders);
   </script>
   <script type="text/javascript">
ACDRI.ui.MoreDifferentWorkOrders = Ext.extend(ACDRI.ui.Grid, {
      initComponent: function() {
         this.sortInfo = {
            field: 'repair_order_date_received',
            direction: 'desc'
            };
            this.url = 'foo';
         this.record = Ext.data.Record.create([
            {name: 'id', type: 'string'}
            ]);
         var config = {
            title: 'Work Orders',
            columns: [{
                  header: 'ID',
                  tooltip: 'ID used to identify the Work Order',
                  dataIndex: 'id',
                  hidden: true
               }]};
         Ext.apply(this, Ext.apply(this.initialConfig, config ));
         ACDRI.ui.MoreDifferentWorkOrders.superclass.initComponent.apply(this, arguments);
      }
   });

Ext.reg('mdworkorders', ACDRI.ui.MoreDifferentWorkOrders);
   </script>
   <script type="text/javascript">
      Ext.onReady(function() {
         new Ext.Window({
            items: {
               xtype: 'workorders',
               height: 400,
               width: 400
               }}).show();

         new Ext.Window({
            items: {
               xtype: 'mdworkorders',
               height: 400,
               width: 400
         }}).show();
      });
   </script>
   </head>
   <body>
   <div id='main'></div>
   </body>
   </html>

Note that the url is the same for both, yet it should be different.

Thanks for any input at all!

**jsakalos** · 7 Apr 2009 9:52 AM

What should we watch when running it? How we see that problem?

**frew** · 7 Apr 2009 9:53 AM

Just a little bit more (slightly disconcerting) information: this isn't just my grids, but all of the stores in my whole program. (eg AutoCompleters)

So yeah, I just have a store that is accessed by an accidental singleton...

**frew** · 7 Apr 2009 9:54 AM

Originally Posted by jsakalos

What should we watch when running it? How we see that problem?

The url's should be different for each of those windows. Look at your firebug console to see what url's they try for and you'll note that both try for one thing when they should be foo and bar respectively.

**jsakalos** · 7 Apr 2009 10:39 AM

It really seems to be a bug, I suspect that new store execute method. My showcase follows. I've added console.log that outputs proxy url. This console output is correct (bar and foo) but both requests are sent to bar url which is wrong. Moving this thread to bugs:

HTML Code:

<html>
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
   <title>Aircraft Ducting Repair, Inc.</title>
      <script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
   <script type="text/javascript" src="ext/ext-all-debug.js"></script>
   <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
   <script type="text/javascript">

Ext.ns('ACDRI.ui');
ACDRI.ui.Grid = Ext.extend(Ext.grid.GridPanel, {
      onRender: function(ct, position) {
         ACDRI.ui.Grid.superclass.onRender.call(this, ct, position);
         var url = this.store.proxy.url;
         console.log(url);
         this.getStore().load();
      },
      initComponent: function() {
         this.baseParams = this.baseParams || {};
         var storeCfg = {
               proxy: new Ext.data.HttpProxy({ url: this.url }),
               reader: new Ext.data.JsonReader({
                     root: 'data',
                     totalProperty: 'total'
                  }, this.record),
               remoteSort: true,
               baseParams: this.baseParams
            };
         if (this.sortInfo) {
            Ext.apply(storeCfg, {sortInfo: this.sortInfo});
         }
         var store = new Ext.data.Store(storeCfg);
         var sm = new Ext.grid.CheckboxSelectionModel();

         var config = {
            store: store,
            loadMask: true,
            sm: sm,
            baseParams: this.baseParams
         };
         Ext.apply(this, Ext.apply(this.initialConfig, config ));
         ACDRI.ui.Grid.superclass.initComponent.apply(this, arguments);
      }
   });
   </script>


   <script type="text/javascript">
ACDRI.ui.WorkOrders = Ext.extend(ACDRI.ui.Grid, {
      initComponent: function() {
      this.url = 'bar';
         this.sortInfo = {
            field: 'repair_order_date_received',
            direction: 'desc'
         };
         this.record = Ext.data.Record.create([
            {name: 'id', type: 'string'}
            ]);
         var config = {
            title: 'Work Orders',
            columns: [{
                  header: 'ID',
                  tooltip: 'ID used to identify the Work Order',
                  dataIndex: 'id',
                  hidden: true
               }]};
         Ext.apply(this, Ext.apply(this.initialConfig, config ));
         ACDRI.ui.WorkOrders.superclass.initComponent.apply(this, arguments);
      }
   });

Ext.reg('workorders', ACDRI.ui.WorkOrders);
   </script>
   <script type="text/javascript">
ACDRI.ui.MoreDifferentWorkOrders = Ext.extend(ACDRI.ui.Grid, {
      initComponent: function() {
         this.sortInfo = {
            field: 'repair_order_date_received',
            direction: 'desc'
            };
            this.url = 'foo';
         this.record = Ext.data.Record.create([
            {name: 'id', type: 'string'}
            ]);
         var config = {
            title: 'Work Orders',
            columns: [{
                  header: 'ID',
                  tooltip: 'ID used to identify the Work Order',
                  dataIndex: 'id',
                  hidden: true
               }]};
         Ext.apply(this, Ext.apply(this.initialConfig, config ));
         ACDRI.ui.MoreDifferentWorkOrders.superclass.initComponent.apply(this, arguments);
      }
   });

Ext.reg('mdworkorders', ACDRI.ui.MoreDifferentWorkOrders);
   </script>
   <script type="text/javascript">
      Ext.onReady(function() {
         new Ext.Window({
            items: {
               xtype: 'workorders',
               height: 400,
               width: 400
               }}).show();

         new Ext.Window({
            items: {
               xtype: 'mdworkorders',
               height: 400,
               width: 400
         }}).show();
      });
   </script>
   </head>
   <body>
   <div id='main'></div>
   </body>
   </html>

**sabiola** · 8 Apr 2009 7:17 AM

Hello,

I have the same problem after updating to the latest svn.
Now my first grid shows fine, but all following grids load from the first URL.

Greetings,
Stefan

**aconran** · 8 Apr 2009 7:23 AM

>The issue is due to changes in the Ext.data.DataProxy where a complex object 'api' is stored in the prototype.

Aaron was right. Fixed.
Sorry guys.
Fixed.

**frew** · 9 Apr 2009 10:17 AM

Originally Posted by aconran

>The issue is due to changes in the Ext.data.DataProxy where a complex object 'api' is stored in the prototype.

Aaron was right. Fixed.
Sorry guys.
Fixed.

Aww, now I have to get back to work!

[FIXED][3.0] My store changed from an object variable to a class variable!!!

Thread Tools

Search Thread

Display

[FIXED] [3.0] My store changed from an object variable to a class variable!!!

[FIXED] [3.0] My store changed from an object variable to a class variable!!!