Toggle navigation
Bootsnipp
Bootstrap
For
CSS Frameworks
Bootstrap
Foundation
Semantic UI
Materialize
Pure
Bulma
References
CSS Reference
Tools
Community
Page Builder
Form Builder
Button Builder
Icon Search
Dan's Tools
Diff / Merge
Color Picker
Keyword Tool
Web Fonts
.htaccess Generator
Favicon Generator
Site Speed Test
Snippets
Featured
Tags
By Bootstrap Version
4.1.1
4.0.0
3.3.0
3.2.0
3.1.0
3.0.3
3.0.1
3.0.0
2.3.2
Register
Login
"formulario contacto html, php y ajax con mesaje de afirmacion"
Bootstrap 3.3.0 Snippet by
dan2589
3.3.0
ajax
contact
Preview
HTML
View Full Screen
Forked from
Fork
Fork this
Parent
780
 
0 Fav
Post to Facebook
Tweet this
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <meta name="description" content=""> <meta name="author" content=""> <link rel="icon" href="../image/favicon.ico"> <title>titulo</title> <!-- Bootstrap core CSS --> <link href="../css/bootstrap.min.css" rel="stylesheet"> <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> <link href="../css/ie10-viewport-bug-workaround.css" rel="stylesheet"> <!-- Just for debugging purposes. Don't actually copy these 2 lines! --> <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]--> <script src="../js/ie-emulation-modes-warning.js"></script> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]--> <!-- Custom styles for this template --> <link href="../css/carousel.css" rel="stylesheet"> <script src="../js/jquery.min.js"></script> <script> $(document).ready(function(){ $("#Formulario").submit(function( event ){ event.preventDefault(); $.ajax({ type: 'POST', url: '../php/contacto2.php', data: $(this).serialize(), success: function(data){ $("#respuesta").slideDown(); $("#respuesta").html(data); $('#respuesta2').modal('show'); document.getElementById('Formulario').reset(); } }); return false; }); }); </script> </head> <body> <!-- Content --> <section> <div class="container"> <div class="container"> <h4>empresa</h4> <div class="container"> <iframe src="https://www.google.com/maps/embed?pb=!1m21!1m12!1m3!1d7889.40621095499!2d-70.23299216136742!3d8.624475075086659!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!4m6!3e6!4m0!4m3!3m2!1d8.626995899999999!2d-70.2301559!5e0!3m2!1ses-419!2sve!4v1456756695234" style="border:0" allowfullscreen="" frameborder="0" height="250" width="100%"></iframe> </div> <strong>Contactenos</strong><br><strong>Oficina:</strong> 123456789 <hr> </div> <div class="container"> <form role="form" id="Formulario" action="../php/contacto2.php" method="POST"> <div class="form-group"> <label class="control-label" for="Nombre">Nombres</label> <input type="text" class="form-control" id="Nombre" name="Nombre" placeholder="Introduzca su nombre" required autofocus /> </div> <div class="form-group"> <label class="control-label" for="Motivo">Motivo de Contacto</label> <select name="Motivo" class="form-control"> <option value="Consulta General">Consulta General</option> <option value="Realizar Pedido">Realizar Pedido</option> <option value="Informe un problema">Informe un problema</option> </select> </div> <div class="form-group"> <label class="control-label" for="Empresa">Empresa</label> <input type="text" class="form-control" id="Empresa" name="Empresa" placeholder="Introduzca el nombre de su empresa" required /> </div> <div class="form-group"> <label class="control-label" for="Correo">Dirección de Correo Electrónico</label> <input type="email" class="form-control" id="Correo" name="Correo" placeholder="Introduzca su correo electrónico" required /> </div> <div class="form-group"> <label class="control-label" for="Mensaje">Mensaje</label> <textarea rows="5" cols="30" class="form-control" id="Mensaje" name="Mensaje" placeholder="Introduzca su mensaje" required ></textarea> </div> <div class="form-group"> <input type="submit" class="btn btn-primary" value="Enviar"> <input type="reset" class="btn btn-default" value="Limpiar"> </div> <div id="respuesta" style="display: none;"></div> </form> </div> </div> </section> <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script>window.jQuery || document.write('<script src="../js/jquery.min.js"><\/script>')</script> <script src="../js/bootstrap.min.js"></script> <!-- Just to make our placeholder images work. Don't actually copy the next line! --> <script src="../js/holder.min.js"></script> <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> <script src="../js/ie10-viewport-bug-workaround.js"></script> </body> </html> <!--esta parte de codigo que viene es la que va en un documento php con nombre contacto2.php*/ <?php //Importamos las variables del formulario de contacto @$Nombre = htmlspecialchars($_POST['Nombre']); @$Motivo = htmlspecialchars($_POST['Motivo']); @$Empresa = htmlspecialchars($_POST['Empresa']); @$Correo = htmlspecialchars($_POST['Correo']); @$Mensaje = htmlspecialchars($_POST['Mensaje']); //Preparamos el mensaje de contacto $cabeceras = "From: $Correo\n" //La persona que envia el correo . "Reply-To: $Correo\n"; $asunto = "From: CONTACTO DISYTEL IMPORT $Motivo\n"; //asunto aparecera en la bandeja del servidor de correo $email_to = "tuemail@tuemail.com"; //cambiar por tu email $contenido = "$Nombre ha enviado un mensaje desde el sitio web www.disimpor.com.ve\n" . "\n" . "Nombre: $Nombre\n" . "Motivo: $Motivo\n" . "Empresa: $Empresa\n" . "Correo: $Correo\n" . "Mensaje: $Mensaje\n" . "\n"; //Enviamos el mensaje y comprobamos el resultado if (@mail($email_to, $asunto ,$contenido ,$cabeceras )) { //Si el mensaje se envía muestra una confirmación echo '<div class="modal fade" id="respuesta2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="alert alert-success alert-dismissable"> <button type="button" class="close" data-dismiss="modal">×</button> <strong>Su mensaje ha sido enviado correctamente.</strong> </div> </div> </div>'; }else{ //Si el mensaje no se envía muestra el mensaje de error echo '<div class="modal fade" id="respuesta2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="alert alert-danger alert-dismissable"> <button type="button" class="close" data-dismiss="modal">×</button> <strong>ERROR. Intente mas tarde.</strong> </div> </div> </div>'; } ?> -->
Related:
See More
Free Template
Light Bootstrap Dashboard Angular
74.4K
110
AJAX / DIV Wizard
Questions / Comments:
Post
Posting Guidelines
Formatting
- Now
×
Close
Donate
BTC: 12JxYMYi6Vt3mx3hcmP3B2oyFiCSF3FhYT
ETH: 0xCD715b2E3549c54A40e6ecAaFeB82138148a6c76