Dynamic links in new window

Dynamic links in new window

CurtisKCurtisK Posts: 7Questions: 2Answers: 0

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>

Replies

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    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

  • CurtisKCurtisK Posts: 7Questions: 2Answers: 0

    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?
          }
    
        });
    
      });
    
  • kthorngrenkthorngren Posts: 21,363Questions: 26Answers: 4,956

    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

  • CurtisKCurtisK Posts: 7Questions: 2Answers: 0

    Thanks Colin and Kevin. Consider this discussion answered.

Sign In or Register to comment.