Ajax Envoyer un fichier à php

**Adrien88390** · 24/01/2014, 18h31

Bonjour,

J'ai créer un code Jquery / Ajax qui permet d'envoier en POST un fichier image envoier par l'utilisateur à un fichier .php

Comme on ne peut pas faire d'envoi de fichier via Ajax, je voudrait convertir l'image envoiée par l'utilisateur en base64, afin qu'Ajax puisse l'envoier au fichier .php, mais je ne sais pas comment faire. J'ai déjà fait ce code ci-dessous, mais ça ne marche pas.

Code html :

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
27
28
29
30
31
32
33
<!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>Multiplication</title>
	<link rel="stylesheet" media="screen" type="text/css" title="Design espace" href="../../../style.css" />
	<link rel="shortcut icon" href="../../../calculatrice.ico"/>
	<meta http-equiv="language" content="fr">
	<meta name="description" content="Sur cette page, vous pourrez calculer des multiplications.">
	<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 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, nombre, nombres, multiplication, multiplications">
	</head>
    <body>
 
<form method="post" enctype="multipart/form-data" id="formulaire_addition" action="traitement2.php">
 
 
<p>
    <strong>Envoiez l'image à convertir :</strong><br/>
	<input type="file" name="image"/>
    <input type="hidden" name="MAX_FILE_SIZE" value="2097152" /><br/><br/>
	<strong>Choisissez le nouveau format de l'image :</strong><br/>
	<input type="radio" name="format" value="gif">Gif<br/>
	<input type="radio" name="format" value="png">Png<br/>
	<input type="radio" name="format" value="jpg">Jpg / Jpeg<br/>
	<input type="submit" name="InsererNews" value="Insérer" />
</p>
</form>
<hr/>
<p>
<div id="resultat_addition"></div>
<script type="text/javascript">

Code :

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

1
2
3
4
5
6
7
8
9
jQuery(document).ready(function($){
			$("#formulaire_addition").submit(function () {
			$("div#resultat_addition").empty();// On vide le div
           $.post("traitement2.php",$("#formulaire_addition").serialize(),function(texte){
                $("div#resultat_addition").append(texte);
            });
           return false; // ne change pas de page
    });
});