Développer un composant d'affichage de table en jQueryUI
Squelette du plugin :
(function($) {
$.widget("ui.table", {
options : {
name : "table"
},
_create : function() {
},
_init : function() {
this.element.html("<div id='" + this.options.name + "'>"
+ this.options.name + "</div>");
},
_setOption : function(key, value) {
this.options[key] = value;
}
});
$.extend($.ui.table, {});
})(jQuery);
- options : contient la liste des paramètres
- name : nom de la table (préfixe de tous les id générés
- _create : méthode appelée à l'instanciation du contrôle ?
- _init : peut être appelé plusieurs fois (ex: lors de chaque $('#xxx').table() ?)
- _setOption : assigne une option
Utilisation
JS
$(document).ready(function() {
$('#table').table({
name : 'TestTable'
});
});
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
<script type='text/javascript' src='jquery-ui-1.9.2.custom/js/jquery-1.8.3.js'></script>
<script type='text/javascript' src='jquery-ui-1.9.2.custom/js/jquery-ui-1.9.2.custom.js'></script>
<script type='text/javascript' src='test.js'></script>
<script type='text/javascript' src='jquery.table.js'></script>
</head>
<body>
<div id='table'></div>
</body>
</html>
Références
Plugin jQuery : http://docs.jquery.com/Plugins/Authoring
squelette : https://gist.github.com/374414
exemple progressbar très simple : https://github.com/scottgonzalez/jquery-ui-1.8-widget-factory/blob/master/1.8.js
Aucun commentaire:
Enregistrer un commentaire