如何使用Jquery Datatables Ellipsis渲染器进行模板字段链接按钮？

当我使用Asp-bound字段时，它的工作非常完美

看第一列是Ellipsed

但是当在模板字段链接按钮上使用时，它返回空白

看到它是空白我不知道我应该怎么做在链接按钮列字段上应用相同的任何建议？

我的Eclipsed脚本

function pageLoad() { var table = $('#gvTest ').DataTable({ select: true, pageLength: 15, lengthChange: false, scrollY: "400px", scrollX: true, scrollCollapse: false, order: [15], fixedColumns: true, columnDefs: [ { targets: 0, render: $.fn.dataTable.render.ellipsis(7, true) }, { targets: 1, render: $.fn.dataTable.render.ellipsis(10, true) }, ], fixedColumns: { leftColumns: 1, } }); $('#BtnReport').click(function () { var ids = $.map(table.rows('.selected').data(), function (item) { return item[14]; }); var suid = ids; var usr = document.getElementById("lblUser").innerText; var url2 = "/report/FinalizedReport.aspx?UID=" + suid + "&" + "user=" + usr; window.open(url2, '_blank'); return false; }); $('#btnAssign').click(function () { var ids = $.map(table.rows('.selected').data(), function (item) { return item[14]; }); var suid = ids; var usr = document.getElementById("lblUser").innerText; var url2 = "/PatientAssignment/PatientAssignPage.aspx?UID=" + suid + "&" + "user=" + usr; window.location.assign(url2); return false; }); $('#btnAttach').click(function () { var ids = $.map(table.rows('.selected').data(), function (item) { return item[14]; }); var arun = ids; if (arun) { var width = 700; var height = 350; var left = (screen.width - width) / 2; var top = (screen.height - height) / 2; var params = 'width=' + width + ', height=' + height; params += ', top=' + top + ', left=' + left; params += ', directories=no'; params += ', location=no'; params += ', menubar=no'; params += ', resizable=no'; params += ', scrollbars=no'; params += ', status=no'; params += ', toolbar=no'; var strWindowFeatures = params; var URL = "/Attachment/PatientAttachmentPage.aspx?"; var usr = document.getElementById("lblUser").innerText; URL = URL + "pattUID=" + arun + "&" + "user=" + usr; +"&" + "url=" + location.href; var win = window.open(URL, "_blank", strWindowFeatures); } else { var a = "Select Patient"; alert(a); } return false; }); $('#btnHistory').click(function () { var ids = $.map(table.rows('.selected').data(), function (item) { return item[14]; }); var arun = ids; if (arun) { var width = 700; var height = 350; var left = (screen.width - width) / 2; var top = (screen.height - height) / 2; var params = 'width=' + width + ', height=' + height; params += ', top=' + top + ', left=' + left; params += ', directories=no'; params += ', location=no'; params += ', menubar=no'; params += ', resizable=no'; params += ', scrollbars=no'; params += ', status=no'; params += ', toolbar=no'; var strWindowFeatures = params; var URL = "/History/WriteHistory.aspx?"; var usr = document.getElementById("lblUser").innerText; URL = URL + "pattUID=" + arun + "&" + "user=" + usr; +"&" + "url=" + location.href; var win = window.open(URL, "_blank", strWindowFeatures); } else { var a = "Select Patient"; alert(a); } return false; }); $('#btnEmergency').click(function () { var ids = $.map(table.rows('.selected').data(), function (item) { return item[14]; }); var suid = ids; if (suid) { document.getElementById("pattUID").value = suid; $('#hdnEM').trigger('click'); return false; } else { var a = "Select Patient"; alert(a); } return false; }); $('#btnRemoveEm').click(function () { var ids = $.map(table.rows('.selected').data(), function (item) { return item[14]; }); var suid = ids; if (suid) { document.getElementById("pattUID").value = suid; $('#hdnREM').trigger('click'); return false; } else { var a = "Select Patient"; alert(a); } return false; }); $.fn.dataTable.render.ellipsis = function ( cutoff, wordbreak, escapeHtml ) { var esc = function ( t ) { return t .replace( /&/g, '&' ) .replace( //g, '>' ) .replace( /"/g, '"' ); }; return function ( d, type, row ) { // Order, search and type get the original data if ( type !== 'display' ) { return d; } if ( typeof d !== 'number' && typeof d !== 'string' ) { return d; } d = d.toString(); // cast numbers if ( d.length < cutoff ) { return d; } var shortened = d.substr(0, cutoff-1); // Find the last white space character in the string if ( wordbreak ) { shortened = shortened.replace(/\s([^\s]*)$/, ''); } // Protect against uncontrolled HTML input if ( escapeHtml ) { shortened = esc( shortened ); } return ''+shortened+'…'; }; }; } 

下面是我的网格视图

       <asp:LinkButton ID="lnkVwr" Text='' OnClientClick = "return imgViewer(this)" runat="server" ></asp:LinkButton     

如何在链接按钮字段中使用此function？ 有没有办法做到这一点？

Answer 1

GridView中的链接应如下所示

 VDWWD 

但在Ellipsis之后它看起来像这样

正如你所看到的那样，它完全搞乱了HTML，难怪浏览器不知道如何处理它。

最重要的是，似乎这个函数没有做任何事情或者没有被调用：

 .fn.dataTable.render.ellipsis = function ( cutoff, wordbreak, escapeHtml ) 

看看这个页面是如何完成的https://datatables.net/blog/2016-02-26

我做了以下代码片段。 它检查字符串中是否存在href ，如果有，则跳过字符串的修剪。