jQuery数据表-当输入的<td> </ td>中包含html / images时，按选择输入进行过滤
zer02
我正在尝试使用选择输入DEMO筛选我的表
我的问题是我的内部<table>有多个图像/子画面等<td>，我希望数据表使用其中的<span class="hidden-val">值。
例子：
<tr>
<td>
<span style="display:none" class="hidden-val">23</span>
<i class="my-sprite-abc>My Logo</i>
</td>
</tr>
我通过将字符串转换为DOM HTML然后获取来管理数据表以显示正确的选择输入值innerText，但是我仍然难以解决这一问题column.search.draw()，因为我不知道如何教数据表使用隐藏的span值。
$('#my-table').DataTable( {
initComplete: function () {
this.api().columns().every( function () {
var column = this;
var select = $('<select><option value=""></option></select>')
.appendTo( $(column.footer()).empty() )
.on( 'change', function () {
console.log($(this).val());
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search( val ? '^'+val+'$' : '', true, false )
.draw();
} );
column.data().unique().sort().each( function ( d, j ) {
var html_val = $.parseHTML(d)
//console.log(html_val);
if (html_val != null){ // check if html is not null
var new_d = $(html_val)[0].innerText // take first html object <span> in this case
select.append( '<option value="'+new_d+'">'+new_d+'</option>' )
}
} );
} );
}
} );
谢谢，如果您能帮助我！
戴维·康拉德
您可以创建基于类型的搜索插件，从而hidden-val仅对进行过滤：
jQuery.fn.dataTable.ext.type.search.hiddenVal = function(data) {
return $('<div>').append(data).find('.hidden-val').text()
}
并将其设置为type具有的列hidden-val：
...
columnDefs: [
{ type: "hiddenVal", targets: [0] } //fist column as example
],
...
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
在表td中获取输入值
- 2
从 td 表中获取输入值
- 3
无法在jQuery的td中获取输入？
- 4
jQuery通过td中的隐藏输入字段值选择tr
- 5
选中时从表TD内的输入字段中检索值
- 6
jQuery仅在不包含输入时才允许td doubleclick
- 7
jQuery仅在不包含输入时才允许td doubleclick
- 8
如何使用 jquery 从 TD 文本（旧数据表）中的每个表 TD 中设置标题？
- 9
从表中的td中的表单获取输入值
- 10
获取没有输入标签的Td内部HTML-Jquery
- 11
用输入乘以td
- 12
使用jQuery将输入的值存储在TD中
- 13
使用jQuery将输入的值存储在TD中
- 14
根据表td输入更改标签？
- 15
从表td的Onkeyup函数添加输入验证？
- 16
表<td>标记内的Bootstrap输入组
- 17
水平对齐不同TD中的输入
- 18
突出显示包含输入中搜索到的文本的td
- 19
当文本长度小于td的长度时，使用IE9不能正确显示输入（表td内部）中的文本
- 20
jQuery选择器来查找包含具有特定值的TD输入的TR
- 21
使用Javascript在td中插入新的HTML输入标签？
- 22
使用Javascript在td中插入新的HTML输入标签？
- 23
使用jquery输入数据时调整<td>长度
- 24
取一个输入值，乘以<td>的内容，并使用jQuery在另一个<td>中显示结果
- 25
在文本输入中回显值时如何删除<td> .. </ td>？
- 26
隐藏包含包含特定输入ID的TD的TR
- 27
JQuery td：包含
- 28
HTML表-另一td下的td
- 29
在JQUERY数据表中为新插入的行指定TD类
我来说两句