Question

我有一个jqgrid，我使用custom_element格式化显示。

 {
            name: 'PDTime', index: 'PDTime', width: 60, editable: true, formatter: timeSpanHMFormatter, edittype: 'text', editoptions: {
                custom_element: function (value, options) {
                    var elemStr = '<div> <select id="UTTime" name="UTTime" >'

                    for (var i = 0; i < 24; i++) {
                        elemStr = elemStr + '<option value="' + i + '">' + i + '</option>'
                    }
                    elemStr = elemStr + "</select> </div>";
                    return $(elemStr)[0];
                },
                custom_value: function (elem, operation, value) {
                    console.log(elem);

                }
            }
        },

格式化程序是显示小时和分钟的时间跨度显示。值“PDTime”是一个具有“小时和分钟”属性的对象。

function timeSpanHMFormatter(cellvalue, options, rowObject) {        
    if (cellvalue.Hours == 0 && cellvalue.Minutes == 0)
        return "";
    var value = "00:00";

    if ( cellvalue.Hours.toString().length == 1 )
        value = "0" + cellvalue.Hours
    else
        value = cellvalue.Hours

    if (cellvalue.Minutes.toString().length == 1)
        value = value + ":0" + cellvalue.Minutes
    else
        value = value + ":" + cellvalue.Minutes

    return value;
}

在视图模式下，单元格看起来像02:30等，具体取决于值。我想在编辑模式下将值绑定到此PDTime对象，我不知道该怎么做。

custom_element现在创建一个小时下拉列表，我正在尝试将下拉列表选定值绑定到PDTime.Hours。我怎样才能做到这一点？

Answer 1

从自定义元素的Guriddo Documentation here可以看出，需要定义一个操作设置为get的custom_value函数。

这里的技巧是这个事件应该在get操作时返回对象。以下是一个例子：

custom_value: function (elem, oper) {
    if(oper==='get') {
        var hour = $("#UTTime", elem).val();
        // get the minutes according to your definition
        var time = $("#UTTime", elem).val(); 
        return {"Hours" : hour,  "Minutes": time};
    }
},

请注意，当数据发布到服务器时，PDTime是一个对象。您可以使用serializeRowData事件（look here）简化帖子返回一个或多个值。此事件是jqGrid事件，您可以这样做：

...jqGrid({
....
    serializeRowData : function( postdata ) {
        var hours = postdata.PDTime.Hours;
        var minutes postdata.PDTime.Minutes;
        posdata.PDTime = hours+":"+minutes;
        // or what you want data combination
        return postdata;
    },
...

jqgrid编辑组合列和绑定数据

1 个答案: