<br/> HTML 标题中的标签中断了 jQuery DataTables 中的 pdfmake 导出
<br/> tag in HTML title breaks pdfmake export in jQuery DataTables
我正在尝试格式化数据在 jquery DataTable 中的显示方式。
如果文本很长,我将其截断如下:
{
"data": "col1", "render": function (data, type, row) {
if (type === 'display' && data != null) {
data = data.replace(/<(?:.|\n)*?>/gm, '');
data = data.split("; ").join("<br/>");
if (data.length > 85) {
return '<span class=\"show-ellipsis\" title="'+data+'">' + data.substr(0, 85) + '</span><span class=\"no-show\">' + data.substr(85) + '</span>';
} else {
return data;
}
} else {
return data;
}
}
},
并使用以下 CSS 和 jquery UI 工具提示。
CSS
span.no-show {
display: none;
}
span.show-ellipsis:after {
content: "...";
}
jQuery UI 工具提示
<script>
$(function () {
$(document).tooltip({
items: 'span.show-ellipsis',
content: function () {
return $(this).attr('title');
},
position: {
my: "center bottom",
at: "center top-10",
collision: "flip",
using: function (position, feedback) {
$(this).addClass(feedback.vertical)
.css(position);
}
}
});
});
这样它在 DataTable 中显示得很好,
上面的屏幕截图在替换方法中使用 <hr>
而不是 <br/>
标记,但行为保持不变。如果我用 \n
替换它就可以正常工作。当我尝试导出 pdf 时,数据会重复。特别是 data.substr(85) 部分。
我做错了什么?
谢谢
好的,在您的按钮中
extend: 'pdfHtml5',
exportOptions: {
orthogonal: 'export',
}
在您的专栏中:
render: function (data, type, row) {
return type === 'export' ? row.Descripcion: "";
}
我正在尝试格式化数据在 jquery DataTable 中的显示方式。
如果文本很长,我将其截断如下:
{
"data": "col1", "render": function (data, type, row) {
if (type === 'display' && data != null) {
data = data.replace(/<(?:.|\n)*?>/gm, '');
data = data.split("; ").join("<br/>");
if (data.length > 85) {
return '<span class=\"show-ellipsis\" title="'+data+'">' + data.substr(0, 85) + '</span><span class=\"no-show\">' + data.substr(85) + '</span>';
} else {
return data;
}
} else {
return data;
}
}
},
并使用以下 CSS 和 jquery UI 工具提示。
CSS
span.no-show {
display: none;
}
span.show-ellipsis:after {
content: "...";
}
jQuery UI 工具提示
<script>
$(function () {
$(document).tooltip({
items: 'span.show-ellipsis',
content: function () {
return $(this).attr('title');
},
position: {
my: "center bottom",
at: "center top-10",
collision: "flip",
using: function (position, feedback) {
$(this).addClass(feedback.vertical)
.css(position);
}
}
});
});
这样它在 DataTable 中显示得很好,
上面的屏幕截图在替换方法中使用 <hr>
而不是 <br/>
标记,但行为保持不变。如果我用 \n
替换它就可以正常工作。当我尝试导出 pdf 时,数据会重复。特别是 data.substr(85) 部分。
我做错了什么?
谢谢
好的,在您的按钮中
extend: 'pdfHtml5',
exportOptions: {
orthogonal: 'export',
}
在您的专栏中:
render: function (data, type, row) {
return type === 'export' ? row.Descripcion: "";
}