Ocultar form despues de recibir la respuesta

neodani · #1 (**permalink**) 11/02/2011, 08:40

Buenas tardes,

Tengo un formulario bastante simple donde puedes poner dos valores y sumarlos.
Los valores los envío/proceso con ajax y recibo el resultado que imprimo un poco más abajo del formulario.

La pregunta es, ¿Cómo puedo hacer para que una vez envíe los datos y obtenga el resultado oculte el formulario y solo muestre el resultado?

Formulario

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<form action="procesa_form_v2.php" id="formularioSuma">
  <input type="text" name="num1" /> + <input type="text" name="num2" /><br/>
  <input type="submit" value="Enviar" />
</form>
<p id="resultado"></p>
<script type="text/javascript">
$('#formularioSuma').submit(function(event) {
  event.preventDefault();
  var url = $(this).attr('action');
  var datos = $(this).serialize();
  $.get(url, datos, function(resultado) {
    $('#resultado').html(resultado);
  });
});
</script>
</body>
</html>

procesando...

Código PHP:

Ver original<?php
if(is_numeric($_GET['num1']) and is_numeric($_GET['num2']))
  echo $_GET['num1'] + $_GET['num2'];
else
  echo 'Los operandos no son correctos';
?>

Muchas gracias de antemano!

maycolalvarez · #2 (**permalink**) 12/02/2011, 11:28

simplemente: $('#formularioSuma').hide();

Código Javascript:

Ver original<script type="text/javascript">
$('#formularioSuma').submit(function(event) {
  event.preventDefault();
  var url = $(this).attr('action');
  var datos = $(this).serialize();
  $.get(url, datos, function(resultado) {
    $('#resultado').html(resultado);
    $('#formularioSuma').hide();
  });
});
</script>

aunque te digo que es inútil e ineficiente usar PHP vía AJAX para algo tan simple que puede hacerse desde el mismo javascript

neodani · #3 (**permalink**) 13/02/2011, 10:00

Cita:

Iniciado por maycolalvarez

aunque te digo que es inútil e ineficiente usar PHP vía AJAX para algo tan simple que puede hacerse desde el mismo javascript

Hola maycolalvarez, te refieres al ejemplo expuesto arriba?

Imagina que en lugar de ser un simple suma, se trata de enviar los datos de un formulario contactar y quieres devolver al usuario un "Su mensaje se envío con éxito" haciendo desaparecer el formulario contactar.

Muchas gracias