tengo 2 errores en mi formulario de contacto:
PHP no está enviando los datos del campo telefono.
Al recibir los datos en mi correo, no muestra las "ñ" del textarea.
En partes del codigo pueden ver que tengo intenciones de hacer la validación con las clases de Bootstrap pero aun no la estoy utilizando, quiero primero asegurarme que todos los campos se envian correctamente.
HTML:
<form class="formulario needs-validation">
<div class="formuno">
<label>Nombre y Apellido / Name and Last Name:</label><br>
<input id="nombre" type="text" name="nombre" required>
<br>
<label>Correo Electronico / Email:</label><br>
<input id="email" type="email" name="email" id="email" required>
<br>
<label>Telefono / Phone:</label><br>
<input id="telefono" type="tel" name="telefono" required>
<br>
</div>
<div class="formdos">
<label>Mensaje / Message:</label><br>
<textarea id="mensaje" name="mensaje" id="mensaje" cols="30" rows="10" required></textarea>
<br>
<input class="boton" type="submit" value="Enviar / Send">
</div>
</form>
JS:
(function() {
use strict;
window.addEventListener('load', function() {
var forms = document.getElementsByClassName('needs-validation');
var validation = Array.prototype.filter.call(forms, function(form) {
form.addEventListener('submit', function(event) {
event.preventDefault();
if (form.checkValidity() === false) {
event.stopPropagation();
} else {
var nombre = document.getElementById('nombre').value,
email = document.getElementById('email').value,
telefono = document.getElementById('telefono').value,
mensaje = document.getElementById('mensaje').value;
console.log(nombre);
console.log(email);
console.log(telefono);
console.log(mensaje);
var xhr = new XMLHttpRequest();
xhr.open('POST', '/enviar.php');
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.onload = function() {
if (xhr.status === 200) {
var respuesta = JSON.parse( xhr.responseText );
console.log( respuesta );
}
};
xhr.send('nombre='+nombre+'&email='+email+'&mensaje='+mensaje);
}
form.classList.add('was-validated');
}, false);
});
}, false);
})();
PHP:
<?php
$nombre = $_POST['nombre'];
$email = $_POST['email'];
$telefono = $_POST['telefono'];
$mensaje = $_POST['mensaje'];
$header = 'From: ' . $email . "\r\n";
$header .= 'X-Mailer: PHP/' . phpversion() . "\r\n";
$header .= 'Mime-Version: 1.0 \r\n';
$header .= 'Content-Type: text/plain';
$mensajeCorreo = "Este email fue enviado por: " . $nombre . "\r\n";
$mensajeCorreo .= "Email: " . $email . "\r\n";
$mensajeCorreo .= "Telefono: " . $telefono . "\r\n";
$mensajeCorreo .= "Mensaje: " . $mensaje . "\r\n";
$para = "danyel.saavedra@gmail.com";
$asunto = "Contacto de sitio web - Alpasoaventura.com";
mail($para, $asunto, utf8_encode($mensajeCorreo), $header );
echo json_encode(array(
'mensaje' => sprintf('El mensaje se ha enviado!'),
'datos' => array(
'nombre' => $nombre,
'email' => $email,
'mensaje' => $mensaje,
'telefono' => $telefono
)
));
Probando el formulario arroja los siguientes resultados:
Al parecer Javascript obtiene bien los datos pero PHP tiene problemas con el campo "telefono".
Esto llego al correo:
Espero que me puedan ayudar.
Muchas gracias!