Discussion :

[grunk]

Bonjour à tous,

J'ai sur ma page plusieurs div, chaque div contient une image (class css imgDel). Un clic sur cette image doit ouvrir une boite modal via dialog() me demandant de confirmer la suppression , et le cas échéant de faire la suppression.
Voici comment je procède :

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
$('div img.imgDel').click(function(e){
 
	e.preventDefault();
        // Récupération de l'id de l'élément déclencheur
	var id = this.id.substr(2);
	$('#confirm_dialog').dialog({
		bgiframe:true,
		autoOpen:true,
		resizable:false,
		height:200,
		modal:true,
		buttons:{
			'Supprimer' : function(){
				var idEl = id;
				$.post(
						'calendrier/ajax_legend.html',
						{
							id : idEl,
							action: 'del',
							csrf_protect : '{{token}}'
						},
						function(responseText){
							if(responseText == 'ok'){
								$('#l_'+idEl).parent().remove();
								$('#confirm_dialog').dialog('close');
							}else{
								alert('Une erreur est survenue pendant la suppression.');
							}
						}
					);				
 
			},
 
			'Annuler' : function(){
				$(this).dialog('close');
			}
		}
	});
});

Tout marche très bien pour le premier clic , ma boite s'ouvre , si je confirme , ma requête ajax est effectué, l'lélément dans bdd supprimé et celui dans la page disparait.
Or si je clic sur une nouvelle image pour supprimer un nouveau div , la boite modal n'apparait plus alors que pourtant je rentre bien dans la fonction de l'événement.

J'ai l'impression que le

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(this).dialog('close');

Supprime le code html de la boite de dialog et il ne peut par conséquent plus en afficher de nouvelle.

Comment puis je remédier à ce problème ?

De plus , est il possible de récupérer l'id de l'élément déclencheur directement dans la fonction abstraite qui défini le comportement des boutons de la boite de dialogue ?

Note : Je débute en jquery , n'hesitez pas à me corriger si je ne suis pas la philosophie de développement du framework.

[danielhagnoul]

Bonsoir.

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
 
<script type="text/javascript">
	$(document).ready(function(){
		$("#dialog").dialog({
			bgiframe:true,
			autoOpen:false,
			resizable:false,
			height:200,
			modal:true
		});
 
		$("img.imgDel").click(function(){
			var id = this.id;
 
			$("#dialog").dialog('option', 'buttons', {
				"Supprimer": function(){
					alert(id);
					$(this).dialog('close');
				},
				"Annuler": function(){
					$(this).dialog('close');
				}
			});
 
			$("#dialog").dialog("open");
 
			return false;
		});
	});
</script>

[grunk]

Salut et merci,

Donc si je comprend bien , c'est le fait de redéclarer la Dialog a chaque clic et le l'ouvrir en autoOpen plutôt qu'avec un Dialog('open') qui me posais problème ?

[danielhagnoul]

Bonjour.

La réponse est : oui.