Carregar resultado de um form dentro de uma div (jQuery + Ajax)
Publicado por Fábio Berbert de Paula (última atualização em 15/01/2015)
[ Hits: 18.567 ]
Homepage: https://www.instagram.com/alexabolada/
Este código demonstra de forma simples como combinar jQuery com Ajax para carregar o resultado do processamento de um formulário dentro de uma div.
index.html: <html> <body> <form> Nome: <input type="text" name="nome"><br/> E-mail: <input type="text" name="email"><br/> <button type="button" id="butEnviar">Enviar</button> </form> <br/><br/> <div id="saida"></div> <!-- bibliotecas do jquery --> <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <!-- bibliotecas do jquery --> <script> $(document).ready(function() { //definir evento "onclick" do elemento (botao) ID butEnviar $("#butEnviar").click(function() { //capturar o valor dos campos do fomulario var nome = $("input[name=nome]").val(); var email = $("input[name=email]").val(); //usar o metodo ajax da biblioteca jquery para postar os dados em processar.php $.ajax({ "url": "processar.php", "dataType": "html", "data": { "nome" : nome, "email":email }, "success": function(response) { //em caso de sucesso, a div ID=saida recebe o response do post $("div#saida").html(response); } }); }); }); </script> </body> </html> processar.php: <?php $nome = $_REQUEST['nome']; $email = $_REQUEST['email']; echo "Seu nome é <strong>$nome</strong>, teu email <strong>$email</strong> e...<br/><br/>VIVA O LINUX!!!"; ?>
Desmarcando input radio com jQuery
Atualize suas paginas automaticamente
Javascript addDay(): Cálculo de data!
Agora temos uma assistente virtual no fórum!!! (247)
Manutenção de sistemas Linux Debian e derivados com apt-get, apt, aptitude e dpkg
Melhorando o tempo de boot do Fedora e outras distribuições
Como instalar as extensões Dash To Dock e Hide Top Bar no Gnome 45/46
Como Atualizar Fedora 39 para 40
Instalar Google Chrome no Debian e derivados
Consertando o erro do Sushi e Wayland no Opensuse Leap 15
Instalar a última versão do PostgreSQL no Lunix mantendo atualizado
Flathub na sua distribuição Linux e comandos básicos de gerenciamento
Como ativo meu controle de xbox no mupen64? (3)
Como configuro meu controle de xbox no mupen64? (1)
Reset do linux sem perder dual boot (2)