My page has a multiple-file upload form, which worked fine as soon as my client wanted a progress bar. So I made one, unfortunately I made a mistake and tested it only in Firefox and Chrome, so a week later he mentioned that uploading doesn't work in our beloved Internet Explorer.
My upload form and PHP upload is in the same file. Also the div that comes up with a progress bar.
The code:
FORM:
<form action="" method="post" enctype="multipart/form-data" onsubmit="return ray.ajax()" accept-charset="UTF-8">
<table border=0><tr><td width=250>Sinu ees- ja perekonnanimi: <kolmas>*</kolmas></td><td>
<input type="text" name="nimi" placeholder="Sinu nimi" /></td></tr>
<tr><td>Sinu telefoninumber:</td><td>
<input type="text" name="telefon" placeholder="telefoninumber" /></td></tr>
<tr><td>Sinu e-mail: <kolmas>*</kolmas></td><td>
<input type="text" name="email" placeholder="e-mail" /></td></tr>
<tr><td valign=top>Lisainfo:</td><td>
<textarea name="lisainfo" rows=4 cols=30 style="resize: none;" /></textarea></td></tr>
<tr><td>Piltide kättesaamise viis:</td><td>
<select name=pildidkatte>
<option>Tulen ise järgi</option>
<option>Smartpost</option>
<option>Omniva</option>
</select></td></tr>
<tr><td><font>Millisesse pakiautomaati?</font><td>
<input type=text name=pakiautomaat placeholder="pakiautomaat" /> <br><pisike>Jätke tühjaks, kui tulete ise järgi</pisike></td></tr>
<tr><td height=50 valign=bottom>
<input type="file" id="file" name="files[]" multiple="multiple" accept="pildid/*" /></td><td valign=bottom>
<input type="submit" value="Valmis!" /></td></tr></table>
AFTER FORM (there are some PHP variables, then comes that script):
<script>
(function() {
var bar = $('.bar');
var percent = $('.percent');
var status = $('#status');
$('form').ajaxForm({
beforeSend: function() {
status.empty();
var percentVal = '0%';
bar.width(percentVal)
percent.html(percentVal);
},
uploadProgress: function(event, position, total, percentComplete) {
var percentVal = percentComplete + '%';
bar.width(percentVal)
percent.html(percentVal);
},
complete: function(xhr) {
bar.width("100%");
percent.html("100%");
var neim = $('input:text[name=nimi]').val();
var teekond = "kliendipildid/"+neim+"/"+neim+".php";
location.replace(teekond);
}
});
})();
</script>
THEN PHP PART
if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){
creating folders, files, blahblah
}
I have found some solutions, but I didn't get these to work. I added my AJAX part like this too,
$.ajax ( {
type: 'post',
cache: false;
$.('form').ajaxForm({
form part
})
} );
when I did this, then the progress bar didn't work, but the files where uploaded in all browsers.
Some links I have already tried to understand and use:
Fallback AJAX file upload for Internet Explorer
Error with Internet Explorer and Jquery Ajax
JQuery Ajax Form with File Upload not working in IE
Aucun commentaire:
Enregistrer un commentaire