Integratron Integratron - 1 year ago 110
jQuery Question

HTML5/CSS3 Scrollable Data Table

Guys I've been searching but I'm just after a simple, ground up design for an HTML5/CSS3/JQuery data table that has the following properties:

1) Sits inside an absolute DIV which has top,right,left,bottom attributes set so must scale to fit its parent.

2) Has horizontally resizable column headers.

3) Has a horizontal scroll that scrolls the column headers and data table.

4) Has a vertical scroll that scrolls only the data table.

I'd prefer not to use any frameworks other than JQuery but if you think it's easier then I'll try it.

Thanks guys.

Answer Source

First - get a misconception out of your head. "Data table" and "simple" are mutually exclusive terms.

Second - jQuery is a library, but not a UI framework.

Third - I've had a lot of success with Kendo UI. The Javascript core is open-source. The Grid control may support absolute positioning but the scaling might be a stretch (if you want it to refresh on its own after the first time it renders). You must have a decent command of Javascript to make it work, or don't waste your time.

Grid demo

Core download

I don't work for Telerik. YMMV.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download