[SOLUCIONADO] Formulario con datapicker

jdelrosario · #1 (**permalink**) 29/07/2020, 10:35

Hola a todos:
Tengo un formulario al cual deseo insertarle un datapicker, o mejor dicho dos datapicker. Que serían a saber: un input "Desde": y otro input "Hasta", donde el cliente debería elegir una fecha "desde cuando" y "hasta cuando".
Luego como se recoge en el php correspondiente ambos input.
A continuación un formulario que va de muestra por como lo tengo hasta ahora, sin los datapicker por supuesto.
Si alguien me tira una mano "o dos"! ya que lo mío no es el código sino mas bien el diseño, aunque voy metiendo mano de vez en cuando. Jejeje

Mil gracias por adelantado.

Código PHP:

Ver original<?php
 
header('Content-Type: text/html; charset=UTF-8');
if(isset($_POST['email'])) {
    $email_to = "[email protected]";
    $email_subject = "Contacto ";
    function died($error) {
        // Mensaje de error
        echo "Disculpas, pero ha ocurrido un error con lo datos del formulario. ";
        echo "El o los errores son los siguientes.<br /><br />";
        echo $error."<br /><br />";
        echo "Por favor correjir los errores.<br /><br />";
        die();
    }
    // validacion de campos
    if(!isset ($_POST['name']) ||
        !isset($_POST['email']) ||
 
 
        !isset($_POST['message'])) {
        died('Disculpas, pero ha ocurrido un error al enviar el formulario.');
    }
    $name = $_POST['name']; // obligatorio
    $email = $_POST['email']; // obligatorio
 
    $message = $_POST['message']; // obligatorio
    $error_message = "";
    $email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/';
  if(!preg_match($email_exp,$email)) {
    $error_message .= 'La direccion de e-mail es incorrecta.<br />';
  }
 
    $string_exp = "/^[A-Za-z äëïöüñáéíóú.'-]+$/";
  if(!preg_match($string_exp,$name)) {
    $error_message .= 'EL nombre no es un nombre valido.<br />';
  }
 
  if(strlen($message) < 2) {
    $error_message .= 'El comentario no parece estar completo.<br />';
  }
  if(strlen($error_message) > 0) {
    died($error_message);
  }
    $email_message = "Detalles del mensaje enviado desde formulario de contacto.\n\n";
    function clean_string($string) {
      $bad = array("content-type","bcc:","to:","cc:","href");
      return str_replace($bad,"",$string);
    }
    $email_message .= "Nombre: ".clean_string($name)."\n";
 
    $email_message .= "Email: ".clean_string($email)."\n";
        $email_message .= "Mensaje: ".clean_string($message)."\n";
// estructura del correo
 
$headers = 'From: '.$email."\r\n".
'Reply-To: '.$email."\r\n" .
'X-Mailer: PHP/' . phpversion();
$nombre = $_POST['name'];
$email = $_POST['email'];
$mensaje = $_POST['message'];
 
 
echo "<br>";
echo "<h3>Nos has enviado el siguiente mensaje :</h3>";
echo("Nombre:");
echo "<br>";
echo $name;
echo "<br>";
echo "<br>";
echo("Email:");
echo "<br>";
echo $email;
echo "<br>";
echo "<br>";
echo("Mensaje:");
echo "<br>";
echo $message;
echo "<br>";
echo "<br>";
echo "<hr>";
echo "<br>";
echo "<br>";
echo("Muchas gracias, pronto atenderemos tu consulta.");
echo "<br>";
echo "<br>";
echo("JM");
echo "<br>";
echo("Servicios globales");
echo "<br>";
echo("Global");
echo "<br>";
@mail($email_to, $email_subject, $email_message, $headers);
echo "<br>";
 
?>
 
<link rel="stylesheet" type="text/css" href="assets/css/style.php" />
 
<!-- incluimos nuestro mensaje de agradecimiento -->
<body>
 
<?php
}
?>

Triby · #2 (**permalink**) 29/07/2020, 10:55

En ese script procesas el formulario, pero... no está el formulario!

jdelrosario · #3 (**permalink**) 29/07/2020, 11:13

Pido disculpas!!!!
A continuación el form, es simple:

<form action=contac.php method=post accept-charset="UTF-8">
<div class=input-field>
<input class=form-control name=name placeholder="Nombre y Apellido" required>
</div><br>
<div class=input-field>
<input type=email class=form-control name=email placeholder="Su email" required>
<input type="checkbox" name="contact_me_by_fax_only" value="1" style="display:none !important" tabindex="-1" autocomplete="off">
</div><br>
<div class="input-field message">
<textarea name=message class=form-control placeholder="Su mensaje" required></textarea>
</div><br><br>
<input type=submit class="btn btn-blue pull-right" value="ENVIAR MENSAJE" id=msg-submit>
</form>

