Does jQuery jqGrid edit form support fields that are multiselect?

后端 未结 1 829
悲&欢浪女
悲&欢浪女 2021-01-03 17:17

I am still trying to find out if I can have a cell in a jqGrid, and when I pull up the edit form for that row, I need a GUI that can display that column as a multiselect lis

相关标签:
1条回答
  • 2021-01-03 18:01

    jqGrid supports multiselect editing. It uses no ceckboxes for selection, but multiselect select element. I made the demo using inline editing on double-click. enter image description here

    Here is the corresponding code:

    jQuery(document).ready(function() {
        var lastSel, mydata = [
            {id:0, Name:"Lukas Podolski",     Category:"1", Subcategory:"1"},
            {id:1, Name:"Michael Schumacher", Category:"1", Subcategory:"2"},
            {id:2, Name:"Albert Einstein",    Category:"2", Subcategory:"3,4"},
            {id:3, Name:"Blaise Pascal",      Category:"2", Subcategory:"4"}
        ], grid = jQuery("#list");
        grid.jqGrid({
            data: mydata,
            datatype: 'local',
            colModel: [
                { name: 'Name', index: 'Name', width: 130, editable: true },
                {
                    name: 'Category', index: 'Category', width: 100,
                    formatter:'select', editable: true, edittype:'select',
                    editoptions: {
                        value: '1:sport;2:science',
                        multiple: true,
                        size: 2
                    }
                },
                {
                    name: 'Subcategory', index: 'Subcategory', width: 250,
                    formatter:'select', editable:true, edittype:'select',
                    editoptions: {
                        value: '1:football;2:formula 1;3:physics;4:mathematics',
                        multiple: true,
                        size: 4
                    }
                }
            ],
            sortname: 'Name',
            viewrecords: true,
            rownumbers: true,
            sortorder: 'desc',
            pager: '#pager',
            height: '100%',
            editurl: 'clientArray',
            ondblClickRow: function(rowid) {
                jQuery(this).jqGrid('editRow', rowid, true, null, null, 'clientArray');
            },
            onSelectRow: function(id){
                if (id && id!==lastSel){
                    jQuery(this).restoreRow(lastSel);
                    lastSel=id;
                }
            },
            caption: 'Selects with multiselect'
        });
    });
    

    By the way during creating the demo I find out, that one can't use select elements having "0" as the id, which are not full supported. For example, '1:sport;2:science' works, but not '0:sport;1:science'. In the case the selection of the 'sport' item will not saved.

    If you need to use more comfortable controles with checkboxes you have to implement the behavior with respect of custom editing.

    0 讨论(0)
提交回复
热议问题