Ajax

Résolu/Fermé

aloisiø Messages postés 54 Date d'inscription lundi 30 mai 2011 Statut Membre Dernière intervention 4 octobre 2014 - 25 oct. 2011 à 11:43
Zep3k!GnO Messages postés 2025 Date d'inscription jeudi 22 septembre 2005 Statut Membre Dernière intervention 18 novembre 2015 - 26 oct. 2011 à 11:09

Bonjour,

j'essaie en ce moment de faire une multiplication en ajax pour que le résultat s'affiche directement, j'ai trouvé un code sur internet mais il faut appuyer sur un bouton. Quelqu'un pourrait 'aider à modifier ce code pour qu'il n'y ai plus besoin d'appuyer sur le bouton pour que le résultat s'affiche directement ? Merci d'avance

Le code :

<html>
<head>
<title>Ajax Multiply Example</title>
<script language="Javascript">
function postRequest(strURL){
var xmlHttp;
if(window.XMLHttpRequest){ // For Mozilla, Safari, ...
var xmlHttp = new XMLHttpRequest();
}
else if(window.ActiveXObject){ // For Internet Explorer
var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttp.open('POST', strURL, true);
xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlHttp.onreadystatechange = function(){
if (xmlHttp.readyState == 4){
updatepage(xmlHttp.responseText);
}
}
xmlHttp.send(strURL);
}

function updatepage(str){
document.getElementById('result').value = str;
}

function callMultiply(){
var a = parseInt(document.f1.a.value);
var b = parseInt(document.f1.b.value);
var url = "multiply.php?a=" + a + "&b=" + b + "";
postRequest(url);
}
</script>
</head>

<body>
<h1 align="center"><font color="#000080">Ajax Example</font></h1>
<form name="f1">
<input name="a" id="a" value="">
<input name="b" id="b" value="">
<input name="result" type="text" id="result">
<input type="button" value="Multiply" onClick="callMultiply()" name="showmultiply">
</form>
</body>
</html>

La page multiply.php :

<?php
$a=$_GET["a"];
$b=$_GET["b"];
$mul=$a*$b;
echo $mul;
?>

A voir également:

Ajax
Curl ajax ✓ - Forum Javascript
Erreur ajax ✓ - Forum Javascript
Ajax 403 forbidden ✓ - Forum Javascript
Passer variable javascript en php ajax ✓ - Forum PHP
Pub ajax carmen ✓ - Forum Musique / Radio / Clip

3 réponses

Réponse 1 / 3

Zep3k!GnO Messages postés 2025 Date d'inscription jeudi 22 septembre 2005 Statut Membre Dernière intervention 18 novembre 2015 200
25 oct. 2011 à 12:22

Comme tu le dis, c'est déclenché par un click : onClick="callMultiply()"
Regardes du coté des événements qui pourraient être liés à la modification d'un input et tu as ta solution ;)
https://www.w3schools.com/jsref/dom_obj_event.asp

Réponse 2 / 3

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
25 oct. 2011 à 16:32

difficile de faire cela sur la modif d'un des input, car comment savoir quand tu as fini de le remplir, en effet si tu veux taper 1256 dès que tu vas taper 1 ça va déclencher l'appel à la fonction
et surtout bien faire la verif que l'autre input n'est pas vide

Réponse 3 / 3

Zep3k!GnO Messages postés 2025 Date d'inscription jeudi 22 septembre 2005 Statut Membre Dernière intervention 18 novembre 2015 200
25 oct. 2011 à 16:38

C'est bien ça le truc, en gros, dans ton javascript, tu testes si tu a bien une valeur pour les 2 champs, si c'est le cas, tu l'envoi via ajax a ton serveur qui se charge du calcul et retourne le résultat.
Le fait que le calcul se fasse sur la modification n'a rien de problématique, tu affichera a la volé le résultat de la saisie.
Sinon tu peux aussi le faire lorsque l'élément perd le focus, mais il faudra alors que la personne perde le focus sur le 2eme input pour que ça soit valable et donc non ergonomique.

A toi de voir quelle événement déclencheur te convient le mieux.

aloisiø Messages postés 54 Date d'inscription lundi 30 mai 2011 Statut Membre Dernière intervention 4 octobre 2014 1
26 oct. 2011 à 09:26

Quand tu dis perdre le focus c'est que l'utilisateur change de case par exemple ?

Zep3k!GnO Messages postés 2025 Date d'inscription jeudi 22 septembre 2005 Statut Membre Dernière intervention 18 novembre 2015 200
26 oct. 2011 à 11:09

onBlur() : https://www.w3schools.com/jsref/dom_obj_event.asp

La doc que je met en lien (post 25 oct. 2011 à 12:22), ça sert à quelque chose ou tu la lis vraiment pas ?

Discussions similaires

probléme avec ajax svp

Refresh div

Utilisateur anonyme - 3 nov. 2017 à 10:09
Utilisateur anonyme - 7 nov. 2017 à 18:06

Mot de passe oublié PHP/Ajax

Ajax - les messages d'erreur avec echo

Encodage caractères AJAX