Nuevamente muchas gracias

Alexis88 · #4 (**permalink**) 29/07/2020, 17:05

El widget Datepicker requiere ser asociado a un elemento del DOM, por lo general a elementos <input>. Dado que dichos elementos poseen el atributo value, en el archivo PHP puedes recoger el valor seleccionado por el usuario del mismo modo en el que lo harías con cualquier otro elemento del formulario.

Código HTML:

Ver original<input type="text" name="fecha" />

Código Javascript:

Ver original$("[name=fecha]").datepicker();

Código PHP:

Ver original//Por el método de envío POST
$_POST['fecha'];
 
//Por el método de envío GET
$_GET['fecha'];

jdelrosario · #5 (**permalink**) 30/07/2020, 10:21

Muchas gracias ha sido de utilidad. Hasta la próxima. Saludos cordiales

jdelrosario · #6 (**permalink**) 30/07/2020, 11:40

Gracias, Alexis88. Y aquí nuevamente al ruedo:

Me despacha bien el formulario llega a destino con descripción de "fecha" con el inconveniente que, al recibirlo, figura de esta manera: "Desde: 2020-08-08 Hasta: 2020-08-08", cuando en realidad se había seleccionado: "Desde el 6/8/2020 al 8/8/20". Igualmente en la respuesta automática que se brinda al enviar el formulario, sale todo, menos las fechas elegidas.

He aquí como quedó el código del formulario:

Código HTML:

Ver original<form action=contac.php method=post accept-charset="UTF-8">
<div class=input-field>
<input class=form-control name=name placeholder="Nombre y Apellido" required>
</div><br>
<div class=input-field>
<input type=email class=form-control name=email placeholder="Su email" required>
<input type="checkbox" name="contact_me_by_fax_only" value="1" style="display:none !important" tabindex="-1" autocomplete="off">
</div><br>
<div class=input-field>
          Desde:<br><input type="date" name="fecha"><br>
          Hasta:<br><input type="date" name="fecha"><br>
          <div><br>
<div class="input-field message">
<textarea name=message class=form-control placeholder="Su mensaje" required></textarea>
</div><br><br>
<input type=submit class="btn btn-blue pull-right" value="ENVIAR MENSAJE" id=msg-submit>
</form>

Y aquí el php:

Código PHP:

Ver original<?php
header('Content-Type: text/html; charset=UTF-8');
if(isset($_POST['email'])) {
    $email_to = "[email protected]";
    $email_subject = "Contacto ";
    function died($error) {
        // Mensaje de error
        echo "Disculpas, pero ha ocurrido un error con lo datos del formulario. ";
        echo "El o los errores son los siguientes.<br /><br />";
        echo $error."<br /><br />";
        echo "Por favor correjir los errores.<br /><br />";
        die();
    }
    // validacion de campos
    if(!isset ($_POST['name']) ||
        !isset($_POST['email']) ||
 
 
        !isset($_POST['message'])) {
        died('Disculpas, pero ha ocurrido un error al enviar el formulario.');
    }
    $name = $_POST['name']; // obligatorio
    $email = $_POST['email']; // obligatorio
    $fecha = $_POST['fecha'];
    $fecha = $_POST['fecha'];
    $message = $_POST['message']; // obligatorio
    $error_message = "";
    $email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/';
  if(!preg_match($email_exp,$email)) {
    $error_message .= 'La direccion de e-mail es incorrecta.<br />';
  }
 
    $string_exp = "/^[A-Za-z äëïöüñáéíóú.'-]+$/";
  if(!preg_match($string_exp,$name)) {
    $error_message .= 'EL nombre no es un nombre valido.<br />';
  }
 
  if(strlen($message) < 2) {
    $error_message .= 'El comentario no parece estar completo.<br />';
  }
  if(strlen($error_message) > 0) {
    died($error_message);
  }
    $email_message = "Detalles del mensaje enviado desde formulario de contacto.\n\n";
    function clean_string($string) {
      $bad = array("content-type","bcc:","to:","cc:","href");
      return str_replace($bad,"",$string);
    }
    $email_message .= "Nombre: ".clean_string($name)."\n";
    $email_message .= "Desde: ".clean_string($fecha)."\n";
    $email_message .= "Hasta: ".clean_string($fecha)."\n";
    $email_message .= "Email: ".clean_string($email)."\n";
    $email_message .= "Mensaje: ".clean_string($message)."\n";
// estructura del correo
 
$headers = 'From: '.$email."\r\n".
'Reply-To: '.$email."\r\n" .
'X-Mailer: PHP/' . phpversion();
$nombre = $_POST['name'];
$email = $_POST['email'];
$mensaje = $_POST['message'];
$fecha = $_POST['fecha'];
 
 
 
echo "<br>";
echo "<h3>Nos has enviado el siguiente mensaje :</h3>";
echo("Nombre:");
echo "<br>";
echo $name;
echo "<br>";
echo "<br>";
echo("Email:");
echo "<br>";
echo $email;
echo "<br>";
echo "<br>";
echo("Mensaje:");
echo "<br>";
echo $message;
echo "<br>";
echo "<br>";
echo "<hr>";
echo "<br>";
echo "<br>";
echo("Muchas gracias, pronto atenderemos tu consulta.");
echo "<br>";
echo "<br>";
echo("JM");
echo "<br>";
echo("Servicios globales");
echo "<br>";
echo("Global");
echo "<br>";
@mail($email_to, $email_subject, $email_message, $headers);
echo "<br>";
 
?>
 
<link rel="stylesheet" type="text/css" href="assets/css/style.php" />
 
<!-- incluimos nuestro mensaje de agradecimiento -->
<body>
 
<?php
}
?>

