User Profile & Activity

Tim Byng Member

I'm pretty sure that this is related to Filter unusable in Google Chrome 57+.

Posted: April 17, 2014 10:51 AM

Hi Hans,

The important part about the doctype you supplied in your last post is that it does not include the system identifier. That will put the browser in quirks mode. To reproduce the issue, please use a valid 4.0 or 4.01 doctype with the system identifier such as the following:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">

In any case, for the grid to render correctly in IE8, the browser must be in Quirks mode. There are a number of different ways to get IE into Quirks mode, the easiest being to supply an invalid doctype. Please see here for a list of doctypes and which ones cause the browser to render in Quirks mode.

Quirks mode fixes the rendering issues in IE8, but breaks the rest of my app. Therefore, this isn't an option for me. I have come up with a workaround where the grid looks acceptable. For the height issue, I ended up setting the grid body to a static height using css and conditional comments to target IE8 only. If you can think of a better workaround, please let me know.

Posted: April 15, 2014 11:55 AM

Thank you for your reply, Hans.

I have attached a small sample project that demonstrates the issue. Please note that I reproduced the issue using IE8. To ensure that you are able to reproduce the issue, please use IE8 and not IE9 with the Browser Mode set to IE8.

As per your recommendations in the Compatibility issues with IE 8 and Intersoft WebUI Studio 2013 post, the HTML4 doctype has been used and the Rendering Mode of the grid has been set to Quirks.

I have also attached the following screenshots:

  • bs_win7_IE_8.0 - Initial Load.jpg: This is how the grid looks after the initial page load. Please notice how the column headers don't align properly with the columns.
  • bs_win7_IE_8.0 - After Apply Filter.jpg: This is how the grid looks after applying a filter. In addition to the problem above, please notice how the bottom of the grid has moved down.
  • bs_win7_IE_8.0 - After Refresh Grid Data.jpg: This is how the grid looks after refreshing the grid data. In addition to the problems above, please also notice that the scrollbar is missing even though more data can be loaded.
As you can see, there are many issues when rendering the grid in IE8. This is not just related to the grid not having a static height, as I initially reported.
I look forward to your reply.
Regards,
Tim
UPDATE: I have been able to resolve the issue. You previously said "... you should use HTML4 Doctype..". However, more accurately what's required is for the browser to render the document in quirks mode. For this, we can use an HTML 4.01 doctype without the system identifier, such as this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

However, and this is a big one for me, forcing the browser to use quirks mode breaks the rest of my page. Therefore, this is not an acceptable solution for me. I would really appreciate it if you could help me come up with a workaround to make the browser height static when using standards mode instead of strict mode in IE8.

Posted: April 15, 2014 10:38 AM

Thank you for your reply. I have modified the workaround to meet my needs and it is acceptable for now (I changed it to loop through the cells and check for System.DateTime column types and "Invalid Date" values).

Are there any plans to change the code so that it's more consistent with other filter types? For example, to return 0 results when an invalid value is entered rather than throwing an exception? Without it, we need to add a workaround similar to this for each grid that has a System.DateTime filter.

FYI: When trying to add a reply in this thread, I received an error message and was asked to contact Intersoft support. I tried again and was told the same thing. I then created a new thread for my question. I have since noticed that my original two posts to this thread were added, even though it said it failed both times. This was originally the 2nd post.

I am facing similar issues. I am currently testing the solution given above, but one issue still exists. 

When setting the doctype to HTML4 and the WebGrid RenderingMode to Quirks, the height of the grid does not remain static. Intead, as the number of rows in the grid change, the height of the grid changes with it. If there are 0 rows, the status bar moves right under the header/filter row. If there are 100 rows, then the height of the grid extends past what was set for the grid height in markup. Can you please let me know how I can workaround this issue?

Hello Hans,

The screenshots you supplied show that this issue as closed and Microsoft says it's working as designed. I understand that your opinion is that it's a bug (and I can understand why you think so), but that does not change the fact that this is how IE9 works and will continue to work.

Has any thought been given about how to update the code so that it is fully compatible with IE9? For example, if I understand correctly, this problem appears to occur because you need the iFrame to run in Quirks Mode (which it can't in this scenario), and this causes problems with the grid. If this is correct, could grid source be changed so that the grid no longer requires Quirks Mode?

Regards,

Tim

All times are GMT -5. The time now is 6:36 PM.
Previous Next