mRender JQuery Datatables无效

时间:2014-08-14 00:17:09

标签: jquery datatables

以下是代码,它将进入mRender功能,但仍显示的值为" 1"或" 0"不是"是"或"否"。 datatables版本是1.10

我从服务器端获得1或0,需要显示是或否前端。

  "aoColumns": [
      { "mData": "name" },
      { 
        "mData": "Flag" ,
        "mRender": function ( data, type, full ) {
                    if(data === "1") {
                       return "Yes";
                    } else {
                        return "No";
                    }

        }                   
    }
    ],

我感谢任何帮助。

编辑:搜索突出显示功能覆盖被操纵的显示,不确定是否有适用于mData和操作显示的搜索突出显示的良好工作示例。

jQuery.fn.dataTableExt.oApi.fnSearchHighlighting = function(oSettings) {
            // Initialize regex cache
            oSettings.oPreviousSearch.oSearchCaches = {};

            oSettings.oApi._fnCallbackReg( oSettings, 'aoRowCallback', function( nRow, aData, iDisplayIndex, iDisplayIndexFull) {
                // Initialize search string array
                var searchStrings = [];
                var oApi = this.oApi;
                var cache = oSettings.oPreviousSearch.oSearchCaches;
                // Global search string
                // If there is a global search string, add it to the search string array
                if (oSettings.oPreviousSearch.sSearch) {
                    searchStrings.push(oSettings.oPreviousSearch.sSearch);
                }
                // Individual column search option object
                // If there are individual column search strings, add them to the search string array
                searchTxt=$('#filter_input input[type="text"]').val();
                if(searchStrings == "") {
                    searchTxt=searchTxt+$('#search_input').val();
                }
                    if ((oSettings.aoPreSearchCols) && (oSettings.aoPreSearchCols.length > 0)) {
                    for (var i in oSettings.aoPreSearchCols) {
                        if (oSettings.aoPreSearchCols[i].sSearch) {
                        if(searchTxt!='')
                        searchStrings.push(searchTxt);
                        }
                    }
                }
                // Create the regex built from one or more search string and cache as necessary
                if (searchStrings.length > 0) {
                    var sSregex = searchStrings.join("|");
                    if (!cache[sSregex]) {
                        // This regex will avoid in HTML matches
                        cache[sSregex] = new RegExp("("+escapeRegExpSpecialChars(sSregex)+")(?!([^<]+)?>)", 'i');
                    }
                    var regex = cache[sSregex];
                }
                // Loop through the rows/fields for matches
                jQuery('td', nRow).each( function(i) {
                    /* Take into account that ColVis may be in use

                        var j = oApi._fnVisibleToColumnIndex( oSettings,i);

                    Only try to highlight if the cell is not empty or null
                     */
                    var colProp = oSettings.aoColumns[i].mData;

                if (aData[colProp] !== undefined && aData[colProp] !== null && aData[colProp] !== "") {
                        // If there is a search string try to match
                        if ((typeof sSregex !== 'undefined') && (sSregex)) {
                            var mapObj = {
                                            '&#0174;' : "\u00AE",
                                            '&#0153;' : "\u2122",
                                            '&#034;'  : "\u201C",
                                            '&nbsp;'  : " "
                                        };
                                        aData[colProp] = aData[colProp].replace(/(&#0174;)|(&#0153;)|(&#034;)|(&nbsp;)/gi, function(matched){
                                            return mapObj[matched];
                                        }); 
                            this.innerHTML = aData[colProp].replace( regex, function(matched) {
                                return "<span class='filterMatches'>"+matched+"</span>";
                            });
                        }

                        else {
                            this.innerHTML = aData[colProp];
                        }
                    }
                });
                return nRow;
            }, 'row-highlight');
            return this;
        };          
    jQuery('#example').dataTable().fnSearchHighlighting();

});

1 个答案:

答案 0 :(得分:0)

fnSearchHighlighting正在使用包含1或0的原始数据数组,而不是“是”或“否”。您需要修改扩展名以解决此问题。

见这个例子:

http://live.datatables.net/bubuhura/1/edit

我添加了一个功能:

function getColumn1Value(d)
{
    return (d === "1") ? "Yes":"No";
}

第1列的mRender变为

"mRender": function ( data, type, full ) {
              return getColumn1Value(data);
                }  

最重要的是,在fnSearchHighlighting代码中,您需要以下内容。需要注意的重要一点是我们不使用aData [colProp]作为this.innerHTML,因为这是原始数据(1或0)。我们必须将Flag列修改为Yes / No,并使用我们的函数执行此操作:

var str;
if (colProp === 'Flag')
    str = getColumn1Value(aData[colProp]);
else
    str = aData[colProp];

 console.log(colProp + ": " + str);


 if (aData[colProp] !== undefined && aData[colProp] !== null && aData[colProp] !== "")
 {
      // If there is a search string try to match
      if ((typeof sSregex !== 'undefined') && (sSregex)) {
          var mapObj = {
                '&#0174;' : "\u00AE",
                '&#0153;' : "\u2122",
                '&#034;'  : "\u201C",
                '&nbsp;'  : " "
                };
          aData[colProp] = 
            aData[colProp].replace(/(&#0174;)|(&#0153;)|(&#034;)|(&nbsp;)/gi, 
               function(matched){return mapObj[matched]; }); 

          this.innerHTML = str.replace( regex, function(matched) {
                return "<span class='filterMatches'>"+matched+"</span>";  });
          }

     else {
        this.innerHTML = str;
      }
  }

(请注意我克隆了另一个数据表小提琴,回答了关于fnSearchHighlighting的另一个问题:http://datatables.net/forums/discussion/10943/fnsearchhighlighting-keep-rows-visible

它可以清理一下,但我想你明白了。