sainath sainath - 4 months ago 88
jQuery Question

Is there anyway to include a MultiSelect Combobox in a jqGrid?

I have a jqGrid and I want one column to be a multiselect combobox. I got a plugin from,

http://www.abeautifulsite.net/blog/2008/04/jquery-multiselect/

How to integrate those, and how to get the selected values?

Answer

You can use jQuery UI MultiSelect Widget for example to implement multiselect with checkboxes.

The demo shows how you can implement this. You will have the results like the following

enter image description here

You can customize multiselect plugin using different options. In the demo I used the following code

edittype: 'select', editoptions: {
    value: 'FE:FedEx;TN:TNT;IN:Intim',
    dataInit: function (elem) {
        setTimeout(function () {
            $(elem).multiselect({
                minWidth: 100, //'auto',
                height: "auto",
                selectedList: 2,
                checkAllText: "all",
                uncheckAllText: "no",
                noneSelectedText: "Any",
                open: function () {
                    var $menu = $(".ui-multiselect-menu:visible");
                    $menu.width("auto");
                    return;
                }
            });
        }, 50);
    },
    multiple: true,
    defaultValue: 'IN'
}

I should mention that you can edit multiple selectable list without using any plugins. The only disadvantage is that the user interface will be not so nice. The next demo shows how all works without multiselect plugin.

UPDATED: If you need to set all rows in editing mode directly after the loading you can do this like in the next demo.