Results 1 to 8 of 8

Thread: multiple call for Ext.window from a button

  1. #1



    I have an html code with buttons which execute product_window command onClick. (from sencha Hello World Demo but with multiple buttons)

        Hello Dialog
                ... World!
    And my function is:

    function product_window(id){
    var win = new Ext.Window({
        plain: true,
        title: id,
        modal: true,
        items: new Ext.TabPanel({
            applyTo: 'hello-tabs',
        buttons: [{
            text: 'Close',
            handler: function(){
    //return win;;

    The problem is when I close the window and re-click on one of these buttons, the new window appears inside the old window... if i click an other time, the new window appears inside the windows which is inside the older window

    I thought it was due to win variable, and I tried to destroy, close, remove it without any success. (with these function win doesn't exist anymore)

    any idea ?

    Thanks !

  2. #2


    A few problems:

    1) Try instead of In the example, 'this' refers to the button that was clicked. In your code, it's a reference to the function object you're calling it from, which is not a page element.
    2) For your close button handler, it's referring to the variable 'win' which doesn't exist when the function is called. Again, in the example, win is a global variable. In your example, the variable is only defined in the scope of the function product_window

    Don't know if either of these are causing your issue, but they will probably cause SOME issues

  3. #3


    I ran your code. With it as is, I do not see the behavior you describe. I changed the closeAction to 'hide' and I was able to see it.

    The problem is that when you click close, it hides the window but it's still present in the DOM. Notice that in the example it looks for the existence of win (which is a global variable) before it creates the window.

  4. #4


    Thank you for you help.
    I tried to use a global variable or inside the function.
    I tried to check the availability of the win variable, if yes win.destroy()

    But it seems that the variable is not re-created.

    "Uncaught TypeError: Cannot read property 'dom' of null" When I use win.destroy() or win.close() on close.

  5. #5
    Sencha User Animal's Avatar
    Join Date
    Mar 2007


    Why copy/paste code that you do not understand?

    It's never going to work.

    Do you know what applyTo does, or why you are using it?

    Do you think its appropriate to create a window from the same applyTo element on every click?

    DECIDE what you require your application to DO.


    Write it to do that.

    Copy/paste will get you nowhere.

  6. #6


    For me, ApplyTo will show an object (in my example, a window) into a .
    The expected behaviour I want, is when i'm using applyto two times in the same data inside this div are removed and the new window will appears.

    What to you mean by "Do you think its appropriate to create a window from the same applyTo element on every click?" ?

    Do you want me to create x , and x different applyTo ?
    Because, this is only an example I sent you, and I have more than 50 buttons (which are generated thanks to Ext.template from Grid datas)

    and I'm just triyng to learn Extjs with examples.

    I just want to, generate a lot of buttons, which open a window, and each button send a string as an argument to print a different page according to the string sent.

  7. #7
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    The Netherlands


    No, applyTo will use the specified element as the main element for the component (so you can't use it again for another component!).

    You are looking for 'renderTo', which will render the component inside the specified element.

    ps. Do you really want to use existing HTML markup to create your Ext components? It's usually better to start with an empty <body> and let Ext do all the component rendering.

  8. #8


    Sorry, now you've got 3 people shouting answers at you.

    You CAN use applyTo if you only ever need 1 of the window object. closeAction must be 'hide' in this case and you MUST use the same window object every single time... you can use setTitle() and update() to change the appearance of the window.

    IF you want a different window each time or if you might need to have multiple windows open at a time, closeAction should probably not be set (defaults to 'close') and you definitely do not want to use applyTo

    I recommend developing in Firefox with the Firebug extension installed and activated. It allows you to see exactly what's happening to the DOM and the HTML on the page. For instance, if you used Firebug while running your code, you would see that after closing the window, the DIV element is gone (since it was used as the main element of the component, which is now gone).

Similar Threads

  1. action call after close an ext.window
    By brigot in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 15 May 2009, 7:43 AM
  2. How to custom call member functions of Ext.Window
    By silcreval in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 27 Nov 2008, 12:12 AM
  3. Ext.Button on multiple toolbars
    By arthurakay in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 15 Oct 2008, 11:12 AM
  4. window lauches on html button, but not Ext button
    By bhomass in forum Ext 2.x: Help & Discussion
    Replies: 10
    Last Post: 1 Nov 2007, 11:50 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts