1

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?

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
Sriram P
  • 13
  • 3

1 Answers1

0

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:

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>
Community
  • 1
  • 1
BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • The idea is good. However, correct me if i am wrong but I dont think i can implement it as I am supposed to display data in form of a grid where the size of row and columns could go as high as 100 each. HtmlDataTable is used by my predecessor to display the grid and I cant change it now. So, I think that pagination cannot be applicable here. – Sriram P Mar 15 '12 at 21:09
  • Is there any other alternative? – Sriram P Mar 15 '12 at 21:09
  • Use JavaScript to detect the client and redirect the page or show some warning `
    ` which recommends the user to use a real browser instead, e.g. Chrome, Firefox, etc.
     – BalusC Mar 15 '12 at 21:12
  • I was wondering if we can use this approach. We can display the data, say 10 x 10, in the form of grid view while storing the data in the browser. Once the user scrolls the grid, we can display the data accordingly while hiding the previous display. Something like that.. :P – Sriram P Mar 15 '12 at 21:27
  • That's going to be a lot of JS/ajax work. This is hard to implement in JSF (custom components necessary). I'd look for a component library such as PrimeFaces: http://www.primefaces.org/showcase/ui/datatableScrolling.jsf – BalusC Mar 15 '12 at 21:30
  • Is there something in Core JSF or Richfaces that i can use in this situation? – Sriram P Mar 16 '12 at 20:13
  • Not in core JSF. As to RichFaces, just check its docs/showcase. Don't know from top of head as I don't really use it. – BalusC Mar 16 '12 at 20:17
  • Are there any other tools/libraries that can help generate grids as large as 1000 x 1000 with the help of jsp and is supported by IE browser?? – Sriram P Mar 18 '12 at 02:22