Formulário para envio de texto e anexo com AJAX

[Leco RP 6]

Fala pessoal,

 

Depois de muito pesquisar na internet, cheguei a esse script:

<script type="text/javascript">
		$("form#data").submit(function(){
			var formData = new FormData($(this)[0]);
			$.ajax({
				url: "post.php",
				type: 'POST',
				data: formData,
				async: false,
				success: function (data) {
					$('#retorno').html(data);
				},
					cache: false,
					contentType: false,
					processData: false
			});

			return false;
		});
	</script>

 

Porém, não estou conseguindo acrescentar a esse script algo do tipo "carregando" ocultando/exibindo uma DIV, assim: $('.carregando').show(); para o usuário não achar que "travou" caso o arquivo seja grande.

Independentemente de onde eu acrescente esse "carregando" o mesmo não é exibido.

 

Alguém tem alguma ideia?

 

Obrigado.

[Vinicius Rangel 208]

 

<script type="text/javascript"> $("form#data").submit(function(){ var formData = new FormData($(this)[0]);
$('#retorno').html('carregando...');
 $.ajax({ url: "post.php", type: 'POST', data: formData, async: false, success: function (data) { $('#retorno').html(data); }, cache: false, contentType: false, processData: false }); return false; }); </script>

[Leco RP 6]

Olá Vinicius,

 

Primeiramente, obrigado pela ajuda.

 

Teste o seu código mas também não funcionou... Nada que eu coloque nesse script que tenha uma ação que não seja o POST funciona...

Já tentei com DIV, dessa forma que você falou mas não deu certo.

 

Abraços.

[Danilo - Jesus voltará! 1]

coloque isso no final do seu script:

$(document).submit(function(){

$("#conteudo").show("slow"); // Aqui é a div que vai aparecer quando submeter

$("#esconde").hide("slow"); // Aqui você esconde o formulario, coloque uma div envolvendo o form com id #formulario

});

Ficaria assim então:

<script type="text/javascript">

$("form#data").submit(function(){

var formData = new FormData($(this)[0]);

$.ajax({

url: "post.php",

type: 'POST',

data: formData,

async: false,

success: function (data) {

$('#retorno').html(data);

},

cache: false,

contentType: false,

processData: false

});

return false;

});

$(document).submit(function(){

$("#conteudo").show("slow"); // Aqui é a div que vai aparecer quando submeter

$("#esconde").hide("slow"); // Aqui você esconde o formulario, coloque uma div envolvendo o form com id #formulario

});

</script>

.