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


Moderador: web

 
Mais de 50 postagens
Mais de 50 postagens
Tópico Autor
Mensagens: 55
Nome: Eduardo Nakamatu
Sexo: Masculino
Localização: Santo André/SP
Contato:

Resultado do Form em uma DIV

01-03-2014 17:26

Boa tarde,

Preciso que o resultado de um processamento de form seja carregado na mesmo div que estava o form, ja tentei diversos metodos e nçao tive sucesso, montei um exemplo do meu problema, ao confirmar o formulario, em fez de efetuar a carga na div ele esta dando um reload inteiro na pagina...para funcionar precisa do jquery.min.js,

Se alguem puder ajudar, fico grato, o resulrado do form deve carregar a div #corpo apenas, mantendo o menu....

index.php
<html>     <head>     <meta charset="UTF-8">     <script src="jquery.min.js"></script>     <script src="openpage.js"></script>     <title> Teste form </title>     </head>     <body>         menu:<a href='javascript:OpenPage("#corpo","formulario.php");'> Chama Formulário v1.6</a>         <br><br><br>         corpo:         <div id="corpo">             será colocado o form aqui, ao processar o form o resultado tambem deve ficar aqui!!!         </div>     </body>     </html>    


formulario.php
<?PHP ECHO <<<HTML <form action="processa.php" method="post" enctype="multipart/form-data">         <input name="nome"  type="text" value='Nome' />         <input name="Email"  type="text" value='Email'/>         <input name="processar" type="submit" value="Processar" /> </form> HTML; ?>

processa.php
<?php echo 'processado...!<br><br>'.$_POST['nome'];  

