Hi !

Is it possible to send an AJAX XMLHttpRequest using prototype.js API
for a multipart/form-data ?

I already done parsing form parameters and sending GET/POST request,
but does this work with <input type="file"> ?
Who handle file submit and encoding ?

regards,
Jean-Philippe Encausse

NextOne said the following on 9/30/2005 4:23 AM:

> Hi !
> 
> Is it possible to send an AJAX XMLHttpRequest using prototype.js API
> for a multipart/form-data ?

Have you read the documentation for prototype.js (whatever that is) and 
maybe asked the author of the .js file?

> I already done parsing form parameters and sending GET/POST request,
> but does this work with <input type="file"> ?
> Who handle file submit and encoding ?

Again, you need to ask whoever wrote the code you are using.

Yes, you can send an XMLHTTPRequest for any kind of data you want. 
Whether you can do it with prototype.js or not is a different question.

-- 
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq

In fact I found a simple answer here:
http://mir.aculo.us/articles/2005/09/30/fud-revisited-1-can-you-upload-files-with-ajax

> The short answer is: No.
> The long answer is: You can't, because AJAX get/post data is gathered via
> JavaScript, and JavaScript has no way at getting at local file contents (for security > reasons).

NextOne wrote:


> Is it possible to send an AJAX XMLHttpRequest using prototype.js API
> for a multipart/form-data ?
> 
> I already done parsing form parameters and sending GET/POST request,
> but does this work with <input type="file"> ?
> Who handle file submit and encoding ?

The XMLHttpRequest object has a method setRequestHeader so you would 
need to set
   httpRequestInstance.setRequestHeader(
'Content-Type: multipart/form-data')
at least after the open call, then you need to make sure your request 
body, that is the string that you pass to the send method, is indeed in 
the format multipart/form-data defines 
<http://www.w3.org/TR/html4/interact/forms.html#h-17.13.4.2>.
If I understand that right then in reality you need to define a boundary 
string used in the body to separate the multiple parts and you need to 
pass the boundary string in the header so you would end up doing e.g.

var httpRequest = null;
if (typeof XMLHttpRequest != 'undefined') {
   httpRequest = new XMLHttpRequest();
}
else if (typeof ActiveXObject != 'undefined') {
   // need try/catch here in reality
   httpRequest = new ActiveXObject('Microsoft.XMLHTTP');
}
if (httpRequest != null) {
   var boundaryString = 'AaB03x';
   var boundary = '--' + boundaryString;
   var requestBody = [
     boundary,
     'Content-Disposition: form-data; name="GOD"',
     '',
     'Kibo',
     boundary,
     'Content-Disposition: file; name="prayer"; filename="prayer.txt"',
     'Content-Type: text/plain',
     '',
     'Kibology for all.\r\nAll for Kibology.',
     boundary
   ].join('\r\n');
   httpRequest.open('POST', 'test2005093002.php', true);
   if (typeof httpRequest.setRequestHeader != 'undefined') {
     httpRequest.setRequestHeader('Content-Type',
'multipart/form-data; boundary=' + boundaryString);
     httpRequest.onreadystatechange = function (evt) {
       if (httpRequest.readyState == 4) {
         alert(httpRequest.status + ' ' + httpRequest.statusText + '\r\n' +
           httpRequest.getAllResponseHeaders() + '\r\n\r\n' + 
httpRequest.responseText);
       }
     };
     httpRequest.send(requestBody);
   }
}


That simple example works for me here with IE 6, Mozilla 1.7, Opera 8.50 
so that the PHP script receives the form data fine (one element in 
$_POST and one in $_FILES).
Of course you have no way to read files from the local file system. And 
encoding or binary data is not solved with that simple approach.


As for that prototype.js API, ask the author or look into its 
documentation if one is provided.




-- 

	Martin Honnen
	http://JavaScript.FAQTs.com/