Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha User
    Join Date
    Dec 2009
    Posts
    59
    Vote Rating
    0
    Werzi2001 is on a distinguished road

      0  

    Default [ExtJS 4.1.1a] Error using cmp.removeAll

    [ExtJS 4.1.1a] Error using cmp.removeAll


    REQUIRED INFORMATION
    Ext version tested:
    - Ext 4.1.1a

    Browser versions tested against:
    - IE7/IE8/IE9/IE10

    Description:
    - removeAll called from within the ComponentLoader triggers error in IE
    - "removeEventListener" cannot be called
    - i think the problem ist that the dom element that is "removeEventListener" tried to be called for doesn't exist anymore

    Steps to reproduce the problem:
    - Click button in example code

    The result that was expected:
    - Content be replaced (no error)
    - Like in FireFox or Chrome

    The result that occurs instead:
    - Error that "removeEventListener" cannot be called (IE)

    Test Case:
    index.html
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        
            <link rel="stylesheet" type="text/css" href="./extjs/resources/css/ext-all-gray.css"/>
            <script type="text/javascript" src="./extjs/ext-all.js"></script>
        </head>
        <body>
            <script type="text/javascript">
                Ext.onReady(function() {
                    var panel = Ext.create('Ext.panel.Panel', {
                        id: 'panel',
                        renderTo: document.body,
                        title: 'Test',
                        width: 400,
                        height: 300,
                        items: [{
                            xtype: 'filefield',
                        }]
                    });
                    
                    var button = Ext.create('Ext.button.Button', {
                        renderTo: document.body,
                        text: 'Click',
                        listeners: {
                            click: function(b, e, eopts) {
                                Ext.create('Ext.ComponentLoader', {
                                    target: panel,
                                    url: 'test.html',
                                    autoLoad: true,
                                    scripts: true
                                });
                            }
                        }
                    });
                });
            </script>
        </body>
    </html>
    test.html
    Code:
    <script type="text/javascript">
        (function() {
            var panel = Ext.getCmp('panel');
            panel.removeAll(true);
            panel.add({
                html: 'test'
            });
        }).call();
    </script>
    HELPFUL INFORMATION
    Possible fix:
    Replace the following code from EventManager.removeListener

    Code:
    if (dom.detachEvent) {
        dom.detachEvent('on' + bindName, wrap);
    } else {
        dom.removeEventListener(bindName, wrap, false);
    }
    with

    Code:
    if (dom.detachEvent) {
        dom.detachEvent('on' + bindName, wrap);
    } else if (dom.removeEventListener) {
        dom.removeEventListener(bindName, wrap, false);
    }

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,127
    Vote Rating
    516
    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 don't see any exception when I run your test case in IE8 against 4.1.1a, but even so you're mis-using the class.

    When you use the html option, it overwrites the body of the panel with anything you load via ajax, in this case it totally destroys the DOM for the file field, without ever notifying the panel that it's gone. So when you attempt to call removeAll() it's been set in an invalid state.

    This is the exact use case for using the Component renderer on the component loader.

    Edit:
    To elaborate, you're essentially doing this:

    Code:
    panel.update('');
    panel.removeAll();
    panel.add({});
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  3. #3
    Sencha User
    Join Date
    Dec 2009
    Posts
    59
    Vote Rating
    0
    Werzi2001 is on a distinguished road

      0  

    Default


    Thanks for your reply. I already thought that this use of the ComponentLoader might not be intended (even incorrect) but i didn't manager to get the code running without it.

    What is the exact result expected for a component renderer call? The documentation only says "Loads child {Ext.Component} instances. This option is only valid when used with a Container.". But using which format?

    Thanks a lot!

    Edit:
    Ok i found the format that is expected (a single/serier of config objects). But i cannot return that as the example was only a very simple test case. The real objects are much more complex usually also containing html and further javascript code. So i think i have to use the ComponentLoader on a dummy panel and replace the content of the actual panel manually (as i already do).

  4. #4
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,127
    Vote Rating
    516
    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 think you should just be able to call removeAll() before you make the component loader call.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  5. #5
    Sencha User
    Join Date
    Dec 2009
    Posts
    59
    Vote Rating
    0
    Werzi2001 is on a distinguished road

      0  

    Default


    Thanks for your solution but this causes a white page/element as long as the new content is not yet loaded (time between removeAll and finished AJAX call).

    I created a dummy element (not really visible) that is the target for the ComponentLoader and not the one that actually gets the new component/content. This works fine in all relevant browsers :-)

    Thanks again for your help!

Thread Participants: 1

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar