Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17736
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Envio de dados e imagem no mesmo formulário jQuery

29-11-2016 22:30

Nesse post vou mostrar um script que permite fazer o envio de texto e fotos no mesmo formulário usando o jQuery.
Segue o script abaixo

envio.html

<script src="jquery.js"></script> <form enctype="multipart/formdata"> nome: <input type="text" id="nome" name="nome" value="" /> arquivo: <input type="file" id="arquivo" name="" /> <input type="button" id="Enviar" name="" value="Enviar" /> </form> <script type="text/javascript"> $(function() { $("#Enviar").click(function(event) { $("#retorno").html("Enviando...."); var data = new FormData(); data.append("nome", $("#nome").val()); jQuery.each(jQuery("#arquivo")[0].files, function(i, file) { data.append("arquivo", file); }); jQuery.ajax({ url: "upload.php", data:data, cache: false, contentType: false, processData: false, type: "POST", success: function(data){ $("#retorno").html(data); } }); }); }); </script> <div id="retorno"></div>

upload.php

<?php echo $_POST["nome"]."<br />"; if(isset($_FILES["arquivo"]["name"])) { $pasta = "upload/"; $nome = $_FILES["arquivo"]["name"]; $caminho = $pasta.$nome; if(move_uploaded_file($_FILES["arquivo"]["tmp_name"], $caminho)) { echo "<img src=\"$caminho\">"; } } else { echo "A imagem não foi enviada"; } ?>

0
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Bing [Bot]