UI Dialog, comment modifier les boutons
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:
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:
$(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.