Maison > interface Web > Tutoriel Layui > le corps du texte

Introduction à la méthode de masquage des colonnes dans les tableaux de données de table dans layui

Libérer: 2019-12-27 17:11:21
avant
7647 Les gens l'ont consulté

Introduction à la méthode de masquage des colonnes dans les tableaux de données de table dans layui

Layui est désormais la seule société de modèles nationale. La fonction de table de données est puissante, mais je ne sais pas comment utiliser Python ou Django pour épisser JSON et envoyer la sortie aux données. table. Ensuite, je n'ai pas d'autre choix que d'utiliser une méthode stupide et de la parcourir.

La colonne id est conservée dans la table de données pour obtenir la valeur id des données modifiées lors de l'édition et de la modification, mais elle n'a pas besoin d'être affichée, elle doit donc être masquée.

Le code de la colonne id est :

, cols: [[ //标题栏
                    {field: 'data_id', title: 'ID', width: 50,style:'display:none;'}
Copier après la connexion

Ce code peut masquer la valeur de la colonne id en dessous, mais l'id de la barre de titre est toujours là. Ensuite, le problème survient, utilisez puissant Utilisez jquery pour le résoudre.

 $('table.layui-table thead tr th:eq(0)').addClass('layui-hide');
Copier après la connexion

Lorsqu'il y a plusieurs tables, j'ai trouvé que le code ci-dessus ne peut masquer que la barre de titre de la première colonne du premier tableau. S'il y a plusieurs tables sur une page, vous devez utiliser :

 $('table.layui-table thead tr th:nth-child(1)').addClass('layui-hide');
Copier après la connexion
.

Il y a un autre problème. S'il y a une zone de sélection dans le tableau, elle occupera la première colonne du tableau par défaut. À ce moment-là, le code ci-dessus fonctionnera mal. Vous pouvez uniquement appuyer, utiliser le premier code, sélectionner un par un. Notez que la table de données de layui générera automatiquement 5 tables :

Introduction à la méthode de masquage des colonnes dans les tableaux de données de table dans layui

Ma page actuelle ne contient que deux tables, une normale et une avec une zone de sélection. Après une recherche, j'ai trouvé cela là-bas. sont 10

 $('table:eq(1).layui-table thead tr th:eq(0)').addClass('layui-hide');
$('table:eq(6).layui-table thead tr th:eq(1)').addClass('layui-hide');
Copier après la connexion

Pour plus de connaissances sur Layui, veuillez faire attention à la colonne Tutoriel d'utilisation de Layui.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:cnblogs.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal