如何让jqGrid的State列初始显示下拉框而非仅点击单元格时出现？

核心问题分析 #

你当前的代码存在拼写错误（比如ellediting、orttype、ormatter），且默认单元格编辑模式是点击才触发编辑，因此初始仅显示文本而非下拉框。要实现初始就显示下拉框，需开启单元格编辑并主动触发该列所有单元格的编辑状态。

修正后的完整代码 #

$(function () { 
    "use strict"; 
    $("#grid1").jqGrid({
        // 开启全局单元格编辑模式
        cellEdit: true,
        colModel: [
            { 
                name: "name", 
                label: "Client", 
                width: 53, 
                editable: true 
            }, 
            { 
                name: "invdate", 
                label: "Date", 
                width: 75, 
                align: "center", 
                sorttype: "date", 
                formatter: "date", 
                formatoptions: { newformat: "d-M-Y" } 
            }, 
            { 
                name: "amount", 
                label: "Amount", 
                width: 65, 
                editable: true, 
                formatter: 'currency', 
                formatoptions: { prefix: '$' } 
            }, 
            { 
                name: "State", 
                label: "State", 
                width: 41, 
                editable: true, 
                edittype: "select", 
                formatter: 'select', 
                editoptions: { value: { 1: 'Approve', 2: 'Reject' } } 
            }
        ],
        // 替换为你的实际数据源，需保证State字段值为1或2
        data: yourDataSource,
        height: "auto",
        rowNum: 10,
        rowList: [10,20,30],
        pager: "#pager1"
    });

    // 页面加载后触发State列所有单元格进入编辑状态，初始显示下拉框
    $("#grid1 tr.jqgrow").each(function() {
        var rowId = $(this).attr("id");
        $("#grid1").jqGrid('editCell', rowId, "State", true);
    });
});

关键修改说明 #

1. 修正拼写与语法错误：把ellediting改为全局配置cellEdit: true，orttype改为sorttype，ormatter改为formatter，同时补全colModel的数组包裹语法。
2. 开启全局单元格编辑：在jqGrid主配置中添加cellEdit: true，启用单元格编辑功能。
3. 主动触发编辑状态：遍历表格行，调用editCell方法让State列每个单元格初始进入编辑模式，直接显示下拉框。
4. 数据源匹配要求：确保你的数据源中State字段的值为1或2，与editoptions.value中的键对应，下拉框会自动选中对应选项。

内容的提问来源于stack exchange，提问作者Ram