How to specify the width of a slick grid in percentage?

Question

Is anybody knows how to set width of the grid in percentage?

for example but in the page the width of grid is more than 2000 pixels. It does not get adjusted to page width.

Any help would be appreciated.

Thanks Padmanabhan

Answer 1

i see that this question is really old, but i came across this question while trying to figure out how to get my columns to take up the full width of the table. hopefully it'll help someone someday.

i couldn't figure out how to set the column widths explicitly but i did get it to work implicitly.

here's how to do it:

first in your column declaration add width: 300 (or whatever width you want)

{id:"name", name:"Student Name", field:"firstName", width: 300}

set this for all your columns, the ones you want wider put a bigger number, e.g. 500

then in your options declation add forceFitColumns: true

{enableCellNavigation: true, enableColumnReorder: false, forceFitColumns: true};

by doing this i was able to get my table columns to take up the remaining space of the table, and maintain the portions i want relative to each other.

Answer 2

I have a function to do a grid resize.

    function resizeGrid(newsize, grid) {
            $('#dataGrid').css('width', newsize);
            grid.resizeCanvas();
    }

Don't forget to add forceFitColumns: true to your grid options as conman says above