[英]Strip HTML tags from filter with custom sType
I have a datatable which is defined as 我有一个定义为的数据表
$('#group').dataTable( {
"sDom": '<"H"fi>t<"F">',
"aaSorting": [ [2,'asc'], [1,'asc'] ],
"aoColumnDefs": [
{"aTargets": [ 0 ], "sType": null, "bSortable": false, "bSearchable": false },
{"aTargets": [ 1, 2 ], "sType": "html", "asSorting": [ "asc", "desc" ] },
{"aTargets": [ 3 ], "sType": "gcse-grade", "asSorting": [ "desc", "asc" ] },
{"aTargets": [ "_all" ], "sType": "grade", "asSorting": [ "desc", "asc" ] }
],
"bAutoWidth": false,
"bFilter": true,
"bInfo": true,
"bLengthChange": false,
"bPaginate": false,
"bScrollAutoCss": true,
"bScrollCollapse": true,
"bSort": true,
"oLanguage": { "sSearch": "_INPUT_" }
}
);
As you can see I have used custom sTypes called grade
and gcse_grade
. 如您所见,我使用了名为
grade
和gcse_grade
自定义gcse_grade
。 I have custom sorting working fine using oSort. 我使用oSort进行自定义排序工作正常。 However, when I create the table these columns sometimes have HTML tags within them.
但是,当我创建表时,这些列有时会在其中包含HTML标记。
How can I filter these so that it firstly strips the HTML tags from within. 如何过滤这些内容,以便首先从内部剥离HTML标记。 ie so the filter only sees the text, not the tags (as I don't want the filter to pick up any , or tags).
即所以过滤器只看到文本,而不是标签(因为我不希望过滤器拿起任何标签或标签)。
To strip html tags on filter search, you can use something like this: 要在过滤器搜索上删除html标记,您可以使用以下内容:
"aoColumnDefs": [
{ "aTargets": [0],
"mRender": function ( data, type, full ) {
if (type === 'filter') {
return data.replace(/(<([^>]+)>)/ig,"");
}
return data;
}
}
]
If this is just for sorting purposes, try this: 如果这仅用于排序目的,请尝试以下操作:
jQuery.fn.dataTableExt.oSort['gcse-grade-asc'] = function (a, b) {
var x = $('<div />').append(a).text(); // append to div element and get [inner]text to strip tags
var y = $('<div />').append(b).text(); // append to div element and get [inner]text to strip tags
return ((x < y) ? -1 : ((x > y) ? 1 : 0)); // sort like normal
};
jQuery.fn.dataTableExt.oSort['gcse-grade-desc'] = function (a, b) {
var x = $('<div />').append(a).text(); // append to div element and get [inner]text to strip tags
var y = $('<div />').append(b).text(); // append to div element and get [inner]text to strip tags
return ((x < y) ? 1 : ((x > y) ? -1 : 0)); // sort like normal
};
jQuery.fn.dataTableExt.oSort['grade-asc'] = function (a, b) {
var x = $('<div />').append(a).text(); // append to div element and get [inner]text to strip tags
var y = $('<div />').append(b).text(); // append to div element and get [inner]text to strip tags
return ((x < y) ? -1 : ((x > y) ? 1 : 0)); // sort like normal
};
jQuery.fn.dataTableExt.oSort['grade-desc'] = function (a, b) {
var x = $('<div />').append(a).text(); // append to div element and get [inner]text to strip tags
var y = $('<div />').append(b).text(); // append to div element and get [inner]text to strip tags
return ((x < y) ? 1 : ((x > y) ? -1 : 0)); // sort like normal
};
If you need it for filtering (and sorting, et. al.), just use the fnRowCallback
function instead to manipulate the actual content before the table is drawn: 如果你需要它来进行过滤(和排序,等等),只需使用
fnRowCallback
函数来操作绘制表格之前的实际内容:
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
var gcse = $('td:eq(2)', nRow), // cache lookup
grade = $('td:eq(3)', nRow); // cache lookup
gcse.html(gcse.text());
grade.html(grade.text());
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.