Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Ext JS Premium Member
    Join Date
    Jan 2008
    Posts
    88
    Vote Rating
    0
    Allan is on a distinguished road

      0  

    Default [OPEN-197][3.0.0][svn:5208] this.swf.setDataprovider is not a function

    Ext version tested:
    • Ext 3.0.0 rev 5208

    Adapter used:
    • ext

    css used:
    • only default ext-all.css



    Browser versions tested against:
    • chrome
    • FF3 (firebug 1.3.0.10 installed)

    Operating System:
    • WinXP Pro

    Description:
    • Get 'this.swf.setDataProvider is not a function' error in FireBug when reloading the store attached to a chart in a tab that is not visible.

      Example attached

    Test Case:

    Code:
        Use charts.html from demos directory
    with this JS

    Code:
        /*
     * Ext JS Library 3.0+
     * Copyright(c) 2006-2009, Ext JS, LLC.
     * licensing@extjs.com
     * 
     * http://extjs.com/license
     */
    
    Ext.chart.Chart.CHART_URL = '../../resources/charts.swf';
    
    Ext.onReady(function(){
    
      var store = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({
          method: 'GET',
          url: '/projects.json'
        }),
        autoLoad: true,
        reader: new Ext.data.JsonReader(
        {
          root: 'rows',
          totalProperty: 'results',
          id: 'id'
        },
        Ext.data.Record.create([
        {
          id: 'id',
          name: 'id'
        },
        {
          name: "name"
        },
        {
          name: "updated",
          type: 'date'
        },
        {
          name: "descript"
        }
        ])
        )
      })
    
      new Ext.TabPanel({
        renderTo: 'container',
        activeTab: 0,
        width:600,
        height:250,
        plain:true,
        defaults:{
          autoScroll: true
        },
        items:[
        {
          title: 'ExtJS.com Visits Trend, 2007/2008 (No styling)',
          items: {
            xtype: 'linechart',
            store: store,
            xField: 'name',
            yField: 'id'
          }
        },
        {
          title: 'Normal Tab',
          items:[{
            xtype:'button',
            text: 'Click me to reload chart',
            handler: function(b,e) {
              store.reload();
            }
          },
          {
            border:false,
            html: 'Should see error message "this.swf.setDataProvider is not a function'
          + '<br/>&nbsp;<br/>'
          + 'The error also occurs if the tab is switched before the chart has finished loading data'
          }
          ]
        },
        ]
      });
    
    });
    the AJAX call returns data like:

    Code:
    {"rows": [{"name": "Project_DEV", "descript": "Development project, contains data copied from production project", "configfile": "", "rev": "2.3", "id": 1, "updated": "2009/07/08 13:34:05 -0700"}, {"name": "Project_TEST", "descript": "Contains (incomplete) data for testing purposes", "configfile": "", "rev": "2.3", "id": 2, "updated": "2009/07/08 13:34:45 -0700"}], "results": 2}

    Steps to reproduce the problem:
    • see example for instructions
    Last edited by Allan; 26 Aug 2009 at 12:49 PM. Reason: Better yfield index

  2. #2
    Ext JS Premium Member
    Join Date
    Jan 2008
    Posts
    88
    Vote Rating
    0
    Allan is on a distinguished road

      0  

    Default

    The issue also occurs when using the ux.gridfilter plugin, FWIW

  3. #3
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    17,809
    Vote Rating
    779
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default

    I can confirm this. Not quite sure what's causing it, though I would guess it's some kind of DOM reflow issue.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  4. #4
    Ext JS Premium Member
    Join Date
    Jan 2008
    Posts
    88
    Vote Rating
    0
    Allan is on a distinguished road

      0  

    Default

    Hi,

    any estimate on a fix for this?

    Allan

  5. #5
    Sencha - Services Team hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,965
    Vote Rating
    12
    hendricd will become famous soon enough hendricd will become famous soon enough

      0  

    Exclamation

    The problem is likely caused by DOM reflow transitions because hideMode:'display' is in effect for that tab (containing the Flash object).

    style.display:none (and other style changes) will destroy the Flash interface bindings provided by the <OBJECT/EMBED> tag that manages it.

    That's why you get 'this.swf.setDataProvider' is not a function when switch back to the tab.

    Use an alternate hideMode and/or try the latest uxvismode plugin.
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  6. #6
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    17,809
    Vote Rating
    779
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default

    I had a look into this today. Even setting it to hideMode: 'offsets' seems to cause it to break. You'll notice that as you switch tabs the animation on the chart runs again.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  7. #7
    Sencha - Services Team hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,965
    Vote Rating
    12
    hendricd will become famous soon enough hendricd will become famous soon enough

      0  

    Default

    Quote Originally Posted by evant View Post
    I had a look into this today. Even setting it to hideMode: 'offsets' seems to cause it to break. You'll notice that as you switch tabs the animation on the chart runs again.
    Yep.

    Transition from position:absolute back to relative does it too (which is why Ext.fx needs some attention in this area as well).

    You'll have to set animCollapse:false, animFloat:false as well. (uxvismode plugin addresses these config issues for you).

    And you can just forget about Flash in Portlets because of all this.
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  8. #8
    Ext User
    Join Date
    Nov 2009
    Posts
    13
    Vote Rating
    0
    mrpip is on a distinguished road

      0  

    Default

    Hi All,

    Has there been any progress on this front recently? I am also experiencing the same error within a tabing situation where I have set a store to reload when a tab containing a graph is activated.

    Phil

  9. #9
    Ext JS Premium Member
    Join Date
    Jun 2008
    Posts
    23
    Vote Rating
    0
    geoffd is on a distinguished road

      0  

    Default

    We've had this issue pop up in several places as well. Any idea on a workaround?

  10. #10
    Ext User
    Join Date
    Nov 2009
    Posts
    13
    Vote Rating
    0
    mrpip is on a distinguished road

      0  

    Default

    I just tried the uxvismode plugin from the latest version of the uxmedia pack: http://uxmedia.googlecode.com/files/uxMedia212.zip see the file uxvismode.js, and it seems to have fixed the problem. Previously by switching to and from a tab with a graph in repeatedly I could get a this.swf.<some function> error in firebug quite easily. Also its much better without the re-initialising of the chart every time too!

    I just included uxvismode.js after Ext JS and added the line below to the chart object config.

    var chart = new Ext.chart.LineChart({
    <other config>

    plugins: [new Ext.ux.plugin.VisibilityMode()],

    <other config>
    });