1. #1
    dddu88
    Guest

    Default getBox() call for Toolbar.Button return 0

    getBox() call for Toolbar.Button return 0


    Hi, all,
    I have a strange problem when trying to call a Toolbar Button object on its el.getBox(), basically I made a toolbar as bbar of the FormPanel with form layout, and put some buttons on it with auto size, after I added each buttons to the toolbar, and then I called the first button's el.getBox(), the call returned 0 for width, height and others when I did not debug with firebug, but if I debug with firebug, sometimes it returned the right value. I tried to make the call after I called my window to show: win.show(), it still happened this way, and the toolbar buttons showed up nicely in the window, any idea to guarrante the call always returns the right value for the size of the button? is this related to lazy loading?

    Thanks

    David

  2. #2
    Ext User
    Join Date
    Jul 2007
    Posts
    3,128
    Vote Rating
    1
    devnull is an unknown quantity at this point

      0  

    Default


    it is indeed related to lazy rendering.
    show() returns immediately and the next code is executed. you can however provide it a callback function that will get called once the window is visible.

  3. #3
    dddu88
    Guest

    Default


    I provided the show function with a callback function, but the getBox() call still returns 0, when I debug or put a alert() msg box before the function matchAddWithInput() to slow down, then the getBox() call will return the right size, I did the callback function as following:

    Is there a way to turn off lazy rendering?

    Thanks
    David

    Code:
     function showDialog(button)
      {
          // alert('2');
        var dialog = getDialog();
        dialog.showDlg(button.getEl());
        dialog.show(showCallback(dialog));
      }
      function showCallback(dialog){
           //alert('show call back...1');
           dialog.matchAddWithInput();
           alert('show call back...2');
      }

  4. #4
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,496
    Vote Rating
    44
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    You are calling the callback before the show command, and passing the return value from the callback as the callback!

    READ that code.

  5. #5
    dddu88
    Guest

    Default


    Sorry, but thanks for your response, I am still learning the javascript, I guess I am not sure how to pass data to callback function, when the caller function returns a value, then the value will be passed in as parameter to the callback function, but in this case, the Window's show function is:
    show( [String/Element animateTarget], [Function callback], [Object scope] ) : void

    so it does not return a value, so how to pass in data to the callback?

    Another quesition is the show function has three optional parameters, if just one parameter passed in, how does the browser know it is the first one or second one?

    Thanks

    David

  6. #6
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,496
    Vote Rating
    44
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    You need to pass, as the handler, a new function which calls the real handler function passing ni the values that you know you want to pass.

  7. #7
    dddu88
    Guest

    Default


    Thank you so much, I got it working now, there are two ways:
    1>
    Code:
    function showDialog(button)
      {
          // alert('2');
        var dialog = getDialog();
        dialog.show(button.getEl(),function(){
            showCallback(dialog);
            });
       
      }
      function showCallback(dialog){
         
           dialog.matchAddWithInput();
          
      }
    2>
    Code:
    function showDialog(button)
      {
          // alert('2');
        var dialog = getDialog();
        dialog.show(button.getEl(),showCallback, dialog);
       
      }
      function showCallback(dialog){
         
           dialog.matchAddWithInput();
          // alert('show call back...3');
      }
    I think the first way is what you refered to. for the second way, the scope parameter of the show function is really the object which is passed into the callback function.

    Now I understand what I am missing, thanks again for your help.

    David

Thread Participants: 2