Question

I am trying to generate a table dynamically using HtmlDataTable in JSF. When I am giving the number of rows and columns greater than 25 each, some of the cells are not getting populated only in IE and it’s getting very slow. However, I can see the value when debugging the code using Firebug. It is working fine in Firefox and Chrome.

How is this caused and how can I solve it?

Answer 1

Internet Explorer is known to have an extremely poor table renderer. Especially when the columns and table nesting goes overzealous.

There’s no other solution than making your table smaller by introducing lazy loading and pagination so that only 10~100 rows will be displayed at once. Add if necessary search filters. Additional benefit is that it’s also much more user friendly. Google for example also doesn’t show all the zillion website links in a monster table without filtering and pagination.

If you happen to use PrimeFaces, use <p:dataTable> with LazyDataModel.

See also:

• Efficient JSF Pagination

---

Update as per the comments, there is not really other alternative if you can’t change your server side code. Your best bet is probably to inform the enduser that s/he should be using a real browser instead.

E.g.

<script>
    var ie = /*@cc_on!@*/false;

    if (ie) {
        window.location = 'some_page_which_recommends_different_browser.xhtml';
    }
</script>