Formulaire et boite de dialogue

**itachis** · 19/06/2014, 14h30

Bonjour,

Code html :

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

1
2
3
4
<form method=POST action=traitement.php id>			
  <input type=hidden name=nom_fichier value=$rep>																	
 <input type=submit name=bnt_fic value=gerer ><input type=submit name=bnt_fic id=bnt_fic value=Supprimer >
</form>

Code :

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

1
2
3
4
5
6
$("body").append("<div id=msg></div>");
$("#bnt_fic").click(function(){ //clic sur le boutton supprimer	
	$("#msg").text("voulez vous vraiment supprimer?");
	$( "#msg" ).dialog({ buttons:{"Oui": function() { $( this ).dialog( "close" ); return true;} ,"Non": function() { $( this ).dialog( "close" ); return false;} }});
 
 });

j'essaye de faire en sorte que si l'utuilisateur click sur le boutton supprimer, la boite de dialogue de confirmation s'affiche. Si le choix est oui on envoi le formulaire sinon on annule l'envoie du formulaire. mais quand je click sur supprimer la boite de dialogue apparait puis disparait instantannement.
Si quelqu'un a une idée pour maintenir la boite de dialogue et tester si l'utilisateur a clické sur oui ou non pour que je puisse renvoyer true ou false(envoyer ou non le formulaire).
Le gros problème est que je n'arrive pas à recuperer et tester le bouton clicker dans la boite de dialogue.

**Bovino** · 19/06/2014, 15h02

Déjà, fais attention à ton code HTML. Même si ce n'est pas obligatoire dans certains cas, il est toujours recommandé d'entourer les valeurs d'attributs de quotes.

Quant à ton problème, c'est tout à fait logique : ton bouton est un bouton submit, donc quand tu cliques dessus, le code JavaScript lié au clic du bouton est exécuté puis, si tu n'as pas stoppé l'événement, le formulaire est soumis, du coup ta boite de dialogue ne sert à rien.

**itachis** · 19/06/2014, 15h14

justement c'est pourquoi je veux recuperé les boutons puis les testé mais le soucis est que je sais pas comment recuperer le bouton clické.

**iakou** · 19/06/2014, 16h24

Bonjour.

Copiez cette page et sauvez la en ".html". Vous pourrez ainsi la tester immédiatement en l'ouvrant avec votre navigateur favori !...

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
<html><head>
<script type="text/javascript">
function confirmDelete()
     {
if (confirm("Etes-vous sûr de vouloir supprimer ?...") )
     {
     alert ("à la place de cette boite, il faut envoyer le formulaire !...");
     }          
     }
</script>
</head><body>
<form method="POST">
      <input type="submit" value="gerer"  onclick="javascript:alert('On va gérer !');">
      <input type="submit" value="Supprimer" onclick="confirmDelete()">
</form>
</body></html>

Cordialement

**itachis** · 19/06/2014, 16h48

iakou merci pour ta reponse mais j'utilise déja un version avec la boite confirme qui marche très bien que voici:

Code :

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

1
2
3
4
5
6
7
8
 
 $("#bnt_fic").click(function(){ //clic sur le boutton supprimer
	var conf=confirm("voulez vous vraiment supprimer?");
	var message;
	if(conf==true) {message="fichier supprimé"; return true;}
	else {message="suppression annulé";return false;}
	alert(message);
 });

mais je veux faire avec les boites de dialogue personnalisé de jquery-ui comme je l'ai si bien expliqué plus haut.

Merci d'avoir essayé.

**iakou** · 19/06/2014, 16h57

De rien !
(Pourtant le code que je vous ai donné, fait ce que vous demandiez... Mais pas en Jquery...)

**Bovino** · 19/06/2014, 16h58

Oui, mais ce que tu fais ne peut pas marcher. Le navigateur ne va pas attendre que l'utilisateur clique sur un bouton de ton dialog pour continuer à faire ce qu'il a à faire ! Donc quoi qu'il arrive, ton formulaire est soumis.
Il existe diverses méthodes pour éviter cela, par exemple de remplacer ton submit par un simple input type button, du coup, quand tu cliques dessus, ça affiche ton dialog, mais le formulaire n'est pas soumis, ensuite, lorsque tu cliques sur le bouton OK, tu génères le submit du formulaire.

**itachis** · 19/06/2014, 17h09

ok je vais essayer de faire comme tu le dit Bovino mais j'avais cru qu'il était possible de recuperer la valeur de retour de la boite dialogue dans une variable pour ensuite testé si cette variable égale à oui ou non.

**iakou** · 19/06/2014, 17h24

Oui !
Evidemment, si on veut le formulaire dans la même page...

Et un lien vers une pop-up contenant votre formulaire. Non ?...

**Bovino** · 19/06/2014, 17h30

Oui, c'est théoriquement possible, mais si ton formulaire est soumis entre temps, ben tu quittes la page, donc tu perds l'info.

En gros, le déroulement de ton code, c'est :
* je clique sur le bouton submit ;
* le code JavaScript associé affiche une boite de dialogue qui possède deux boutons ;
* le formulaire est soumis ;
* ~~je clique sur le bouton Oui ou Non~~ <= impossible puisqu'on a quitté la page à l'étape précédente !

