Question

I am using Telerik's Radgrid for a website. Often the grid columns exceed the available width, and extend outside the main content area (fixed width).

So what are my options for presenting very wide grids. horizontal scroll bars just look ugly on my site

Was it helpful?

Solution

Your choices are a combination of the following:

  1. Smaller fonts
  2. Consolidate some cells to have more than one row (e.g. if you have a "start date" and "end date" put the start date on top and the end date on the bottom.
  3. Widen the window
  4. Make some cells appear conditionally (based on user-defined filters). Maybe the most frequently used cells appear normally and a checkbox unhides the less frequently used cells or groups of cells.
  5. Allow horizontal scrolling
  6. Make the window a fluid width
  7. Popup data in a floating <div> via javascript instead of putting it in a column

Am I missing anything?

OTHER TIPS

i am using telerik controls too, one thing i have learned after a lot of work with them is their CSS is usually good, but i also face your problem, and here is my advise.

  • what Keltex said.
  • always add a custom class to your Rad Grid where you do fix those nasty stuff.
  • don't use fixed width for Grid, instead use it on columns and make the grid Fluid, so does the page.

hope this helps.

I agree with devmania and making the grid fluid, I had a similar problem recently. So I made a few of my columns nowrap and left the rest to wrap. It doesn't look great on smaller screens but it's still usable because I've stopped things like date+time columns wrapping. However, once you start using it on a wider screen it looks great.

It all depends on how much of a scrollbar you have. Is it possible to strip out some of the columns and have that information in a popup/flyout somewhere?

Another option is to make which columns are shown user configurable, but you're not really addressing the problem, just making it the responsibility of the user to make it look nice.

If you can't get rid of the horizontal scrollbar you should at least try to put the more important columns first so that your users don't have to scroll to the right very often.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top