DataTables porqué no lo detecta

Iniciado por oscarcaronte, 4 Abril 2021, 12:59 PM

0 Miembros y 1 Visitante están viendo este tema.

oscarcaronte

Hola os paso entero el código porque no consigo que me inmobilice la columna izquierda

hice otro post pero no copié bien

script.js

Creo que no estoy llamando bien a las librerias pero no sé cómo ver donde hay un error.

Código (javascript) [Seleccionar]




$(document).ready(function(){
var dataTable = $('#personal').DataTable({
  "paging": false,

"language": {
"url": "//cdn.datatables.net/plug-ins/1.10.24/i18n/Spanish.json" },
"fixedColumns":   {
            leftColumns: 1
        },
"bFilter": false,

"bInfo": false,
  "processing" : true,
  "serverSide" : true,
"responsive": true,
  "order" : [],
  "ajax" : {
   url:"datos.php",
   type:"POST"
  }

});





$('#personal').on('draw.dt', function(){/*`Oscar``Elena``Carmen``Garijo``Nacho``Prado``Juan``Ondina``Marta``Cristobal``Angeles``Gerardo``Antonio``Gaspar``Raquel``Victor``Reyes``Vanesa`*/
  $('#personal').Tabledit({
   url:'edicion.php',
   dataType:'json',
   columns:{
    identifier : [0, 'idp'],
editable:[[1, 'Oscar'], [2, 'Elena'], [3, 'Carmen'],[4, 'Garijo'],[5, 'Nacho'],[6, 'Prado'],[7, 'Juan'],[8, 'Ondina'],[9, 'Marta'],[10, 'Cristobal'],[11, 'Angeles'],[12, 'Gerardo'],[13, 'Antonio'],[14, 'Gaspar'],[15, 'Raquel'],[16, 'Victor'],[17, 'Reyes'],[18, 'Vanesa']]
   },
   restoreButton:false,
   onSuccess:function(data, textStatus, jqXHR)
   {
    if(data.action == 'delete')
    {
     $('#' + data.idp).remove();
     $('#personal').DataTable().ajax.reload();
    }
   }
  });
});
 
});


index.php

Código (php) [Seleccionar]

<html>
<head>
  <title>Cuadrante de Visitas</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

 
  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.24/css/jquery.dataTables.css">
  <link rel="stylesheet" type="text/css" href="DataTables/datatables.min.css"/>

<script type="text/javascript" src="DataTables/datatables.min.js"></script>
 
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.js"></script>
 

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />

  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  <script src="https://markcell.github.io/jquery-tabledit/assets/js/tabledit.min.js"></script>
</script>

<script src="https://cdn.datatables.net/fixedcolumns/3.3.2/js/dataTables.fixedColumns.min.js"></script>
</head>
<body>
  <div class="container">
   <h3 align="left">Cu Visit</h3>
   <br />
   <div class="panel panel-primary">
    <div class="panel-heading">Anem a més</div>
    <div class="panel-body">
     <div class="table-responsive">
      <table id="personal" class="table table-bordered table-striped">
       <thead class="fixedHeader">

        <tr>
         <th>ID</th>
         <th>Osc</th>
         <th>El</th>
         <th>Carmen</th>
                  <th>Gar</th>
                    <th>Na</th>
         <th>Pra</th>
         <th>Juan</th>
           <th>On</th>
         <th>Marta</th>
         <th>Cris</th>
           <th>Angeles</th>
         <th>Gerardo</th>
         <th>Antonio</th>
           <th>Gaspar</th>
         <th>Raq</th>
         <th>Vic</th>
           <th>Re</th>
         <th>Vanesa</th>

        </tr>
       </thead>
       <tbody></tbody>
      </table>
     </div>
    </div>
   </div>
  </div>
  <br />
  <br />
</body>
</html>

<script type="text/javascript" language="javascript" src="script.js"></script>







EdePC

Activa el scrollX sino no hay barra de desplazamiento para propia tabla y por ende no hay fixedColumns

Código (javascript,2) [Seleccionar]
$('#personal').DataTable({
  scrollX: true,
  fixedColumns: {
    leftColumns: 1
  }
});