Alexis88 · #7 (**permalink**) 31/07/2020, 03:27

Lo que sucede es que los <input> que utilizas son de tipo date. Dicho tipo de elemento muestra un calendario y fecha sin la necesidad de recurrir al widget datepicker de jQuery, pero mostrando la fecha en el formato año-mes-día.

El uso del widget datepicker de jQuery se recomienda para casos en los que el sitio o aplicación web fuera a ser utilizado en navegadores que no den soporte a elementos como el <input> de tipo date, o bien para usarlo en otro tipo de elementos, como un <div>, e incluso para hacer uso de sus múltiples configuraciones. No obstante, si lo que deseas es tener una caja de texto que muestre un calendario y fecha, con el <input> de tipo date es suficiente dado que la mayoría de navegadores modernos dan soporte al estándar HTML5, que es en donde se contempla ese tipo de elemento de entrada.

Por otra parte, tu problema se puede resolver fácilmente dándole formato a la fecha recibida. Por ejemplo, podrías utilizar la función explode() para separar los datos de la fecha a partir de los guiones; luego, con la función array_reverse() puedes invertir el orden de año-mes-día a día/mes/año; enseguida, con la función implode() unir todos los elementos mediante un caracter de unión, como el slash o barra diagonal /; y, finalmente, mostrarlo.

Código PHP:

Ver original$fecha = implode('/', array_reverse(explode('-', $_POST('fecha'))));
echo "Desde $fecha";

Si tienes dudas acerca de los elementos o funciones mencionadas, he adjuntado enlaces hacia las indicaciones de los respectivos manuales de cada uno (son las palabras resaltadas en color anaranjado).

NOTA: Estás usando el mismo nombre, "fecha", para las dos cajas de texto. Te sugiero utilizar nombres distintos, como "desde" y "hasta", y recogerlos mediante dichos nombres en el archivo PHP y así evitar recibir solo una de las dos fechas seleccionadas.

jdelrosario · #8 (**permalink**) 31/07/2020, 06:38

Estimado Alexis88; ojalá pudiera recompensar por esta gran ayuda que me están brindando desde este foro, es un trabajo ad-honorem en el cual colaboro como simple aficionado; por este motivo te pido un esfuerzo más, copio como he corregido el código para que me indiques (please) que debo modificar ya que no me lo envía, aunque no me muestra error.

Código PHP:

Ver original<?php
 
