Maison > interface Web > js tutoriel > Comment générer dynamiquement des colonnes avec DataGird dans jQuery EasyUI_jquery

Comment générer dynamiquement des colonnes avec DataGird dans jQuery EasyUI_jquery

WBOY
Libérer: 2016-05-16 15:06:44
original
1383 Les gens l'ont consulté

DataGird est utilisé pour afficher la liste de données dans EasyUI. Parfois, il est nécessaire d'afficher différentes colonnes selon les besoins. Par exemple, dans la gestion des autorisations, différents utilisateurs ne peuvent afficher les champs de la liste qu'avec leurs propres autorisations après s'être connectés. combinaison dynamique de DataGird Column, ce qui suit présente la méthode de génération dynamique de colonnes par DataGird dans EasyUI.

DataGird génère dynamiquement des colonnes, qui contrôlent en fait la valeur de l'attribut des colonnes de DataGird. Ensuite, appelez de manière asynchrone les données des colonnes d'arrière-plan via ajax pour la liaison.

<table id="dg"></table>
<script>
function easyUIDataGrid(medid) {
var $datagrid = {};
var columns = new Array();
$datagrid.title = "";
$datagrid.height = $(window).height() - 31;
$datagrid.width = $(window).width();
$datagrid.sortName = "dt";
$datagrid.sortOrder = "desc";
$datagrid.idField = "id";
var param = { "medid": medid };
$.ajax({
url: 'getCol.page',
type: 'post',
data: "medid=" + medid,
dataType: "json",
async: false,
success: function (returnValue) {
            //异步获取要动态生成的列 别名,宽度也可以
var arr = returnValue;
$.each(arr, function (i, item) {
columns.push({ "field": item.colname, "title": item.colalias, "width": 100, "sortable": true });
});
$datagrid.columns = new Array(columns);
$('#dg').datagrid($datagrid);
}
});
}
</script>
Copier après la connexion

Ce qui précède est la méthode de génération dynamique de colonnes par DataGird dans jQuery EasyUI introduite par l'éditeur. J'espère qu'elle sera utile à tout le monde !

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