Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

tiagocaus

Esconder DIV após submit

Recommended Posts

Preciso esconder uma div e mostra a outra com o resultado após o submit.


Estou usando esse código:

 

$(document).ready(function(){
	$('#conteudo').hide();

	$('#button').click(function(event){

		$('form#form1').submit(function(event){
			$("#form").hide("slow");
			$("#conteudo").show("slow"); 
			event.preventDefault();
		});

	});
	

	$('#mostrar').click(function(event){
		event.preventDefault();
		$("#form").show("show");
		$("#conteudo").hide("show");
	});
});

 

 


Ele esta escondendo e aparecendo, mas não executa o submit.

Compartilhar este post


Link para o post
Compartilhar em outros sites

troca:

	$('#button').click(function(event){

 

$('form#form1').submit(function(event){

$("#form").hide("slow");

$("#conteudo").show("slow");

event.preventDefault();

});

 

});

por:

$('form#form1').submit(function(event){

$("#form").hide("slow");

$("#conteudo").show("slow");

event.preventDefault();

});

Compartilhar este post


Link para o post
Compartilhar em outros sites

Fiz a troca, mas o envio do form não acontece. Vou postar meu form a qui para você ver.

 

<div class="form-actions clearfix" id="form">
<form action="" method="GET" name="form1" id="form1" class="form-inline" role="form">
	<label class="inline">
		<input class="form-control" type="text" name="date-range-picker" id="id-date-range-picker-1" placeholder="Selecione a data" />
	</label>
        
        
    <button type="submit" id="button" name="button" class="btn btn-success btn-sm"><i class="icon-save bigger-110"></i> Salvar</button>
	<input type="hidden" name="MM_insert" value="form1" />
</form>
</div>




<table class="table table-hover" id="conteudo">
            <thead>
              <tr>
                <th>Data</th>
                <th>Histórico</th>
                <th>Plano de conta</th>
                <th>Valor</th>
              </tr>
            </thead>
            <tbody>
            <?php do { ?>
              <tr>
                <td><?php echo $row_rs['data']; ?></td>
                <td><?php echo $row_rs['nome']; ?></td>
                <td><?php echo $row_rs['planoDeConta']; ?></td>
                <td><?php echo $row_rs['valor']; ?></td>
              </tr>
            <?php } while ($row_rs = mysql_fetch_assoc($rs)); ?>
            </tbody>
        </table>

 

 

Estou usando GET somente como teste, para ver se esta enviando.

Compartilhar este post


Link para o post
Compartilhar em outros sites

sim, não acontece pq vc impediu com o event.preventDefault();

 

Foi isso mesmo que vc disse para o código fazer. Qual a dúvida ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

vc entende como funciona a requisição do formulário ?

 

e os instantes em que o js e o php rodam ?

 

 

Depois que vc enviar o form tradicionalmente, uma requisição http será enviada. Nesse instante, o js não terá mais controle do que acontece, e a página será recarregada novamente, pois vc acabou de enviá-la para o server-side.

 

Dai então, o seu javascript será esvaziado, e todas as variaveis e funções que haviam na memória serão reiniciadas, logo, da forma que vc está pensando, é impossível usar js + form.

 

 

O que vc deve fazer, é identificar com php o envio, e ai sim esconder os teus elementos com server-side.

Ou então, fazer todo o envio com ajax, dessa forma evitando o processamento do request http, e ainda tendo o js na memória.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu preciso fazer isso como falei, mas não estou sabendo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Vc não tá conseguindo, pq não dá.

 

Entendeu oque eu disse acima ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.