Eu projetei um formulário simples que permite ao usuário fazer upload de arquivos para o servidor. Inicialmente, o formulário contém um botão "procurar". Se o usuário quiser fazer upload de vários arquivos, ele precisa clicar no botão "Adicionar mais arquivos", que adiciona outro botão "navegar" no formulário. Quando o formulário é submetido, o processo de upload de arquivo é tratado no arquivo 'upload.php'. Funciona perfeitamente bem para fazer upload de vários arquivos. Agora eu preciso enviar o formulário usando '.submit ()' do jQuery e enviar uma solicitação ajax ['.ajax ()'] para o arquivo 'upload.php' para manipular o upload do arquivo.

Aqui está o meu formulário HTML:

<form enctype="multipart/form-data" action="upload.php" method="post">
    <input name="file[]" type="file" />
    <button class="add_more">Add More Files</button>
    <input type="button" id="upload" value="Upload File" />
</form>

Aqui está o JavaScript:

$(document).ready(function(){
    $('.add_more').click(function(e){
        e.preventDefault();
        $(this).before("<input name='file[]' type='file' />");
    });
});

Aqui está o código para processar o upload do arquivo:

for($i=0; $i<count($_FILES['file']['name']); $i++){
$target_path = "uploads/";
$ext = explode('.', basename( $_FILES['file']['name'][$i]));
$target_path = $target_path . md5(uniqid()) . "." . $ext[count($ext)-1]; 

if(move_uploaded_file($_FILES['file']['tmp_name'][$i], $target_path)) {
    echo "The file has been uploaded successfully <br />";
} else{
    echo "There was an error uploading the file, please try again! <br />";
}

}

Qualquer sugestão sobre como escrever minha função '.submit ()' será realmente útil.