Discussion :

[david42800]

Bonjour,

Je vous expose mon problème:

J'utilise ajax pour pouvoir envoyer un formulaire sans recharger la page j'utilise se code la :

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
<script language="JavaScript">
			$(document).ready(function() {
			// lorsque je soumets le formulaire
			$('.monForm').on('submit', function() {		
            // appel Ajax
            $.ajax({
                url: $(this).attr('action'), // le nom du fichier indiqué dans le formulaire
                type: $(this).attr('method'), // la méthode indiquée dans le formulaire (get ou post)
                data: $(this).serialize(), // je sérialise les données (voir plus loin), ici les $_POST
                success: function(html) { // je récupère la réponse du fichier PHP
                //alert(html); // j'affiche cette réponse
                }
            });
        return false; // j'empêche le navigateur de soumettre lui-même le formulaire
		});
	});
		</script>

Quand je l'utilise avec un bouton sa marche sans probleme:

Code :

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

1
2
3
4
 
<form class="monForm" method="post" action="planning_cree.php">
<input type="submit" name="Envoyer" value="Envoyer" onclick="this.disabled=true;this.value='Crée'"/> 
</form>

Âpres j'ai décider de remplacer le bouton par un input de type texte qui utiliserais l’événement onChange

Code :

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

1
2
3
4
 
<form class="monForm" method="post" action="planning_cree.php">
<input type="text" name="Lundi" size="1" onchange="submit();" value="<?php echo $donnees2['Lundi']; ?>" />
</form>

Mais la sa m'ouvre la page planning_cree.php je voudais savoir se que je dois modifier sur le code ajax pour que sa n'ouvre pas la page planning_cree.php.

Merci D'avance !!!

[Bovino]

Oui, c'est normal, l'événement submit n'est pas déclenché si la soumission du formulaire se fait par programmation (méthode submit()).

La solution serait de mettre le code à lancer dans une fonction indépendante que tu pourrais appeler sur le onchange de ton champ et sur le onsubmit du formulaire.

[david42800]

Merci de ta réponse Bovino

Est'il possible de remplacer le submit(); par autre chose pour que sa appelle mon code en AJAX ?

[Bovino]

La solution serait de mettre le code à lancer dans une fonction indépendante que tu pourrais appeler sur le onchange de ton champ et sur le onsubmit du formulaire.

[david42800]

J'ai fait sa :

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
<script>
		function requete() {
			// lorsque je soumets le formulaire
			$('.monForm').on('submit', function() {		
            // appel Ajax
            $.ajax({
                url: $(this).attr('action'), // le nom du fichier indiqué dans le formulaire
                type: $(this).attr('method'), // la méthode indiquée dans le formulaire (get ou post)
                data: $(this).serialize(), // je sérialise les données (voir plus loin), ici les $_POST
                success: function(html) { // je récupère la réponse du fichier PHP
                //alert(html); // j'affiche cette réponse
                }
            });
        return false; // j'empêche le navigateur de soumettre lui-même le formulaire
		});
	}
		</script>

et j'ai appeler la fonction ici :

Code :

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

1
2
3
4
 
<form class="monForm" method="post" action="planning_cree.php">
<input type="text" name="Lundi" size="1" onchange="submit();" value="<?php echo $donnees2['Lundi']; ?>" />
</form>

Mais cela ne marche pas

Peut tu éclairer ma lanterne stp

[Bovino]

Ce n'est pas dans la fonction qu'il faut assigner les événements !

Code :

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

1
2
3
4
5
function requete() {
// ...
}
$('.monForm').on('submit', requete);
$('.monInput').on('change', requete);

En ajustant bien sûr la classe de ton input.

[david42800]

Je me suis pas tromper dans l’appelle dans le onchange ?

Code :

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

onchange="requete();"

[david42800]

Ce n'est pas dans la fonction qu'il faut assigner les événements !

Code :

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

1
2
3
4
5
function requete() {
// ...
}
$('.monForm').on('submit', requete);
$('.monInput').on('change', requete);

En ajustant bien sûr la classe de ton input.

Je dois bloquer sur un truc j'ai ajuster mon code en mettant comme tu ma dit c'est a dire de séparer l'assignement des événements de la fonction.
je l'est mi juste apres mais je sais pas si c'est la bonne place je suis assez perdu .
je pense qu’après sa je vais toucher au but.