Solved: Data Tables Select | Experts Exchange

Data Tables Select

14 Comments

1 Solution

286 Views

Last Modified: 2017-12-19

Hi,

I am trying to get Data Tables Select working on this page http://kroweb.dk/gfdev/kancelli_raw2/kancelli.php

I have downloaded the Select extension (Select - 1.2.4) and uploaded it to my page, and I have set select to true in the scripts. But it is not working. Can anybody help with this :)

I have this main file which I believe is the one we should look into :)

<?php
session_start();
error_reporting(E_ALL);
ini_set('display_errors', 1);
?>


<!DOCTYPE html>
<html lang="da">
<head>
  <!-- Check for title--> 
  <title>Dansk Kancelli</title>

  <meta charset="utf-8" lang="da">

  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="style.css">    
  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

  

  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.16/datatables.min.css" />

  <script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.16/datatables.min.js"></script>

  <script type="text/javascript">
  $(document).ready(function() {
    $('#tdata').dataTable( {
      responsive:true,
      select: true,
      
    } );
  } );
  </script>

</head>


<body>
 <!-- Page content start-->        
 <div class="w3-row" style="overflow: auto">

  <!-- Main page start-->  

  <div class="w3-row">
    <!-- Column1 start-->         
    <div class="w3-col w3-mobile" style="width:80%; margin-top: 10px; margin-left: 20px; margin-bottom:10px; padding-bottom: 10px;"> <br>

      <div id="KcList" class='list' ></div>


      <hr style= 'border-color: #9F5584; margin-bottom:0px; margin-top:0px;'>
      <br>
      <div class="w3-row"> <!-- for content inside this column -->
      </div>
    </div>
    <!-- Column1, end-->

    <!-- Column3 start--> 
    <div class="w3-col w3-mobile" style="width:15%; margin-top: 10px; margin-left: 10px; margin-bottom:10px;"> 
      <div class="container" style="border: 1px solid #666666; margin-top: 20px; margin-bottom: 20px;"><h5>Interessante og meget anvendte arkivalier, herunder fra Dansk Kancelli, Suppliker og Registre og Tegnelser</h5>
      </div>
      <img src= "Praest_der_laeser.png" alt="Slægtsforsker" style="width:100%; border: solid 1px #cccccc;"> 
    </div>
    <!-- Column3 end--> 

    <script>
    $('#KcList > table').remove();    
    $.ajax({
     url: 'ajaxFtListHtml.php',
       //data: $('#search').serialize(),
       method:'POST',
       dataType: 'html'
     }).done(function (res){             
      $('#KcList').html(res);
      $('#tdata').DataTable({select: true, searching: true, paging: false, info: false, "dom": '<"top"<if>', order: []});
      
    });         

     </script>  
   </div>
   <!-- Main page end--> 
   

 </body>   
 </html>
</div>  
<!-- Page content end-->

Open in new window

Data Tables Select

Premium Content

Premium Content

Why Experts Exchange?

Ask ANY Question

Did You Know?