El tema de los formatos de fechas siempre me resulto molesto hasta que pude encontrar una solución bastante cómoda para mostrar y guardar las fechas a través de un DatePicker y voy a compartirla con ustedes.
Configurar el formato de fecha en Blade y jQuery
Supongamos que tenemos un formulario con una fecha de vencimiento de producto, donde este campo es de tipo DATE en nuestra base de datos con el formato por defecto yyyy-mm-dd.
Pero en nuestro frontend queremos mostrar la misma fecha con el formato dd-mm-yyyy.
Vamos a ver como quedaría nuestro archivo Blade con la inicialización del plugin jQuery DatePicker UI.
Para establecer el formato de fecha, debemos agregar un parámetro a datepicker().
$("#expiracion").datepicker({
format: 'dd-mm-yy'
});
Para hacerlo un poco mas elegante, vamos a ponerlo en config/app.php.
[
// ...
'date_format_js' => 'dd-mm-yy',
// ...
]
Entonces, nuestro archivo Blade quedará:
$("#expiracion").datepicker({
format: '{{ config("app.date_format_js") }}'
});
Guardando la fecha en el formato correcto
Ahora bien, si guardamos la fecha con el formato dd-mm-yy nuestra base de datos (MySQL, para este ejemplo) nos dará el error Invalid datetime format porque MySQL espera el formato Y-m-d.
Así que vamos a transformar el formato del dato antes de guardarlo. Para esto utilizaremos los Mutators de Laravel. Vamos a agregar el mutator en el model Product que corresponde al campo fecha de vencimiento del producto.
Como ven, estamos utilizando el método createFromFormat de la clase Carbon para modificar el formato de la fecha de vencimiento que recibimos por el formulario.
Vamos a agregar elegancia al mutator. Así que, cambiamos ‘d-m-Y’ por el valor de nuestra configuración.
Y modificamos nuestro archivo config/app.php:
[
// ...
'date_format' => 'd-m-Y',
'date_format_js' => 'dd-mm-yy',
// ...
]
Nota: tenemos dos variables de configuración diferentes porque PHP y JavaScript tienen reglas diferentes para dar formato a las fechas.
Y de esta manera podemos hacer que la fecha se guarde en nuestra base de datos correctamente.
Mostrando y/o editando la fecha en formato deseado
Si queremos mostrar la fecha que acabamos de guardar o rellenar el campo con la fecha para ser editada, vamos a utilizar un accesor de Laravel.
Como hicimos con el mutator, también vamos a definir el accesor en el modelo Product.
Con esta configuración, podemos cambiar fácilmente el formato de la fecha a lo que queramos, simplemente cambiando los valores en config/app.php.
Conclusión
Esto es una forma de trabajar con los formatos de fechas que me ha ayudado mucho cuando tenia que utilizar DatePicker con Laravel. Sin duda, los accessors y mutators hacen las cosas mas fáciles y los recomiendo mucho utilizarlos para este tipo de cosas. Nos leemos en la próximo. 😉🤙
