DataTable En-Tête Fixe Ne Fonctionne Pas

J'ai une table à l'aide de datatables plug-in.

Je suis en train de faire mon tableau d'en-tête fixe, et suivez ce lien : ici

$('.device-table').DataTable( {
    "fixedHeader": {
        header: true,
    },
    "bLengthChange": false,
    "Filter": false,
    "Info": false,
} );

Je ne vois pas l'effet.

J'ai inclus deux js fichiers de tables de données et fixedHeader:

<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/fixedheader/3.1.2/js/dataTables.fixedHeader.min.js" type="text/javascript"></script>

Question

Comment peut-on aller sur et déboguer ce ?

Je suis de l'ouverture à toutes les suggestions en ce moment.

Tous les conseils /suggestions /aide sur ce sera très apprécié !

  • Pouvez-vous nous faire un rapide violon avec votre code et de partager le lien de debug?
  • Avez-vous vérifié le jsfiddle? ça ne fonctionne pas... vérifiez la console d'erreurs
  • vérifiez à nouveau? veuillez assurez-vous que la prochaine fois ça fonctionne vraiment...
  • Essayez celui-ci : jsfiddle.net/bheng/s2xbf9d0/5/show
InformationsquelleAutor kyo | 2016-11-01
  1. 18

    Pour la fixedHeader plugin fonctionne, vous devez également l' css fichier:

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/fixedheader/3.1.2/css/fixedHeader.dataTables.min.css">

    Vérifier cette mise à jour:

    https://jsfiddle.net/s2xbf9d0/6/

    • J'ai ajouté votre suggestion et n'a toujours pas le voir. Découvrez-le ici = jsfiddle.net/bheng/s2xbf9d0/10
    • Vous êtes déconner les styles 🙂 retirez le height: 150px; que vous avez dans le css et l'ensemble scrollY: '150px' dans le DataTable constructeur de la place. Vérifiez ici: jsfiddle.net/s2xbf9d0/11
    InformationsquelleAutor Dekel
  2. 5

    Votre violon semble être à côté de la dataTables.fixedHeader plugin ainsi que les fixedHeader.dataTables fichier CSS qui a été la cause vous à la page à partir de rendu correctement (avec le fixe en-têtes).

    De travail de DÉMONSTRATION: - https://jsfiddle.net/s2xbf9d0/7/

    Espérons que cette aide!

    InformationsquelleAutor David R