Índice
Quando temos formulários de coleta de dados em uma página HTML5 Além de poder pegar dados com campos do tipo input, também podemos fazer upload de arquivos, com isso podemos agilizar o carregamento de certos dados que são impossíveis de expressar em texto ou que podem ser textos muito longos, é comum fazer upload de imagem arquivos ou arquivos PDF, uma vez que esses dois formatos são muito populares, porém com Ajax podemos fazer upload de quase qualquer tipo de arquivo.Fazer upload de arquivos
Para fazer upload de arquivos usando Ajax, devemos criar um campo de tipo de arquivo em um formulário e em nossa rotina Ajax usar um objeto FormData com o qual coletaremos os dados para poder dar-lhes o formato necessário e fazer o upload do nosso arquivo para o servidor.
O objeto FormData ele deve ser usado com cuidado, pois ainda pode haver versões de navegadores que não o suportam totalmente, no entanto, é uma solução bastante sólida.
Vamos ver no código a seguir como fazer um upload de arquivo básico:
ExemploBananas:Maçãs:Cerejas:Arquivo:Total:0 itensEnviar formulário
Ao incorporar a entrada do tipo de arquivo, o objeto FormData faz automaticamente os arranjos para que nosso arquivo possa ser carregado para o servidor, na imagem a seguir podemos ver como o navegador interpreta isso:
Para ver o andamento da escalada vamos usar o objeto XMLHttpRequest para verificar o status da solicitação Ajax:
ExemploBananas:Maçãs:Cerejas:Arquivo:Progresso:Total:0 itensEnviar formulário
Nós definimos um elemento progresso e com ele Objeto XMLHttpRequest Podemos atribuir os valores enquanto o upload avança, no navegador podemos ver da seguinte maneira:
PROLONGAR
