Replies

• allan Posts: 63,400Questions: 1Answers: 10,452 Site admin

  April 2011

  How are you generating the data for the table at the moment? Is it just going into an HTML page which DataTables will then read form the DOM? If so, just create the A tag like you would normally - i.e. echo '... or something along those lines.
  
  Allan
• mikeddd123 Posts: 6Questions: 0Answers: 0

  April 2011 edited April 2011

  Thanks allan, but where do i put this code?
  In the processing.php or in the index.php (table displaying page)?
  
  Thanks once more!
• GregP Posts: 500Questions: 10Answers: 0

  April 2011 edited April 2011

  Hi Mike,
  
  Allan is suggesting that you put it into the processing.php. I have done this in the past and it works great.
  
  However, we had a requirement to separate the returned data from anything presentational (our application on the server-side was required to not intercept the data object for such modificiations, but to send it along as an unaltered JSON representation of the database request).
  
  What I ended up doing was having the link stored in the database and returned in a separate column from my "click here" text (one database column for "Click Here" equivalent, and one column for the link). I used DataTables to hide the link column from view, and used some JavaScript (inside the DataTables fnRowCallback) to then make the "click here" column clickable.
  
  My application's code is a bit heavy to just copy and paste, but if you think you're interested in storing the link separately, I could do some work to excerpt the appropriate code for you. That said, there's nothing wrong with appending the appropriate HTML with PHP either.
  
  Cheers,
  Greg
• mikeddd123 Posts: 6Questions: 0Answers: 0

  April 2011

  Thanks for your reply Greg, your idea sounds great.
  If you can excerpt the appropriate code that would be great!
  Thanks in advance!
• GregP Posts: 500Questions: 10Answers: 0

  April 2011 edited April 2011

  Here's how I did it. Note that this is part of the fnRowCallback, which in turn is part of the dataTable() initialization, so make sure it ends up in the right place. If anyone else sees this and figures "There's a better way!" I'm all ears!
  
  I tried my best to excerpt this, but I have to admit I didn't field-test the code.What I do here is instead of adding an anchor tag, I make the TD element itself clickable. In my example, I'm using that click to open a new window to the desired URL. In your application, you might want click to do something different. Not sure what your comfort level is with jQuery, but if you're not sure how to proceed, let me know what it's meant to do and I'll try to help. If your requirement is simply to open the resource in the same window, change the window.open line (line 8)to:
  [code]
  window.location.href = myLink;
  [/code]
  ..and I'm pretty sure it'll work (again, not field-tested).
  
  If your requirement is to actually have an anchor tag, that should be easily done, too. Instead of .addClass and .click functions, you would use one of the many jQuery string concatenation functions to modify that TD before returning nRow. I can help out if you need. Here's the code to be added to your dataTable() initialization:
  [code]
  "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
  
  var myLink = aData[2]; // The column in the DATA object with the URL. Change as needed.
  
  if (myLink.length > 0) {
  /* eq(0) defines the VISIBLE column that will be clickable. Change this as needed, or make it into a reusable variable */
  $('td:eq(0)', nRow).addClass('clickable').click(function() {
  window.open(myLink,'Configuration Window','width=1000,height=700');
  return false;
  });
  }
  
  return nRow;
  }
  [/code]
  I think the "return false" is an artifact from when I *DID* use an anchor tag; it might not be needed but I left it there anyhow.
  
  And the CSS for "clickable":
  [code]
  .clickable { cursor: pointer;}
  td.clickable:hover {text-decoration: underline !important; }
  [/code]
  (note: I'm not actually a fan of !important. If you can avoid it, all the better. I can't remember anymore why I just gave up and used it)