Question

How to animate hide/show columns?

$("#button").toggle(
    function() {
        $('#data').jqGrid('hideCol',['col1','col2','col3']);
        // $("bla-bla").animate({
            // width: 100
        // }, 1000 );
    },
    function() {
        $('#data').jqGrid('showCol',['col1','col2','col3']);
        // $("bla-bla").animate({
            // width: 0
        // }, 1000 );
    }
);

Is it possible?

We have many columns. Perhaps there is another way to fit all columns in one screen?

Answer 1

I don’t think this is easily possible without changing some internal jqgrid behaviors.
You could use combinations of autowidth forceFit and shrinkToFit to make the grid use the maximum available screen real estate and resize the columns so they all get some of the available space proportionally.