3.0 beta 2

Resize columns bug in 2.0

I have my grid set up in an iframe (not a table) with width 100% and height 100%. When I resize the columns, the grid renders really weird. The vertical scrollbar shrinks to about 1 inch as if I had resized my iframe to only 1 inch high. The data itself stays at 100% height though - it's just the scrollbars that go wonky. It's treating the scrollbars as if I'm resizing the whole frame to be 100% width and 100px or so high. When I resize the window everything goes back to normal. I just upgraded from v1.0 and did not have this problem with that version. Any ideas?
Chris
May 12,
My experience is, don't use percentages. The seem to cause problems in general, not only in AW.
Tony
May 12,
I'm game with that - however, how would I get the grid to fill the entire iframe without using percentages?
Chris
May 12,
Chris,

is there anything special in your code/layout? I am trying to reproduce this and I cannot so far. Could you send me (or post) an example?
Alex (ActiveWidgets)
May 12,
I tried opening the grid in a separate window and it is not doing it, so it must be something in the code on my end. Sorry about that...
Chris
May 12,
Okay, here's what I can tell -

1) I have my grid set up in an iframe with a fairly hefty application surrounding it
2) When I open the grid in a separate window instead of in my iframe everything works fine
3) In the iframe, when I do a column resize the vertical scrollbar shrinks down to a tiny size
4) In the iframe when using frozen columns, vertical scrolling only scrolls the frozen columns and not the regular ones.
5) Neither one of these problems happened with v1.0

Please see a screenshot of my problem at www.chriscotty.com/aw/awGridErros.PNG

I also have the source from my iframe at www.chriscotty.com/aw/awGridSource.txt

Any information would be greatly appreciated as my boss is about to pull the plug on this product if I can't get it working ASAP.
Chris
May 15,
Oops, the link for the screenshot is www.chriscotty.com/aw/awGridErrors.PNG
Chris
May 15,
Chris,

I was able to reproduce this once but cannot repeat since then :-( Here are some guesses of what might help.

- try using style="table-layout:fixed" on a table in the parent page (if you have table there).

- try adding css patches

.aw-ie .aw-grid-control {
    overflow-x: visible;
}

.aw-ie .aw-bars-content {
    padding-bottom: 50px;
}


- try adding this code

obj.onScrollWidthChanged = function(w){

        var e = this.getScrollTemplate().element();
        if (e) {
            e.firstChild.firstChild.style.width = w + "px";
            if (AW.ie) {
                e.firstChild.className += "";
            }
        }

        return 1;
    };


I will try reproducing this more. If you can post the html of the parent page - it will help a lot.
Alex (ActiveWidgets)
May 15,
So far I found the combination of css and modified onScrollWidthChanged fixes this problem -

.aw-ie .aw-grid-control {
    overflow-x: visible;
}

.aw-ie .aw-bars-content {
    padding-bottom: 50px;
}


together with

obj.onScrollWidthChanged = function(w){

    var e = this.getScrollTemplate().element();
    if (e) {
        e.firstChild.firstChild.style.width = w + "px";
        if (AW.ie) {
            e.className += "";
        }
    }

    return 1;
};


Alex (ActiveWidgets)
May 15,
I've gotten 1.5 of 2 issues cleared up, thanks Alex! I wish I could give you the parent source code but my company will not give it out for security reasons.

The onScrollWidthChanged code fixed the problem with the vertical scrollbar only scrolling the frozen sections. It also made it so that the grid doesn't overlap the scrollbars (making the grid shrink to 1 inch high when the scrollbars do). Obviously this is good assuming we can get the section not to shrink.

The paddingBottom on the barsContent made it so the grid now resizes to that size whenever you resize the column. Thus, when setting the padding bottom to 400px the grid resizes to 400px high when you resize a column. This is much better but I need it to be 100% high.

I did notice that I have none of these problems when I have clicked on one of the headers to sort. Is there some class that's repeatedly firing when you click sort that keeps everything at the right height?

I appreciate all your help, Alex. My boss has wondered if you're looking for a job...
Chris
May 15,
Well, here is another thing to try -

obj.onColumnWidthChanged = function(width, column){
    try{
        if (this.element()){
            this.setTimeout(function(){
                this.raiseEvent("adjustScrollWidth");
                this.raiseEvent("adjustScrollBars");
                if (AW.ie && this.getScrollTemplate().element()){
                    this.getScrollTemplate().element().className += "";
                }
            });
        }

        var w = (width - AW.dx) + "px", c = column;

        var i, ss = document.styleSheets[document.styleSheets.length-1];
        var selector = "#" + this.getId() + " .aw-column-" + c;
        var rules = AW.getRules(ss);

        for(i=0; i<rules.length;i++){
            if(rules[i].selectorText == selector){
                rules[i].style.width = w;
                return 1;
            }
        }
        AW.addRule(ss, selector, "width:" + w);

    }
    catch(r){
    }
    return 1;
};


I suspect that it happens because you have a table or nested tables in your parent page. Could you try reproducing this bug by keeping only that table in the parent page and removing all other (confidential :-) stuff?

Alex (ActiveWidgets)
May 15,
Looks like that fixed it! Thanks Alex. One or two times while monkeying with the code I've had the issue with only the fixed columns scrolling come up, but I think that may have been something I was doing. If it keeps happening, I'll let you know. Thanks a lot!
Chris
May 15,
Alex, I had the same problem, 100% + nested tables... your fix worked fine!

Thanks!
Ruso Wyler
May 16,
It works for me as well. thanks Alex~
Dylan
November 8,

This topic is archived.

See also:


Back to support forum

Search

Version 2

Looking for AW 2.6 ?
The old site is here.