Dynamic links in new window

CurtisK

Every row is a different link, I'd like them to open in a new tab/window.

<script type="text/javascript">
  $(document).ready(function() {
    var table = $('#mastertable').DataTable({
        "order": [[2, 'desc']],
        "paging": true,
        "scrollCollapse": true,
        "scrollY": '80vh',
        "lengthMenu": [ [ 100, 250, 500, 1000, -1], [ 100, 250, 500, 1000, "All"] ],
        "columnDefs":
[
    { "visible": false, "targets": [0,4] },

]});    
    $('#mastertable').on( "click", "td", function (e) {

      var rowIdx = table.row( this ).index();
      var sData = table.cells({ row: rowIdx, column: 4 }).data()[0];
      if (sData && sData.length) {
        window.location.href = "" + sData; // How to open this link in new window
      }

    });

  });
</script>

colin

This page here has an interesting discussion showing how to do that in the HTML.

And this example demonstrates how to create that HTML in the columns.render.

Colin

CurtisK

Clarification - Last week I took a URL from one column and displayed it in a different column (https://datatables.net/forums/discussion/78077/2-columndefs). I wanted the link to be more than text and found the code to have the entire row be the link. It works but I'd like it to open a new tab/window. I understand html to do it, perhaps I am a bit confused with the ' and "s of javascript. I think the last line loads the link (window.location.href) but don't know how to code new window into it.

  $(document).ready(function() {
    var table = $('#mastertable').DataTable({
        "order": [[2, 'desc']], // On page load sort by column
        "paging": true, //Allow pagination
        "scrollCollapse": true, // Page scrolls to area below
        "scrollY": '80vh', // Scroling area
        "lengthMenu": [ [ 100, 250, 500, 1000, -1], [ 100, 250, 500, 1000, "All"] ], // Change show entries menu
        "columnDefs":
[
    { "visible": false, "targets": [0,4] }, // make columnd 0 and 4 hidden

]});   
    $('#mastertable').on( "click", "td", function (e) { // start of creating row links

      var rowIdx = table.row( this ).index();
      var sData = table.cells({ row: rowIdx, column: 4 }).data()[0]; // Column to obtain link from
      if (sData && sData.length) {
        window.location.href = "" + sData; // Generate link here but how to have it open in new tab/window?
      }

    });

  });

kthorngren

See this SO thread for how to open a link in a new tab. Use window.open() so you can provide the _blank target as described in the. tutorial Colin linked to.

Kevin

CurtisK

Thanks Colin and Kevin. Consider this discussion answered.