Enviar formulario sin recargar

Jarcx9 · 24 Noviembre 2014, 23:15 PM

Buenas parceros,

Estoy haciendo un pequeño codigo donde incrusto un input en una imagen y envio este formulario via jquery,ajax. El codigo esta bien y envia lo que necesito y todo pero quiero que me muestre un mensaje cuando le de al submit, algo asi como se envio correctametne.

Estoy probando pero no he podido solucionarlo, le agradeceria mucho su colaboracion

Código (php) [Seleccionar]

<html>
<head>
<script language="javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script language="javascript">
$(document).ready(function() {
    $().ajaxStart(function() {
        $('#loading').show();
        $('#result').hide();
    }).ajaxStop(function() {
        $('#loading').hide();
        $('#result').fadeIn('slow');
    });
    $('#form, #fat, #mc-embedded-subscribe-form').submit(function() {
        $.ajax({
            type: 'POST',
            url: $(this).attr('action'),
            data: $(this).serialize(),
            success: function(data) {
                $('#result').html(data);

            }
        })
        
        return false;
    }); 
})  
</script>


<link href="//cdn-images.mailchimp.com/embedcode/classic-081711.css" rel="stylesheet" type="text/css">

<style type="text/css">
.form-control {
  width: 34%;
  height: 30px;
  padding: 10px 15px;
  font-size: 15px;
  line-height: 1.42857143;
  color: #2c3e50;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #dce4ec;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
</style>
</head>
<body>


<div id="mc_embed_signup">
<form action="//ribot-barcelona.us5.list-manage.com/subscribe/post?u=d2c4a68aadfd8d6061877b0b2&amp;id=809315d24f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" >

<table  align=center cellpadding=1 cellspacing=2 background="newsletter web_Ribot.jpg" height="415" width="754">

<tr>
<td><br>&nbsp;</td>
</tr>

<tr>
<td><br>&nbsp;</td>
</tr>

<tr>
<td></td>
<td align="right">
<font color="white"><b>E-Mail</b></font> &nbsp;&nbsp;<input type="text" value="" name="EMAIL" id="mce-EMAIL" required class="form-control" >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br><br>
   
   <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button" >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;


    <div id="result" ></div>

 
</td>
</tr>

</table>
</form>
</div>



</body>
</html>

Slikp · 25 Noviembre 2014, 00:13 AM

- No entiendo muy bien que es lo que quieres pero creo que puedes intentar lo siguiente en el Success de tu ajax agregar un append al final con el mensaje que deseas, asi:

Código (javascript) [Seleccionar]


 success: function(data) {
               $('#result').html(data).append('se envio correctametne');
 
           }

alan++ · 25 Noviembre 2014, 14:28 PM

Crear un contenedor, aplicarle una imagen de fondo y en el html el input... ¿no es una opcion?

Jarcx9 · 25 Noviembre 2014, 16:10 PM

Muchas gracias por la colaboracion voy a probar

Lo que pasa con el cod que yo tengo es q el div result no hace nada y no me muestra nada, no se si es porque no se trae nada en data. ya que el formulario se envia a una pagina externa.

Lo que quiero es q se muestra un mensaje pues haci como esta solo enviar el mail y no se sabe si se envio en verdad o no

Yo habia echo esto provisional pero si se produce un error aun asi va a mostrar el mensaje.

Código (javascript) [Seleccionar]


beforeSend: mostrarLoader, 


function mostrarLoader(){
             // $('#loader_gif').fadeIn("slow"); //muestro el loader de ajax
             $("#ajax_loader").append("Se envio Correctamente "); 
        };

Test Foro de elhacker.net SMF 2.1

Enviar formulario sin recargar

Jarcx9

Slikp

alan++

Jarcx9