Question

I know very little about Javascript and jQuery, and I’m attempting to use jQuery and the dotdotdot plugin to truncate TDs in a table after the second wrapped line.

I figure I’ll never learn without asking;

A. Is this even possible?

B. How would I achieve this with dotdotdot -or- is there a better way?

The image in this other question (Cross-browser multi-line text overflow with ellipsis appended within a width and height fixed `<div>`) is exactly what I want to happen, but I can’t figure out how to adapt it for use in table cells. Without knowing Javascript, jQuery seemed the best suited to do what I had in mind.

Answer 1

Here you go, skips empty cells, doesn’t apply to cells with less than the defined max char count.

$(function(){
  $.each($('td').not(':empty'), function(i,v){
    var count = parseInt($(v).text().length);
    var maxChars = 210;
    if(count > maxChars){
      var str = $(v).text();
      var trimmed = str.substr(0, maxChars - 2);
      $(v).text(trimmed + '...');          
    }  
  });
});

+1 for CraftyFella’s comment

Here’s the working jsFiddle