jQuery jqGrid的自定义下拉格式化程序

1 jquery formatter jqgrid drop-down-menu

我试图在jqGrid上格式化一个单元格,以便当用户编辑它时,它们会显示一个组合框的自定义实现(称为activecombo),因为select html组件很难看.

我已经阅读了这些并看了演示,但他们似乎没有做我想要的.这是我尝试过的:

    var maritalStatusPickerFunction = function(cellvalue, options,
            rowObject) {
        var optionsArray = [ {
            "id" : 1,
            "status" : "Married"
        }, {
            "id" : 2,
            "status" : "Divorced"
        }, {
            "id" : 3,
            "status" : "Separated"
        }, {
            "id" : 4,
            "status" : "Widowed"
        }, {
            "id" : 5,
            "status" : "Unmarried"
        }

        ];
        var comboInput = $("<input type='text' value='" + cellvalue
                + "' />");
        comboInput.activecombo( {
            source : optionsArray
        });
        return comboInput;
    };

    $('#relationshipsGrid').jqGrid( {
        datatype : "local",
        colNames : [ 'Contact', 'Relationship' ],
        colModel : [ {
            name : 'contact',
            index : 'contact',
            width : 420
        }, {
            name : 'relationship',
            index : 'relationship',
            editable : true,
            formatter : maritalStatusPickerFunction,
            width : 120
        } ],
        width : 600,
        height : 100,
        cellEdit : true,
        editurl : "server.php"
    });
Run Code Online (Sandbox Code Playgroud)

但这显然不是我应该做的,因为这只是在单元格的输入中显示Object对象.

任何人都可以给我任何指示吗?

谢谢,

艾米

Ole*_*leg 5

如果您需要在编辑单元格期间实现组合框的自定义实现,则应使用自定义编辑控件而不是自定义格式化程序.

自定义格式化程序用于将单元格的HTML表示形式构建为字符串.自定义编辑控件用于创建自定义DOM元素,该<span>元素将放置在编辑字段的元素内.举个例子看看这个,这个这个老答案.

我不知道activecombo插件,但在我看来,你不能编写自定义编辑控件.取而代之的是,你可以尝试定义dataInit的内部事件句柄editoptions

editoptions: {
    dataInit : function (elem) { 
        $(elem).activecombo( {
            source : optionsArray
        }); 
    } 
} 
Run Code Online (Sandbox Code Playgroud)

或者如果你有任何问题,比如

editoptions: {
    dataInit : function (elem) { 
        setTimeout(function(){
            $(elem).activecombo( {
                source : optionsArray
            }); 
        },100);
    } 
} 
Run Code Online (Sandbox Code Playgroud)

顺便说一下,你可以为搜索做同样的事情.然后,用户将在搜索/过滤对话框中使用相同的优点.