Crónica de un un comportamiento no esperado 1


Advertencia: Si llegaste a este post buscando como enviar un formulario, obtener los datos en PHP y después hacer una consulta o algo más no apliques la vieja confiable de copy & paste porque este post esta lleno de malas  PÉSIMAS practicas. Además los código presentan errores o son cosas que definitivamente no deberías hacer

De como comenzó todo

Un domingo por la tarde, como cualquier otro, un joven programador  solicita alguien que sepa PHP y JavaScript para que lo ayude con un pequeño problemita y si hay algo en esta vida de lo que me honre (modestia aparte) es de saber PHP y JavaScript (más lo primero que lo segundo) , así que decido ayudarlo:

Publicación original del joven programador en un grupo

Su problema, según sus propias palabras, era:

…estoy intentando que al momento de capturar una matricula para realizar un reporte te aparezca debajo el nombre de la persona a quien pertenece la matricula El problema es que no pasa del todo bien la variable donde tengo almacenada dicha matricula Y al momento de leer la sentencia sql no da el resultado
La matricula se almacena en una variable de javascript Pero necesito que esa variable pase a php para ahi poderla usar en la busqueda en la base de datos Pero parece que no pasa la matricula como deberia porque al momento de hacer la consulta no te regresa ningun resultado, pero si pones la misma matricula tal cual en la sentencia sql si regresa resultado.
Imagino que seguramente su problema esta al pasar los datos con Ajax o tal vez en la lectura de dichos datos en PHP, así que mis preguntas van por ese lado, preguntándole si puede imprimir dichas variables en php y me manda la siguiente captura:

La captura donde parece que los datos se reciben bien

Parece que todo esta funcionando bien, aunque sospecho de algún error al momento de escapar la matricula, que tal vez no lo este considerando como un string, algún espacio o carácter al principio o fin de la cadena…

Cuando las cosas comienzan a ponerse extrañas

En este punto pido capturas de su código y recibo lo siguiente:

Código de PHP donde recibe la matricula y hace la consulta

En este punto quiero hacer nota lo siguiente: esta usando PDO e incluye el archivo donde hace la conexión, no la hace inline, lo que me hace pensar que tratando con un programador con al menos buenos conocimientos básicos del lenguaje, además su editor tiene fondo negro, eso es de chicos cool ¿no?

Posteriormente recibo esta captura que me hace decir ¡WTF!

Una forma rara de ‘combinar’ PHP y JavaScript

Lo que más me sorprende y que choca contra todo lo que creía saber, es que: ¡esta pasando una variable de JavaScript a una función de PHP! Ni siquiera sabía que eso se pudiera hacer, espera ¿eso se puede? Pues la primera captura donde hace echo de matricula parece indicar que si. Llegando a este punto me siento con una curiosidad tremenda y le pido que si me puede pasar su código, tenía unas ganas enormes de saber que carajos estaba pasando.

 

[smartads]

 

Manos a la obra

 

Mis primeros intentos van enfocados en probar mis teorías de problemas con los string, así que hago lo siguiente:

 

si, mi editor tiene fondo blanco, no soy chico cool 🙁

Y si, como podrán sospechar obtengo que mis variables son diferentes, después procedo con un var_dump y lo que obtengo me sorprende, aunque a la distancia parece algo esperado, para empezar la variable si era un string, pero con 13 caracteres en lugar de 11 y su valor era: ‘matricula’

 

[smartads]

Un rayo de luz

Llegados a este punto comprendo perfectamente que se esta recibiendo un string y no el valor de dicha variable, pero habia algo que me intrigaba ¿por qué al hacer el echo me muestra el valor de la varibale y no el string que estoy recibiendo?

En este punto tengo la teoría de que al imprimir dicho valor estoy escapando la variable matricula de JavaScript y al llamar la función html() se esta tomando su valor, para corroborarlo cambio dicho valor por el nombre de otra variable de JavaScript, resultando en lo siguiente:

El código con el paso del gigante

 

El resultado que prueba mi teoría

Como la captura confirma estoy en lo cierto y ahora valido que efectivamente no se puede pasar directamente una variable de JavaScript a PHP

 

Una nueva esperanza

En este momento ya había saciado mi curiosidad, pero ya solo para resolver el problema del joven decido hacerlo con Cookies, utilizando:  Cookies.set(matri, matricula); y leyendo en PHP con $_COOKIE[“matr”] lo cual nuevamente presenta un problema y es que PHP dice que no existe dicha cookie.

¿Cuál es el problema?

Muy simple, las cookies viajan con los encabezados (headers) de la petición, por lo tanto no pueden ser utilizados hasta que se produzca una nueva petición, es decir, si recargo la página ahora si podre leer correctamente la cookie. Por lo tanto ya se descarta la idea original que era hacerlo sin recargar la página y el código final pueden verlo en el siguiente link

Como pueden ver, al final simplemente se hace un redirecionamiento de la siguiente forma: window.location=”/MaestrosReportes.php”

Y si, claro que podríamos evitar usar la cookie pasando el valor de la matricula como parámetro GET: window.location=”/MaestrosReportes.php?matricula=”+matricula;

 

¿Como debería hacerlo?

Entiendo perfectamente que cuando comenzamos simplemente buscamos que funcione, sin importarnos las formas, pero es nuestra responsabilidad aprender cuales son mejores formas de hacerlo.

A continuación enlisto un par de formas de hacerlo de mejor forma, sin entrar a profundidad en temas como de que la vista debería estar desacoplada del controlador , etc.:

Recargando la página

  • Hacemos un formulario que tenga como atributo action la misma página, en PHP recibimos los valores como GET o POST según corresponda y listo. Claro que tendríamos que agregar un boton de enviar, o podemos enviar el formulario cuando se escribe una matricula de 11 caracteres y sin tener que hacer click en el botón

Sin recargar la página

  • Hacemos una llamada con ajax y listo
  • Si te sientes atrevido y buscas hacerlo real-time puedes hacerlo con un web socket que puedes programar tu o usar un servicio como Pusher.

 

Como aprendizaje final quiero recalcar que desde un comienzo pude haber dicho “ese código esta mal, no debería funcionar” sin saber a ciencia cierta que pasaba, pero la curiosidad me impulso a investigar y dicen por ahí que: la curiosidad mato al gato hizo hacker al gato 😉

Link: http://yabuilder.com/AUFj