Jquery / Ajax Envoier des informations à php

Résolu/Fermé

88av Messages postés 262 Date d'inscription dimanche 3 mars 2013 Statut Membre Dernière intervention 17 avril 2015 - 17 janv. 2014 à 21:17
88av Messages postés 262 Date d'inscription dimanche 3 mars 2013 Statut Membre Dernière intervention 17 avril 2015 - 18 janv. 2014 à 20:27

Bonjour,

J'ai créer ( a partir de ce tutoriel : http://www.finalclap.com/tuto/cours-jquery-61/ ) ces codes :

Multi.php :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>Tous les calculs !</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>
<meta http-equiv="language" content="fr">
<meta name="description" content="Sur cette page, vous pourrez calculer beaucoup de choses différentes.">
<meta name="keywords" lang="fr" content="calculatrice, calculatrices, convertisseurs, convertisseur, gratuit, gratuite, gratuits, gratuites, rapide, rapides, simple, simples, calculettes, calculette, calculateur, calculateurs, calculator, online, calculs, calcule, calculer, pratique, pratiques, en ligne">
<link rel="stylesheet" media="screen" type="text/css" title="Design espace" href="../style.css" />
<link rel="shortcut icon" href="../calculatrice.ico"/>
</head>
 
<body>
 <br/><br/><br/><br/><br/><br/><br/>
<a href="" id="lien_addition">Addition</a>

 
<script type="text/javascript">

jQuery(document).ready(function($){
		
		$('#lien_addition').click(function(e){
		e.preventDefault();   // On désactive le lien
		
	if(document.getElementById('div_addition')){} else {
		
		var new_element = jQuery('<div id="div_addition" style="width:200px; height:200px; padding:5px; background-color:#0096E1; position:absolute; top:150px; left:300px; border: 10px solid #1800F3"><div class="description"><form id="formulaire_addition" autocomplete="off">Addition :<br/><br/><input type="text" name="addi1" style="text-align: center;" id="addi1"/><br/> + <br/><input type="text" name="addi2" style="text-align: center;" id="addi1"/><br/><input type="submit" value="calculer" id="valider_addition"/></form><div id="retour"><i>vide</i></div></div></div>'
		
		);
		$('body').append(new_element);
		$(function(){$('#div_addition').draggable().resizable();});
			
	}		
	});
	
	
//	if(document.getElementById('div_addition')){} else {
	$('#formulaire_addition').submit(function(e){
        // On désactive le comportement par défaut du navigateur
        // (qui consiste à appeler la page action du formulaire)
        e.preventDefault();
         
        // On envoi la requête AJAX
        $.getJSON(
            'multi/addition.php',
            {addi1: $('#addi1').val()},
			{addi2: $('#addi2').val()},
            function(data){
			$('#retour').hide();
            $('#retour').html('')
                    .append(data.addi1+' + '+data.addi2+' = '+data.resultat);
			$('#retour').fadeIn();
            }
        );
    });
//}
});
</script>
 
</body>
</html>

Et le code php :

addition.php :

<?php

$addi1 = '';
if( isset($_GET['addi1']) ){
    $addi1 = $_GET['addi1'];
}

$addi2 = '';
if( isset($_GET['addi2']) ){
    $addi2 = $_GET['addi2'];
}
 
$retour = array(
    'addi1' => $addi1,
	'addi2' => $addi2,
	'resultat' => $addi1+$addi2,
);
 
// Envoi du retour (on renvoi le tableau $retour encodé en JSON)
header('Content-type: application/json');
echo json_encode($retour);
?>

Voici mon problème :

Lorsque l'on clique sur "addition", une fenêtre s'ouvre, avec deux champs de textes. Quand on remplit ces deux champs de textes, et que l'on valide, la page se recharge avec comme paramètre les valeurs saisi, alors que, dans le tutoriel, la page ne s'actualise pas, elle envoie les informations au fichier php, le fichier php renvoie les informations ( après les avoir traitées ) au fichier multi.php

Pouvez-vous me dire quelle est le problème ?

Merci d'avance,

Cordialement

A voir également:

Jquery / Ajax Envoier des informations à php
Entrer les informations d'identification reseau - Guide
Easy php - Télécharger - Divers Web & Internet
Facebook envoie des invitations tout seul ✓ - Forum Facebook
En informatique, les informations sont codées par des 0 et des 1, appelés bits. un bit correspond à un espace mémoire. parmi les séquences ci-dessous, lesquelles occupent le moins d'espace en mémoire ? - Forum Programmation
La poste est prête à prendre en charge votre envoi. dès qu'il nous sera confié, vous pourrez suivre son trajet ici. ✓ - Forum Mobile

1 réponse

Réponse 1 / 1

88av Messages postés 262 Date d'inscription dimanche 3 mars 2013 Statut Membre Dernière intervention 17 avril 2015 7
18 janv. 2014 à 20:27

Bonjour,

J'ai trouvé la solution ici :

https://www.developpez.net/forums/d1408696/javascript/bibliotheques-frameworks/jquery/ajax-envoyer-informations-php/

Au revoir

Discussions similaires

Transparence en tete et bas de page

ALERT en php

balise de retour à la ligne en php

chaima csc

Codage de texte

Discussions similaires

Newsletters