Sto avendo interfaccia utente in questo modo:
Come faccio a caricare più immagini utilizzando AJAX in php
voglio caricare più video utilizzando AJAX in PHP. Per questo ho provato FormData() in jQuery. Ma sta caricando solo un'immagine, non più di quella.
Il mio file di forma:
<form enctype="multipart/form-data" action="/test.php"
method="post" class="putImages">
<input name="media[]" type="file" multiple/>
<input class="button" type="submit" alt="Upload" value="Upload" />
<button type="button" id="add"></button>
</form>
Il mio file jQuery:
<script type="text/javascript">
$(document).ready(function() {
$("#add").click(function() {
var $div = $('div[id^="inputdiv"]:last');
var num = parseInt($div.prop("id").match(/\d+/g), 10) + 1;
var $klon = $div.clone().prop('id', 'inputdiv' + num).appendTo("#athleteRegister").insertBefore("#submitbutton");
$('#inputdiv' + num).find("input").attr('name', 'file[' + num + ']');
$('#inputdiv' + num).find("input").val("");
$('#inputdiv' + num).find("input").attr('id', 'file' + num);
$('#inputdiv' + num).find("input").css("outline", "none");
$('#inputdiv' + num).find("div.col-sm-1 i").attr('class', 'fa fa-minus');
$('#inputdiv' + num).find("div.col-sm-1 button").attr('id', 'remove');
$('#inputdiv' + num).find("img").attr('alt', 'remove');
});
$('#sub').click(function() {
jQuery.each($('input[name^="media"]')[0].files, function(i, file) {
data.append('file-' + i, file);
});
$.ajax({
type: 'POST',
data: data,
url: "../admins/test",
cache: false,
contentType: false,
processData: false,
success: function(data) {
alert(data);
}
});
});
});
</script>
Qualcuno può risolvere questo problema? Grazie!
Utilizzare 'serializeArray()' per inviare input per il lato server. Oppure puoi utilizzare qualsiasi plugin di terze parti, come questo https://blueimp.github.io/jQuery-File-Upload/ – Nisam
@Nisam che ho bisogno di eseguire usando solo il codice sopra –