Grid bugs in IE

[jimmie]

1. Table header row disappears.

While configuring a new GridPanel I set the autoHeight to true. Then I realised that in IE6.0 the table header row disappears when mouse is over any other row. There is no such a bug in FF2.0.

2. Wrong width.

I need a GridPanel having variable width. So I set the width to 'auto' or omit it at all. In FF2.0 this works out perfect but in IE6.0 the grid appears tree or four times wider than a window width.

3. Wrong table header height.

I need to make table header row cells without wrapping (text is too long and I should show it full). In css I turned the word wrapping off for the cell's div. But in cells with one line background and header menu icon positioning for such cells works like all cells of the header row contain one line but it should work depending on max height of the row's cells.

Are theese cases bugs or I do something wrong? If the second, could you please provide the solution?

Thanks!

[jack.slocum]

For item 1:

Is this with width:'auto'? If yes, see item 2 below.

Item 2:

width:'auto' is an invalid config (The width config takes a number).

In more detail, autoWidth on a grid is not supported. It must have a width or be part of a layout that provides a width. It is not because we don't want to support it, it is because IE does not support it. There are other reasons as well (e.g. calculating dimensions on div resize in impossible as there is no event for when a div changes size).

There are quite a few threads with code that show how one could do it by listening to the EventManager.onWindowResize event and changing the set width.

Item 3:

The grid currently only supports single-line headers. Any changes to the CSS or displaying multiline headers (e.g. by manually including a <br>) will require other changes to make them function correctly. I wouldn't recommend this route unless you know how to make those changes.

---

You may wish to post for "help" instead of calling everything a bug if you are using things in a way that is contrary to the documentation. This way we will strive to provide help for you, rather than explaining why it isn't a bug. Thanks!

[jimmie]

Hi!

In item 1 I meant "autoHeight:true" but not "width:'auto'". Could you please comment the original item 1?

Item 2: what if I omit width of grid at all? Is this a mistake? There is no a word in Help that this must be set.

Item 3: thanks. I'll try to solve this.

PS
Sorry, the title is too emotional and not absolutely correct. I don't know how to change thread title. If you can, cahnge it for something like "EXT & IE6. Need help"?

Thank you anyway!

[jsakalos]

Re 2. Yes it is mistake. See: http://extjs.com/deploy/dev/docs/?class=Ext.grid.GridPanel there is an article on width at the top.

[jimmie]

Thank you! I missed that width is required.

But what about the first question?

>> 1. Table header row disappears.

While configuring a new GridPanel I set the autoHeight to true. Then I realised that in IE6.0 the table header row disappears when mouse is over any other row. There is no such a bug in FF2.0.

Best regards

[jsakalos]

Well I do not use M$ "products" so I'm of little use to help with them. Anyway, what I would check would be:

1) run code through http://jslint.com
2) remove doctype, if any
3) check for colliding css, if any

I would start with setting both width and height and then I'd go step by step to see with which change the problem is introduced.

[J.B]

Having exactly the same problem with grid headings disappearing in IE when autoHeight is specified on the gridpanel. Did you find a fix/workaround jimmie?

[jsakalos]

Grid has to have some kind of dimensions. See: How to set dimensions (http://extjs.com/forum/showthread.php?p=127818).

[jimmie]

Here is the quotation from your homepage:
Browser Compatibility

Build rich web applications that work across all major web browsers including:

Internet Explorer 6+
FireFox 1.5+ (PC, Mac)
Safari 3+
Opera 9+ (PC, Mac)
If you do not use "M$" products how can you provide such a compatibility?

If you provide autoHeight then I suppose that the height will be set automatically. Correct me if I'm wrong. I do not need any scrolls and I have unlimited height of the page, so why don't use autoHeight?

By the way, Saki, the provided link doesn't say that I did something wrong or didn't do what I should. And also the Jack's answer proves the ability of using autoHeight. But in IE6 something goes wrong.

So, the answer is:
- "This doesn't work in IE6, full stop." (choosing this option denies the quotation above)
- "This is a bug and we are trying to fix it" (inconvenience but I won't die of it, I can wait)
- "Here is the way you can solve the problem: ..." (the best answer and, in general, exactly what I'd like to hear)

What's your choice, Saki, and yours, Jack?

With the best regards

[jimmie]

About 70% of my site's visitors use IE, 80% of them - v. 6.0. So I have 2 options:
- solve the described problem (that's why I asked you)
- avoid using the Ext's gridPanel (maybe and Ext at all while such a misbehavior is normal)

The last one is not good because the Ext is really goodlooking, flexible and fast.

[jsakalos]

Not using IE is my personal choice that does not automatically infer the Ext doesn't support IE, it does. However, in IE there are more problems that in another browsers and application has to be configured and designed such a way that it works also in IE.

[jimmie]

OK, Saki, I'm not satisfied with IE sometimes. But I must make application compatible with it - no matter if I want to do this or don't want.

So, how can I make the grid's header row not to disappear while moving mouse over the grid?

[jsakalos]

I'd say that if you give them dimensions they would work. Does this gird also suffer from "disapearing-headers-problem" in IE: http://recordform.extjs.eu? That is configured to live in layout:'fit' container that gives it dimensions.

However, I have very little experiences with IE, so you may consider to open a support ticket by sending mail to support@extjs.com where an Ext team member that is more IE skilled can pick-up the matter.

[jimmie]

Oh, thank you! Your sample works in IE as needed. I'll look through your code to find a cause of misbehavior.

Thank you for Ext!