1 Présentation

1. Qu'est-ce qu'easyui ?

easyui est une collection de plug-ins d'interface utilisateur basés sur jQuery, c'est-à-dire que la principale technologie utilisée par easyui est jQuery, et il fournit des plug-ins qui sont affichés dans l'utilisateur interface.

2.easyui est une extension du plug-in HTML, donc l'utilisation d'easyui pour créer un plug-in doit être combinée avec le plug-in HTML correspondant, tel que la validatebox fournie par easyui textboxfilebox dateboxdatatimebox, etc. doit être implémenté sur la balise

3.data-options

est utilisé pour instancier des plug-ins, c'est-à-dire pour ajouter de nouvelles fonctionnalités au plug-in de base easyui- dans. Les nouvelles fonctionnalités peuvent être centralisées Écrit dans l'attribut data-options , la valeur de l'attribut est entourée de guillemets simples et les deux attributs sont séparés par des virgules. Les nouvelles fonctionnalités peuvent également être répertoriées individuellement.

4. Chaque plug-in peut être considéré comme un conteneur pour ajouter d'autres plug-ins. La méthode d'ajout est la suivante :

Référence. d'autres plug-ins via l'identifiant des attributs correspondants, tels que l'ajout de la barre d'outils toolbar="#toolbar" et l'ajout de boutons boutons="#boutons".

5. Format de syntaxe pour appeler la fonction du plug-in :

$(selector).插件名("方法名"[参数值]);

Copier après la connexion

6.href recharger l'url

href : chargement statique, chargement des informations de page spécifiées.
reload : chargement dynamique, piloté par des événements, tels que cliquer sur un bouton pour charger les informations de page spécifiées.
url : pointe vers les ressources du serveur et obtient les données du serveur.

Deuxième grille de données de la grille de données

1. Fonction

Données La grille est principalement utilisée pour afficher les données obtenues à partir de la base de données via Ajax sous forme de tableau.

2. Le format de chaîne json renvoyé par le serveur :

"rows":[{},{}]",total":int数据

Copier après la connexion

3. La grille de données est construite sur HTML au-dessus de la balise

4. Une fois la page chargée, datagrid obtient automatiquement les données du serveur via Ajax, et l'URL doit être indiquée lors de l'instanciation du plug-in.

5.attribut datagrid

Ajouter une barre d'outils : toolbar="#toolbar".
Afficher les numéros de ligne : rownumbers="true".
Seule la sélection sur une seule ligne est autorisée : singleSelect="true".
Ajuster les colonnes à la largeur du tableau : fitColumns="true":.
Afficher la barre de pagination : pagination="true".

6. En-têtes de colonnes

<thead>  <tr><th field="在此列显示的数据库字段"width="">列标题</th><th field="在此列显示的数据库字段"width="">列标题</th>  </tr></thead>

Copier après la connexion

7. Obtenir les lignes sélectionnées

var row=$(selector).datagrid("getSelected")

Copier après la connexion

la ligne représente la ligne sélectionnée, y compris toutes les données, y compris l'identifiant, le format des données :

{name01:"value01",name02:"value02"}

Copier après la connexion

8. Les données du formulaire sont à recharger après modification :

$(selector).datagrid("reload");

Copier après la connexion

Trois formulaires

1.form("clear") : Effacez le formulaire.

2. Charger les données

$(selector).form("load",{name:"myName"});//加载自定义数据
$(selector).form("load",row);//加载datagrid选中行数据

Copier après la connexion

3. Soumission du formulaire

$(selector).form('submit',{
                           url:xxx,
                           onSubmit:function(){
                                    return $(this).form("validate")；//验证，只要在前台验证通过后才提交
                                               },
                           success:function(){}//处理返回结果
})

Copier après la connexion

S'il n'est pas nécessaire de traiter les données de retour Ajax, la soumission peut être abrégée en :

$(selector).form("submit");

Copier après la connexion

4. Utilisez easyui Après avoir soumis le formulaire, le formulaire ne sautera pas automatiquement. Si vous devez sauter, vous devez définir la ressource de saut dans la fonction de rappel, telle que window.location.href=". ".

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：

easyui

source：php.cn

Article précédent：À propos de la sérialisation, de la sérialisation et du code d'exemple de traitement des signatures Article suivant：Effet jQuery - introduction à la méthode toggle()

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

Derniers articles par auteur