jQuery jqGrid编辑表单是否支持多选字段? [英] Does jQuery jqGrid edit form support fields that are multiselect?

问题描述

我仍在尝试确定是否可以在 jqGrid中创建一个单元格，并且当我拉出该行的编辑表单时，我需要一个可以将该列显示为多选列表的GUI.

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 list.

这可能是:

1. 复选框列表
2. 选择带有复选框的列表，以便您可以选择多个.

在jqGrid中有可能吗?

Is this possible in jqGrid?

推荐答案

jqGrid支持多选编辑.它不使用ceckbox进行选择，而是使用multiselect select元素.我使用双击内联编辑制作了演示.

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

这是对应的代码:

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'
    });
});

在创建演示的过程中，我发现，无法使用不完全支持的选择元素作为ID的选择元素"0".例如，"1:sport; 2:science"有效，但"0:sport; 1:science"无效.在这种情况下，运动"项目的选择将不会保存.

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.

这篇关于jQuery jqGrid编辑表单是否支持多选字段?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！