Bonjour,

Voilà, j'aimerai soumettre mon début de création de plugin à la communauté. Si on trouve à foison des tutos sur la création de plugin jquery, tous proposent des options différentes et très peu vont dans les fonctions un peu avancées et j'ai encore un peu de mal notamment a cause du chaînage.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
 
<script type="text/javascript">
$( document ).ready(function() {
 
	jQuery.fn.Creneau = function(options){
		var defaults = {
				start_date: false,
				end_date: false,
				name: "",
				datas: {}
			};
 
		$(this).each(function(){	
			var params = $.extend({}, defaults, options);
			var myself = $(this);
 
			myself .draw = function() { // aura pour but de redessiner l'element HTML
				return myself;
			};
 
			myself.start = function(d) { // fonction qui permet d'affecter dynamiquement une nouvelle valeur a start_date
				if(d.length)
				{
					if(d instanceof Date)
						params.start_date = d;
					myself.draw();
					return myself;
				}
				else
					return params.start_date;
 
			};
 
			// Si mes propriétés start_date et end_date sont indefinies, j'essaye de les initialiser a partir des data de la balise HTML
			if(!(params.start_date instanceof Date))
				params.start_date = new Date(myself.data("start_date"));
 
			if(!(params.end_date instanceof Date))
				params.end_date = new Date(myself.data("end_date"));
 
			if(params.name.length < 1)
				params.name = myself.data("name");
 
			myself.on("click", function(){
				console.log(params);
			});
			return $(this); // faut-il chainner la ?
		}); // fin each
 
		return this; // ou peut être la ?
	}
 
	$("#truc").Creneau({start_date:new Date(2016, 1, 1, 0, 0, 0),end_date:new Date(2017, 1, 1),name:"salut"});
	var x = $("#truc2").Creneau().start(new Date(2014, 1, 1, 12, 20, 15));
	console.log(x);
});
</script>   
<div id="truc" style="border:1px solid #090;">TEST</div>
<div id="truc2" style="border:1px solid #F00;" data-start_date="2016-03-21T12:00:00" data-end_date="2016-03-21T14:00:00" >TEST 2</div>
Bon, comme ça, ça ne marche pas...

TypeError: $(...).Creneau(...).start is not a function
Le problème reste le même si je remonte start() avant le each()... avec le this, ça marche si la méthodes est au dessus du each... mais c'est dans le each que j'en ai besoin !

Donc comment créer des méthodes pour mon plugin ?

Par ailleurs, avez vous d'autres remarques sur bonne façon de faire un plugin et que je ne respecterai pas du tout ?

En vous remerciant.

Edit : 1er bourde trouver, il faut précisier le this pour définir une méthode, et non pas utiliser var.