Ce que je te propose, c'est :
* je clique sur le bouton simple ;
* le code JavaScript associé affiche une boite de dialogue qui possède deux boutons ;
* ~~le formulaire est soumis~~ <= plus maintenant, ce n'est plus un submit ;
* je clique sur le bouton Oui ou Non ;
* si Oui, je soumets le formulaire ;
* si Non, je ferme juste le dialog.

**itachis** · 19/06/2014, 17h35

au faite je veux appliqué ce principe:

Code :

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

1
2
3
4
5
 
var conf=confirm("voulez vous vraiment supprimer?");
	var message;
	if(conf==true) {message="fichier supprimé"; return true;}
	else {message="suppression annulé";return false;}

je veux faire pareil avec celui-ci:

Code :

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

1
2
3
4
 
var a=$( "#msg" ).dialog({ buttons:{"Oui": function() { $( this ).dialog( "close" ); return true;} ,"Non": function() { $( this ).dialog( "close" ); return false;} }});
if(a==true) return true;//le submit sera executé
else return false;//le submit sera pas exécuté !

mais je n'ai aucun resultat dans la variable a. dans les conditions normale je devrais avoir une valeur dans a.

**itachis** · 19/06/2014, 17h40

au faite Bovino je controle deja la soumission du formulaire mais mais comment recuperer le bouton cliké d'une boite de dialogue personnalisé de jquery-ui dans une variable .

**itachis** · 20/06/2014, 11h43

Bovino j'ai essaye de faire comme tu me la demandé mais j'ai un problème entre ma requete ajax et ma php qui est appelé voici le code executé lorsque c'est oui qui est clické dans la boite de dialogue:

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
$("#bnt_fic").click(function(){  
var boutton=$(this).val();
//$("#confxml input[type='hidden']").attr("value") à pour valeur le fichier devant être supprimé
  $.ajax({
		type: "POST",
		data:'bnt_fic='+button+ '&nom_fichier'+$("#confxml input[type='hidden']").val(),
		url: $("#confxml").attr("action"),
		success: function(retour,statut){ 
			alert(statut);
		},
		error : function(resultat, statut, erreur){
			alert(resultat+""+statut+""+erreur);
		}
	});
 })

voici le code de la page php qui supprime le fichier en question:

Code php :

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

1
2
3
4
if(isset($_POST['bnt_fic']) && $_POST['bnt_fic']=="Supprimer" ){
unlink($_POST['nom_fichier']);
echo header("location:page.php");
}

voici le formulaire :

Code html :

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

1
2
3
4
<form method=POST action=supprime.php id=confxml>																		
  <input type=hidden name=nom_fichier value=$rep>																	
  <input type=submit name=bnt_fic value=gerer ><input type=button name=bnt_fic id=bnt_fic value=Supprimer >															
</form>

le soucis est que la fonction succes de ma requete ajax s'execute mais le fichier n'est pas supprimer je sais pas pourqoi

**Bovino** · 20/06/2014, 12h07

Envoyé par Bovino

Déjà, fais attention à ton code HTML. Même si ce n'est pas obligatoire dans certains cas, il est toujours recommandé d'entourer les valeurs d'attributs de quotes.

Sinon

Code :

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

data:'bnt_fic='+button+ '&nom_fichier'+$("#confxml input[type='hidden']").val(),

Ici, tu transmets bien le paramètre bnt_fic avec comme valeur celle contenue dans la variable button, en revanche, le second paramètre est nommé 'nom_fichier'+$("#confxml input[type='hidden']").val() et ne possède pas de valeur !

**itachis** · 20/06/2014, 12h15

en revanche, le second paramètre est nommé 'nom_fichier'+$("#confxml input[type='hidden']").val() et ne possède pas de valeur !

Tu veux dire que la syntaxe du second paramètre est incorrect ? soit un peu plus claire!!

**Bovino** · 20/06/2014, 12h20

soit un peu plus claire!!

Clair, à la rigueur... mais claire, ça me vexe un peu quand même...

Sinon, je t'ai donné toutes les informations pour que tu puisses détecter ton erreur, tu pourrais chercher un peu.

Allez, pour fêter la venue prochaine de l'été et l’éternel retour du soleil, un petit indice : les valeurs GET sont passées au serveur sous la forme nom=valeur...

**itachis** · 20/06/2014, 12h32

Ne fait pas attention aux fautes d’orthographes, je suis tellement impatient que je ne vérifie pas l’orthographe

merci pour les reponses,Je crois que je vais chercher.

**Bovino** · 20/06/2014, 12h40

Je crois que je vais chercher

Bah... ça devrait pas être trop long quand même...
Dans mon dernier message, il y a un caractère que j'ai essayé de rendre assez visible [1], dans celui d'avant, il y a la copie du code correspondant aux paramètres que tu souhaites envoyer [2].
A partir de [2], repère le caractère "&" correspondant au second paramètre, ensuite, inspecte attentivement chaque caractère suivant jusqu'à trouver [1].
Si ta recherche est infructueuse, tu auras peut-être trouvé la solution...

**itachis** · 20/06/2014, 12h41

oooooh la vache j'avais même pas vu, il manquait juste "=" au niveau du second paramettre!

Code :

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

'&nom_fichier='+$("#confxml input[type='hidden']").val()

mdrr

Formulaire et boite de dialogue

jQuery

Discussions similaires

Partager

Partager