header('Content-Type: text/html; charset=UTF-8');
if(isset($_POST['email'])) {
    $email_to = "[email protected]";
    $email_subject = " Contacto  ";
    function died($error) {
        // Mensaje de error
        echo "Disculpas, pero ha ocurrido un error con lo datos del formulario. ";
        echo "El o los errores son los siguientes.<br /><br />";
        echo $error."<br /><br />";
        echo "Por favor correjir los errores.<br /><br />";
        die();
    }
    // validacion de campos
    if(!isset ($_POST['name']) ||
        !isset($_POST['email']) ||
 
 
        !isset($_POST['message'])) {
        died('Disculpas, pero ha ocurrido un error al enviar el formulario.');
    }
    $name = $_POST['name']; // obligatorio
    $email = $_POST['email']; // obligatorio
    $desde = $_POST['desde'];
    $hasta = $_POST['hasta'];
    $message = $_POST['message']; // obligatorio
    $error_message = "";
    $email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/';
  if(!preg_match($email_exp,$email)) {
    $error_message .= 'La direccion de e-mail es incorrecta.<br />';
  }
 
    $string_exp = "/^[A-Za-z äëïöüñáéíóú.'-]+$/";
  if(!preg_match($string_exp,$name)) {
    $error_message .= 'EL nombre no es un nombre valido.<br />';
  }
 
  if(strlen($message) < 2) {
    $error_message .= 'El comentario no parece estar completo.<br />';
  }
  if(strlen($error_message) > 0) {
    died($error_message);
  }
    $email_message = "Detalles del mensaje enviado desde formulario de contacto.\n\n";
    function clean_string($string) {
      $bad = array("content-type","bcc:","to:","cc:","href");
      return str_replace($bad,"",$string);
    }
    $email_message .= "Nombre: ".clean_string($name)."\n";
    $email_message .= "Desde: ".clean_string($desde)."\n";
    $email_message .= "Hasta: ".clean_string($hasta)."\n";
    $email_message .= "Email: ".clean_string($email)."\n";
    $email_message .= "Mensaje: ".clean_string($message)."\n";
// estructura del correo
 
$headers = 'From: '.$email."\r\n".
'Reply-To: '.$email."\r\n" .
'X-Mailer: PHP/' . phpversion();
$nombre = $_POST['name'];
$email = $_POST['email'];
$mensaje = $_POST['message'];
 
 
 $desde = implode('/', array_reverse(explode('-', $_POST('desde'))));
echo "Desde $desde";
$hasta = implode('/', array_reverse(explode('-', $_POST('hasta'))));
echo "Hasta $hasta";
 
 
echo "<br>";
echo "<h3>Nos has enviado el siguiente mensaje :</h3>";
echo("Nombre:");
echo "<br>";
echo $name;
echo "<br>";
echo "<br>";
echo("Email:");
echo "<br>";
echo $email;
echo "<br>";
echo "<br>";
echo("Mensaje:");
echo "<br>";
echo $message;
echo "<br>";
echo "<br>";
echo "<hr>";
echo "<br>";
echo "<br>";
echo("Muchas gracias, pronto atenderemos tu consulta.");
echo "<br>";
echo "<br>";
echo("JM");
echo "<br>";
echo("Servicios globales");
echo "<br>";
echo("Global");
echo "<br>";
@mail($email_to, $email_subject, $email_message, $headers);
echo "<br>";
 
?>
 
<link rel="stylesheet" type="text/css" href="assets/css/style.php" />
 
<!-- incluimos nuestro mensaje de agradecimiento -->
<body>
 
<?php
}
?>

Gracias nuevamente a todos

Alexis88 · #9 (**permalink**) 31/07/2020, 09:14

¿Cambiaste los nombres de los campos de selección de fecha en tu formulario?

Por favor, cuando coloques código, utiliza el highlight adecuado para que sea más fácil de leer.

jdelrosario · #10 (**permalink**) 31/07/2020, 11:11

Los campos de selección de fecha fueron cambiados "Desde" y "Hasta":
<div class=input-field>
Desde:<br><input type="date" name="desde"><br>
Hasta:<br><input type="date" name="hasta"><br>
<div><br>

Alexis88 · #11 (**permalink**) 31/07/2020, 11:14

Fíjate en la consola del navegador si se muestra algún mensaje de error. Si dices que no se envían los datos, algo tiene que estar pasando.

jdelrosario · #12 (**permalink**) 31/07/2020, 11:34

Failed to load resource: the server responded with a status of 500 (Internal Server Error) en contac.php.
Eso es todo lo que muestra y la página en blanco.

Alexis88 · #13 (**permalink**) 31/07/2020, 11:40

Es un error en el lado del servidor, es decir, en donde se ejecuta el archivo PHP. Puede ser que tengas un problema en el código.

Intenta hacer una pequeña prueba así:

Código HTML:

Ver original<form action=contac.php method=post accept-charset="UTF-8">
    <div class=input-field>
        <input class=form-control name=name placeholder="Nombre y Apellido" required>
    </div>
    <div class=input-field>
        <input type=email class=form-control name=email placeholder="Su email" required>
        <input type="checkbox" name="contact_me_by_fax_only" value="1" style="display:none !important" tabindex="-1" autocomplete="off">
    </div>
    <div class=input-field>
          Desde:<br><input type="date" name="desde"><br>
          Hasta:<br><input type="date" name="hasta">
    </div>
    <div class="input-field message">
        <textarea name=message class=form-control placeholder="Su mensaje" required></textarea>
    </div>
    <input type=submit class="btn btn-blue pull-right" value="ENVIAR MENSAJE" id=msg-submit>
</form>

Código PHP:

Ver original<?php
$desde = implode('/', array_reverse(explode('-', $_POST('desde'))));
echo "Desde $desde<br />";
$hasta = implode('/', array_reverse(explode('-', $_POST('hasta'))));
echo "Hasta $hasta";
?>

Si todo marcha sin problemas, empieza a ir añadiendo otras porciones del código restante hasta que des con la que te cause el inconveniente. Puedes dejar comentadas las líneas de código que no usarás en cada prueba para que evites tener que copiar y pegar todo.