Upload de arquivos sem refresh na página

Olá.

Algumas vezes temos a necessidade de enviar dados sem dar refresh na página. Mas isto torna-se mais engenhoso quando entre estes dados temos arquivos. Para solucionar este cenário temos uma facilidade com jQuery. Para enviar arquivos é necessário trabalhar com os parâmetros de ajax contentType e processData. No exemplo abaixo temos uma função genérica que servirá tanto para formulário com ou sem imagem:

 
$(form).on('submit', function () {
    var data;
    var contentType = "application/x-www-form-urlencoded";
    var processData = true;
    if ($(this).attr('enctype') == 'multipart/form-data') {
        data = new FormData($(this).get(0));//seleciona classe form-horizontal adicionada na tag form do html
        contentType = false;
        processData = false;
    } else {
        data = $(this).serialize();
    }
    $.ajax({
        data: data,
        type: $(this).attr('method'),
        url: $(this).attr('action'),
        contentType: contentType,
        processData: processData,
        success: function (response) {
            //seu código após sucesso
        },
        error: function (exr, sender) {
                alert('Erro ao carregar pagina');
        }
    });
}

Até a próxima. ;)