Discussion :

[Elixis]

Bonjour,
Je suis en train de tester le framework Prototype, pour cela j'ai un formulaire Php, je réalise mes insertions/modifications/supressions a l'aide d'une fonction utilisant la méthode Ajax.request... Tout ce passe pour le mieux
Néanmoins, j'aimerais pouvoir enregistrer des images dans ma bdd dans un champs de type blob.

Pour cela, j'ai utilisé un input de type file (id=image) cependant avec le $F("image") de Prototype, je récupère le chemin de l'image inscrite dans l'input et non pas l'image elle-même...

Voici mon code:
- js:

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
function sendRequest(page) 
                {
 
                    new Ajax.Request(page, 
                        { 
                        method: 'post', 
                        postBody: "categ="+$F("categ")+"&souscat="+$F("souscat")+"&titre="+$F("titre")+"&designation="+$F("designation")+"&image="+$F("image"),
                        onComplete: showResponse, 
                        });
                }
 
 
                function showResponse(req)
                {
                    $('show').innerHTML= req.responseText;
                }

-xhtml:

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
27
<tr>
														<td align="center" colspan="2">
															<fieldset><legend>Lier une image:</legend>
																<input id="image" type='file' name='image' value='Choisir une image'>
															</fieldset>
														</td>
													</tr>
													<tr>
														<td colspan="2">&nbsp;</td>
													</tr>
													<tr>
														<td colspan="2" align="center">
															<fieldset><legend>Actions:</legend>
															<table>
																<tr>
																	<td colspan="2" align="center"><input type='submit' value='Cr&eacute;er' onClick='sendRequest("cree_element.php")' /> | <input type='submit' value='Modifier' onClick='sendRequest("edit_element.php")' /> | <input type='submit' value='Supprimer' onClick='sendRequest("del_element.php")' /></td>
																</tr>
																<tr id="chargement" style="display: none;">
																	<td  colspan="2" align="center"><img src="../images/loading.gif" alt="chargement" title="chargement" /></td>
																</tr>
																<tr>
																	<td id="show" colspan="2" align="center"></td>
																</tr>
															</table>
															</fieldset>
														</td>
													</tr>

(la fonction php est un simple insert ou un update dans le cas d'une modification)


Si quelqu'un a une idée... je suis preneur... Merci d'avance.

[SpaceFrog]

mhhhh je pense que pour une raison évidente de sécurité ce n'est pas possible, cela voudrait dire que l'on aurait accès aux fichers en local.

Peute être en bidouillant avec un iframe caché pour lancer un submit de form pour du coup bien récupérer le fichier en $_FILES puis une fois le traitement terminé dans l'iframe enchainer sur l'ajax sur le parent ?

sinon il existe une solution qui ne fonctionne que pour le gecko powered :
http://www.captain.at/ajax-file-upload.php

[edit]


he bé je ne suis pas le seul à avoir imaginé le coup de l'iframe:
http://www.openjs.com/articles/ajax/ajax_file_upload/
[edit]

[Elixis]

Merci pour les idées et les recherches
J'ai essayé la 2ième solution, qui corresponds plus avec ce que j'ai envie de faire, ça marcherait presque mise à part que maintenant je récupère un $_POST["image"] vide...

-xhtml

Code :

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

1
2
3
4
5
<form id="file_upload_form" method="post" enctype="multipart/form-data" action="upload.php">
			<input name="image" id="image" size="27" type="file" /><br />
			<input type="submit" name="action" value="Upload" /><br />
			<iframe id="upload_target" name="upload_target" src="" style="width:0;height:0;border:0px solid #fff;"></iframe>
		</form>

- js

Code :

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

1
2
3
4
5
6
7
8
9
10
11
function init()
		{	
 
			document.getElementById('file_upload_form').onsubmit=function() 
			{
 
				document.getElementById('file_upload_form').target = 'upload_target'; //'upload_target' is the name of the iframe
 
			}
		}
		window.onload=init;

je met juste un alert() sur $_POST("image") et $_FILES("image") dans ma page upload.php et les 2 sont donc vides...