Question

I am using jqGrid with ui.multiselect.js for column choosing and reordering. The dialog which comes up is resizable but when resized, the contents of the dialog are not resized.
Do you have to hook into any event do the stuff?

Answer 1

You are right. Currently it’s a problem in the column chooser.

It’s better to make some fixes in the code of the columnChooser method. Before all you can improve the situation with resizing by making some changes in the Column Chooser dialog after the dialog is created. For example with the following code

$(this).jqGrid('columnChooser',
    {width: 550, msel_opts: {dividerLocation: 0.5}});
var columnChooser = $("#colchooser_" + $.jgrid.jqID(this.id));
columnChooser.css('min-width', columnChooser.width() + 'px');
var dialog = columnChooser.closest('div.ui-dialog');
columnChooser.closest('div.ui-dialog').css('min-width', dialog.width() + 'px');

var div = columnChooser.children('div:has(div.ui-multiselect)');
div.css('width', '100%');

var uiMultiselect = div.children('div.ui-multiselect');
uiMultiselect.css('width', '100%');
uiMultiselect.children('div.available').css({width: '49.9%'});
uiMultiselect.children('div.selected').css('width', '49.9%');

you will have fairly good results with the horizontal resizing (see the demo). In the way you can either solve or at least have improve the results of resizing.

UPDATED: I posted here suggestions to make columnChooser really resizable. You can see the results on the demo.