如何在 JQGrid 列中添加自定义掩码

How to add a custom mask in JQGrid columns

如何在 JQGrid 列中添加自定义掩码?我按照documentation,但它不起作用。

下面是我的代码:

this.montarGRID = function (p_gridName, p_dados, p_header, p_descriptor, p_contentName, p_primaryKey, p_filtroGrid) {
jQuery("#" + p_gridName).jqGrid( {
    data : p_dados, 
    datatype : "local", 
    sortable : true, 
    colNames : p_header, 
    colModel : p_descriptor, 
    rowNum : 30, 
    rowList : [30, 50, 100], 
    pager : '#p' + p_gridName, 
    recordpos : 'right', 
    viewrecords : true, 
    sortorder : "desc", 
    width: screen.availWidth - (screen.availWidth * 3 / 100),
    height : screen.availHeight - 250, 
    ignoreCase : true, 
    multiselect : false, 
    shrinkToFit : false, ...


function telefone(cellValue, opts, rowObject) {
    console.log("gri.locale-pt-br.js formatter telefone " + cellValue);
    return "Telefone: " + cellValue;
}

我的 colModel 值...

[
{formatter=integer, index=id, hidden=true, sortable=true, sorttype=integer, width=75, align=center, name=id}, 
{formatter=integer, index=VPD_GEMPI, search=false, hidden=true, sorttype=integer, sortable=true, width=0, align=right, name=VPD_GEMPI, editrules={number=true, required=true}, editable=true}, 
{formatter=date, formatoptions={srcformat=ISO8601Short, newformat=d/m/Y}, index=DT_DIGIT, search=true, hidden=false, sortable=true, width=0, align=right, name=DT_DIGIT, dateFormat=d/m/Y, editrules={required=true, date=true}, editable=true}, 
{formatter=email, index=EMAIL, search=true, hidden=false, sorttype=text, sortable=true, width=0, align=right, name=EMAIL, editrules={text=true, required=false}, editable=true}, 
{formatter=telefone, index=TELCONTATO01, search=true, hidden=false, sorttype=text, sortable=true, width=0, align=right, name=TELCONTATO01, editrules={text=true, required=false}, editable=true}, 
{formatter=function (cellValue, opts, rowObject) { return telefone(cellValue, opts, rowObject); }, index=TELCONTATO02, search=true, hidden=false, sorttype=text, sortable=true, width=0, align=right, name=TELCONTATO02, editrules={text=true, required=false}, editable=true} 
]

只有整数、日期、电子邮件掩码有效。

当我的 colModel 格式化程序 属性 是整数、货币、电子邮件等时,它可以工作,但当是电话时,它就不会。

在我的模板格式化程序下面

;(function ($) {
    $.extend($.jgrid, {
        formatter :  {
        integer :  {
            thousandsSeparator : " ", 
            defaultValue : '0'
        },
        number :  {
            decimalSeparator : ",", 
            thousandsSeparator : ".", 
            decimalPlaces : 2, 
            defaultValue : '0,00'
        },
        currency :  {
            decimalSeparator : ",", 
            thousandsSeparator : ".", 
            decimalPlaces : 2, 
            prefix : "R$ ", 
            suffix : "", 
            defaultValue : '0,00'
        } ...
})(jQuery);

查看您在 colModel 中的图片,您的格式化电话将永远无法使用。 正如我发布的 link 中的文档中所述,自定义格式化程序不应包含在引号中,而只是写下来。

You can define your own formatter for a particular column. Usually this is a function. When set in the formatter option this should not be enclosed in quotes and not entered with () - show just the name of the function.

你有

colModel:[
    ....
    {....., foramatter : "telefone",....    }
    ....
 ]

这是错误的:应该是:

colModel:[
    ....
    {....., foramatter : telefone,....    }
    ....
 ]

这是一个很大的不同

UPDATE : 如果你的系统只能生成字符串,你可以轻松解决扩展格式化程序的问题,这样你就可以将字符串放入格式化程序属性。要解决这个问题,您可以 "register" 您的自定义格式化程序和取消格式化程序。例如,如果你想注册格式化程序:"telefone" 你需要将 $.fn.fmatter.telefone 定义为格式化程序函数,最终将 $.fn.fmatter.telefone.unformat 定义为取消格式化程序函数,如下所示:

$.extend($.fn.fmatter, {
    telefone: function (cellValue, options, rowObject) { 
        // your code here
        ...
        // return a string 
    }
});
$.extend($.fn.fmatter.telefone, {
    unformat: function (cellValue, options, elem) {
        // code for unformatter
        ...
    }
});

希望对您有所帮助。