OpenPage.js
  function OpenPage(onde,valor){         var url = valor;         var local = onde;        $(local).load(url);       // $('#panelrotinamenu').load('menu.php'); }  

0
Eduardo Nakamatu
enakamatu(at)gmail(dot)com
 
Avatar do usuário
ADMIN
ADMIN
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:

Resultado do Form em uma DIV

01-03-2014 19:11

Tem uma forma bem mais prática. Onde você inclusive pode definir o método e os campos a serem enviados de forma fácil. Veja abaixo
Enviando-dados-via-POST-ou-GET-com-jQuery_3_2830.html
0
A melhor hospedagem para o seu site HostGator!
 
Mais de 50 postagens
Mais de 50 postagens
Tópico Autor
Mensagens: 55
Nome: Eduardo Nakamatu
Sexo: Masculino
Localização: Santo André/SP
Contato:

Resultado do Form em uma DIV

01-03-2014 23:58

Sim, mas não no meu escopo, os campos do formulário são "dinâmicos", aparecem mais campos ou menos campos conforme conforme configuração do usuário, por isso o javascript nao pode estar pré-carregado no <header>

Existe alguma forma de, ao gerar o formulário, eu jogar o script criado dinamicamente para este formulario especifico?
0
Eduardo Nakamatu
enakamatu(at)gmail(dot)com
 
Avatar do usuário
ADMIN
ADMIN
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:

Resultado do Form em uma DIV

02-03-2014 09:20

Você pode tentar usar o serialize(). Ele engloba todos os campos do formulário. Enviando-todos-os-campos-com-jQuery_3_4668.html
0
A melhor hospedagem para o seu site HostGator!
 
Mais de 50 postagens
Mais de 50 postagens
Tópico Autor
Mensagens: 55
Nome: Eduardo Nakamatu
Sexo: Masculino
Localização: Santo André/SP
Contato:

Resultado do Form em uma DIV

02-03-2014 11:43

Bom dia,

Adaptei a solução para meu exemplo, mas ele não chama o recebe.php, ele so faz a recarga inicial da pagina, ja tou a 4 dias nisso...ficando doido....

index.php
  <html>     <head>         <meta charset="UTF-8">         <script src="jquery.js"></script>         <script> // evitando que os dados sejam submetidos pelo modo tradicional             jQuery(document).ready(function() {                 jQuery("#form").submit(function() {                     return false;                 }); // carregando a função para o envio                 jQuery("#envia").click(function() {                     envia_form();                 }); // limpando a div antes de um novo envio                 function envia_form() {                     jQuery("#retorno").empty(); // pegando os campos do formulário                     var formdata = $('#form').serialize(); // tipo dos dados, url do documento, tipo de dados, campos enviados // para GET mude o type para GET                     jQuery.ajax({                         type: "POST",                         url: "recebe.php",                         dataType: "html",                         data: formdata, // enviado com sucesso                         success: function(response) {                             jQuery("#retorno").append(response);                         }, // quando houver erro                         error: function() {                             alert("Ocorreu um erro durante a requisição");                         }                     });                 }             });             // modificacao  by nakamatu             function OpenPage(onde, valor) {                     var url = valor;                     var local = onde;                     $(local).load(url);                  };         </script>         <title> Teste form </title>     </head>     <body>         menu:<a href='javascript:OpenPage("#retorno","formulario.php");'> Chama Formulário v1.20 </a>         <br><br><br>         corpo:         <div id="cadastro">             <div id="retorno">                 será colocado o form aqui, ao processar o form o resultado tambem deve ficar aqui!!!             </div>         </div>     </body>     </html>    

formulario.php
  <?PHP echo <<<HTML <div id="retorno"></div> <form id="form" action="" method="POST"> nome: <input type="text" id="nome" name="nome" value=""> <br> senha: <input type="password" id="senha" name="senha" value=""> <br> <button id="envia" type="submit">Enviar</button> </form> HTML ?>  

recebe.php
<?php echo $_POST['nome']."<br>"; print_r($_POST['ids']); ?>

0
Eduardo Nakamatu
enakamatu(at)gmail(dot)com
 
Avatar do usuário
ADMIN
ADMIN
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:

Resultado do Form em uma DIV

02-03-2014 12:25

Você baixou a biblioteca jQuery para pasta onde roda o script?
Porque se o arquivo jquery.js que é usado no script não for carregado, vai atualizar o documento somente.

Veja uma referência básica sobre o jQuery abaixo
O-que-e-necessario-para-rodar-scripts-e ... _5976.html
0
A melhor hospedagem para o seu site HostGator!
 
Mais de 50 postagens
Mais de 50 postagens
Tópico Autor
Mensagens: 55
Nome: Eduardo Nakamatu
Sexo: Masculino
Localização: Santo André/SP
Contato:

Resultado do Form em uma DIV

02-03-2014 13:29

É web, meio perdido, pois o script esta atualizado, coloquei a referencia dele direto conforme mencionado no seu artigo, e mesmo assim ele "parece" que volta a pagina anterior ao clicar do menu.

Será que o fato do form ser carregado depois esta influenciando a leitura do jquery?

  <html>     <head>         <meta charset="UTF-8">         <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>         <script> // evitando que os dados sejam submetidos pelo modo tradicional             jQuery(document).ready(function() {                 jQuery("#form").submit(function() {                     return false;                 }); // carregando a função para o envio                 jQuery("#envia").click(function() {                     envia_form();                 }); // limpando a div antes de um novo envio                 function envia_form() {                     jQuery("#retorno").empty(); // pegando os campos do formulário                     var formdata = $('#form').serialize(); // tipo dos dados, url do documento, tipo de dados, campos enviados // para GET mude o type para GET                     jQuery.ajax({                         type: "POST",                         url: "recebe.php",                         dataType: "html",                         data: formdata, // enviado com sucesso                         success: function(response) {                             jQuery("#retorno").append(response);                         }, // quando houver erro                         error: function() {                             alert("Ocorreu um erro durante a requisição");                         }                     });                 }             });             // modificacao  by nakamatu             function OpenPage(onde, valor) {                     var url = valor;                     var local = onde;                     $(local).load(url);                  };         </script>         <title> Teste form  0.47 </title>     </head>     <body>         menu:<a href='javascript:OpenPage("#retorno","formulario.php");'> Chama Formulário  </a>         <br><br><br>         corpo:         <div id="cadastro">             <div id="retorno">                 será colocado o form aqui, ao processar o form o resultado tambem deve ficar aqui!!!             </div>         </div>     </body>     </html>    

0
Eduardo Nakamatu
enakamatu(at)gmail(dot)com
 
Avatar do usuário
ADMIN
ADMIN
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:

Resultado do Form em uma DIV

02-03-2014 14:02

Para chamar o formulário, basta o seguinte dentro do ready do jQuery

$('.formulario').click(function() { $('#retorno').load('formulario.php'); });

No HTML fica assim

menu:<a href="javascript://" class="formulario"> Chama Formulário  </a>

0
A melhor hospedagem para o seu site HostGator!
 
Mais de 50 postagens
Mais de 50 postagens
Tópico Autor
Mensagens: 55
Nome: Eduardo Nakamatu
Sexo: Masculino
Localização: Santo André/SP
Contato:

Resultado do Form em uma DIV

02-03-2014 14:08

Sim web, isso ja funciona, o problema é depois, quando confirmo o formulario, em vez de mostrar apenas o retorno de recebe.php, ele simplesmente volta como estava antes ou , como no meu 1 exemplo ,ele carrega o recebe.php ,mas sobrepoe o html principal...

:-(
0
Eduardo Nakamatu
enakamatu(at)gmail(dot)com
 
Avatar do usuário
ADMIN
ADMIN
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:

Resultado do Form em uma DIV

02-03-2014 14:13

Tem o script online?
0
A melhor hospedagem para o seu site HostGator!
 
Mais de 50 postagens
Mais de 50 postagens
Tópico Autor
Mensagens: 55
Nome: Eduardo Nakamatu
Sexo: Masculino
Localização: Santo André/SP
Contato:

Resultado do Form em uma DIV

02-03-2014 20:53

Boa noite,

Quero agradecer o apoio (foi o unico em vários lugares que acessei que tentou ajudar...), funcionou na seguinte configuração:


index.php
<html>     <head>         <meta charset="UTF-8">         <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>         <script language="javascript" type="text/javascript">             // evitando que os dados sejam submetidos pelo modo tradicional             jQuery(document).ready(function() {                 jQuery("#form").submit(function() {                     return false;                 });                 // carregando a função para o envio                 jQuery("#envia").click(function() {                     envia_form();                 });                 // limpando a div antes de um novo envio                 function envia_form() {                     jQuery("#corpo").empty();                     // pegando os campos do formulário                     var formdata = $('#form').serialize();                     // tipo dos dados, url do documento, tipo de dados, campos enviados                     // para GET mude o type para GET                     jQuery.ajax({                         type: "POST",                         url: "processa.php",                         dataType: "html",                         data: formdata,                         // enviado com sucesso                         success: function(response) {                             jQuery("#corpo").append(response);                         }, // quando houver erro                         error: function() {                             alert("Ocorreu um erro durante a requisição");                         }                     });                 }             });             function openform(onde, valor) {                 var url = valor;                 var local = onde;                 $(local).load(url);               }           </script>         <title> Teste form codigosnaweb</title>     </head>     <body>         menu:<a href="javascript:openform('#corpo','formulario.php');"> Chama Formulário 0.90 </a>         <br><br><br>         corpo:         <div id="corpo">             será colocado o form aqui, ao processar o form o resultado tambem deve ficar aqui, no lugar do form!!!         </div>     </body>     </html>

formulario.php
  <script language="javascript" type="text/javascript">     function procform(onde, valor) {         var url = valor;         var local = onde;         var datavar = $("#form").serialize();           $.ajax({             type: "POST",             url: valor,             data: datavar,             cache: false,             success: function(html) {                 $(local).html(html);               }         });       } </script> <form id="form" action="javascript:procform('#corpo','processa.php');" method="POST">     nome: <input type="text" id="nome" name="nome" value="">     <br>     senha: <input type="text" id="senha" name="senha" value="">     <br>       <br>     <button id="envia" type="submit">Enviar</button> </form>  

processa.php
<?php echo 'Nome:'.$_POST['nome']. "<br>"; echo 'Senha:'.$_POST['senha']."<br>"; ?>

0
Eduardo Nakamatu
enakamatu(at)gmail(dot)com
 
Avatar do usuário
ADMIN
ADMIN
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:

Resultado do Form em uma DIV

03-03-2014 15:28

:up:
0
A melhor hospedagem para o seu site HostGator!

Quem está online

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