Maison > interface Web > Tutoriel Layui > Comment obtenir des données de table dans Layui

Comment obtenir des données de table dans Layui

王林
Libérer: 2020-11-30 10:01:48
original
16147 Les gens l'ont consulté

Comment obtenir des données de table dans layui : 1. Créez un tableau d'objets js pour enregistrer les données d'origine dans la table ; 2. Attribuez le paramètre de données de [table.render()] au tableau d'objets ; . Obtenez simplement les données dans tableContent.

Comment obtenir des données de table dans Layui
L'environnement d'exploitation de ce tutoriel : système Windows 10, layui version 2.5.6 Cette méthode convient à toutes les marques d'ordinateurs.

Idées :

1. Créez un tableau d'objets JS avec une portée appropriée pour enregistrer les données d'origine dans la table de données.

2. Attribuez le tableau d'objets JS créé à l'étape précédente, qui correspond aux données d'origine, au paramètre data de table.render().

3. Pour obtenir toutes les données du tableau, vous pouvez directement obtenir le tableau d'objets JS créé dans la première étape. Référez-vous au code suivant pour obtenir toutes les données du tableau en récupérant les données dans tableContent. .

Implémentation du code :

// 存放数据表格中的数据的对象数组tableContent
var tableContent = new Array();

table.render({
 elem : '#viewTable',
 height : 325,
 even: true,
 text: {
 none: '您没有选中任何字段!'
 },
 // 拿对象数组tableContent中的数据作为原始数据渲染数据表格
 data : tableContent, 
 page : {
 layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
 },
 limit : 5,
 limits : [5, 10, 15, 20, 25],
 cellMinWidth: 80,
 cols:[[
 {type:'checkbox',fiexd : 'left'},
 {title : '序号',type:'numbers'},
 {field : 'column',title : '列',align:'center'},
 {field : 'alias',title : '别名',align:'center',edit : 'text'},
 {title : '操作',fiexd : 'right',align:'center', toolbar: '#viewBar'}
 ]],
 done : function(res, curr, count){
 // do something...
 }
});
Copier après la connexion

Les données de la table de données sont obtenues via une requête asynchrone

Elles peuvent être obtenues directement via le paramètre done de table.render(), qui paramètre La valeur est un rappel après le rendu des données. Qu'il s'agisse d'une affectation directe ou d'une demande asynchrone de données, le rappel sera déclenché une fois le rendu terminé. Remarque : Lorsque vous utilisez la méthode d'affectation directe aux données originales de Laytable, cette méthode obtient les données de la page actuelle dans le tableau de données, pas toutes les données du tableau. Si vous souhaitez obtenir toutes les données du tableau, vous devez le faire. doit suivre ce qui précède "Les données dans le tableau de données sont la méthode "Par affectation directe"

table.render({ //其它参数在此省略
 done: function(res, curr, count){
 //如果是异步请求数据方式,res即为你接口返回的信息。
 //如果是直接赋值的方式,res即为:{data: [], count: 99} data为当前页数据、count为数据总长度
 console.log(res);
 //得到当前页码
 console.log(curr);
 //得到数据总量
 console.log(count);
 }
});
Copier après la connexion

Recommandations associées : 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:php.cn
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