Comment passer des caractères spéciaux avec AJAX ?
Bonjour, j'ai un bug avec un formulaire HTML dont je récupère la valeur d'un champ texte, et que je passe à un script PHP avec AJAX jQuery. Lorsque des caractères spéciaux comme le ? ou le # sont présents dans la valeur de l'input cela bug.
Voilà le code HTML :
<input type="text" name="info" value="exemple avec un ? ou et #" id="info">
Et mon code AJAX :
<script>
function action(info){
$.ajax({
url : 'action.php',
type : 'GET',
data : 'info=' + info,
dataType : 'html',
success : function(reponse){
// ...
});
}
$('#action').click( function(){
var info= document.getElementById("info").value;
action(info);
});
</script>
Les caractères spéciaux comme le # ou le ?, lorsqu'ils sont passés dans l'URL, sans être préalablement encodés, vont être interprétés par votre navigateur.
Le # sera interprété comme une ancre HTML, et le ?, ou bien même le &, comme un paramètre GET de l'URL.
Vous devez donc encoder la valeur de votre input en une séquence d'échappement UTF-8 ; et pour cela il existe la fonction JavaScript encodeURIComponent().
Pour reprendre votre exemple, il suffit d'encoder la variable info :
var info = encodeURIComponent(document.getElementById("info").value);
De cette manière tous les caractères spéciaux , / ? : @ & = + $ # seront encodés dans l'URL et ne seront plus interprétés.
Vous trouverez d'avantage d'information sur la fonction encodeURIComponent() via cette page du site de Mozilla.