Replies

• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  February 2010

  If you use fnInitComplete ( http://datatables.net/usage/callbacks#fnInitComplete ) and then loop over all the elements in the table ( fnGetNodes() ) you can do whatever you want to them - including adding nowrap.
  
  Allan
• jason Posts: 2Questions: 0Answers: 0

  February 2010 edited February 2010

  Thank-you @allen. Worked beautifully. If anyone is interested this allen's solution allowed me to implement a solution in seconds like so:
  
  [code]
  $('#results').dataTable({
  "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
  $(nRow).attr('id', aData[0]);
  return nRow;
  },
  "fnInitComplete": function() {
  $('#results tbody tr').each(function(){
  $(this).find('td:eq(0)').attr('nowrap', 'nowrap');
  });
  },
  "bAutoWidth": false,
  "sPaginationType": "full_numbers",
  "bProcessing": true,
  "sAjaxSource": 'ajax/purchasers.php',
  "aaSorting": [[1,'asc']],
  "aoColumns": [
  { "bVisible": false }, //id
  null,
  { "bVisible": false }, //url
  null,
  null,
  null,
  null,
  null
  ]
  });[/code]
• jneilliii Posts: 15Questions: 0Answers: 0

  May 2010

  You could also do this in your row callback function. An example is shown below.
  
  [code]
  "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
  $('td', nRow).attr('nowrap','nowrap');
  return nRow;
  }
  [/code]
  
  and for those looking to really compress the table, you can wrap the cell contents in a div and set the width to match the headers width set by the aoColumns sWidth property like this. Here we have to loop through all the cells with a function so we know the position of the cell to be able to get the width property of the header row.
  
  [code]
  "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
  $('td', nRow).each(function (iPosition){
  var sCellContent = $(this).html();
  sCellContent = '' + sCellContent + '';
  $(this).html(sCellContent);
  });
  return nRow;
  }
  [/code]