[PHP, AJAX via jQuery] Envoi d'un formulaire

**Gun.Man** · 02/11/2012, 17h15

Bonjour à tous,

Par avance, désolé si ce post n'est pas à sa place... Etant donné que mon problème concerne trois langages, je ne savais pas où placer mon topic...

Je développe un système de news en PHP, très simple :
- Une page d'affichage des news
- Une page d'administration où l'on peut ajouter, supprimer et modifier les news.

J'aimerais utiliser AJAX de manière à pouvoir ajouter, supprimer, modifier mes news sans rafraîchissement de la page. Classique me direz vous

J'utilise javascript et le framework JQuery pour simplifier les requêtes AJAX, étant donné que je ne maîtrise pas du tout ce langage. Je suis également débutant en JQuery mais le PHP ne me pose pas de problème.

Bref, venons en au problème. J'ai un formulaire d'ajout de news, on ne peut plus classique, trois champs : Date, Titre, Contenu. J'essaie de les ajouter dynamiquement. Ce formulaire est dans la page news.php. Le formulaire a pour cible news_ajax.php. Le soucis, c'est que mon code jQuery n'est pas du tout pris en compte.

Si je précise dans mon formulaire : action="news_ajax.php" method="POST",
le formulaire s'envoie classiquement et le navigateur me redirige vers "news_ajax.php". La page d'envoi fonctionne puisque dans ce cas, il y a bien ajout dans la base de données.

Si je ne précise pas ces attributs, les champs sont passés dans l'URL (en GET) et je suis redirigé vers index.php...

Voici le code utilisé :

Dans news.php, dans <body> :

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
echo'<script type="text/javascript">
	$(document).ready(function(){
	$("#addform").submit(function(){
		$.ajax({
			type:"POST", 
			data: $(this).serialize(),
			url:"news_ajax.php", 
			success: function(data){
				$("#post").html(data); },
            error: function(){
			$("#post").html(\'Une erreur est survenue.\');
			}
		});
		return false;
	});
});
	</script>
 
	';

Toujours dans news.php, le code du formulaire :

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
 
 
echo'<div class="modal hide fade" id="nouvelleactu" tabindex="-1" role="dialog" aria-labelledby="nouvelleactu-label" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
<h3 id="nouvelleactu-label">Ajout d\'une actualité</h3>
</div>
<div class="modal-body"><p>
 
<form id="addform">
<legend>Le 22/11/2012</legend>
<fieldset>
<label>Date :</label>
<input type="text" style="width:500px;" placeholder="Date du jour" name="date">
<label>Titre :</label>
<input type="text" style="width:500px;" placeholder="Titre de l\'actualité" name="titre">
<label>Contenu :</label>
<textarea style="width:500px;" name="contenu">Ce texte sera remplacé par un éditeur WYSIWYG...</textarea>
</fieldset>
 
<div id="post"></div>
<p></p></div>
<div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true"><i class="icon-remove-sign"></i> Annuler</button>
<button class="btn btn-primary" type="submit"><i class="icon-save"></i> Enregistrer l\'actualité</button></div></form>
 
';

(Comme vous pouvez le voir, j'utilise Bootstrap et le formulaire est placé dans une boite de dialogue type "modal" - mais le mettre en dehors du modal ne change rien au problème).

Code de traitement du formulaire (news_ajax.php) :

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
 
<?php
 
	include ("../includes/functions.inc.php"); //Contient la connexion mySQL
 
 
	$date        = $_POST['date'];
	$titre        = $_POST['titre'];
	$contenu        = $_POST['contenu'];
 
	$addnews = $bdd->prepare('INSERT INTO adm_news(date,titre,contenu) VALUES(:date,:titre,:contenu)');
	$addnews->execute(array(
	'date' => $date,
	'titre' => $titre,
	'contenu' => $contenu ));
 
	$addnews->closeCursor();
 
 
?>

Je suis un peu désespéré... Désolé pour le long post.

Merci d'avance pour votre aide !

GunMan.

**Gun.Man** · 02/11/2012, 22h22

Bonsoir,

J'ai, au bout de quatre jours de reflexion intense, fini par trouver le problème...

On ne peut appeler une fonction jquery par $ avant d'appeler jQuery.

Honte à moi ! En espérant que celà puisse servir aux autres...

[PHP, AJAX via jQuery] Envoi d'un formulaire

Langage PHP

Discussions similaires

Partager

Partager