JavaScript

He estado probando Meteora y Mootools para un buscador de teléfonos y en Firefox me funciona de maravilla pero al querer probar la aplicación en Internet Explorer 7 me aparece el siguiente error:

Y al probar la página en Internet Explorer 6 me aparece otro error muy diferente a el del IE7

La solución para eliminar el problema del IE7 y del IE6 es quitar el encabezado del content type de mi archivo que mando llamar mediante Ajax.

Eliminando esa parte de código ya funciona correctamente la página web, ahora solo falta saber el porque del error que solo aparece en el Internet Explorer??, pues la verdad quien sabe pero ya ven que el IE simplemente es un asco para visualizar páginas web (y yo que pensaba que la versión 7 hiba a ser mas compatible pero nada de nada)

[actualizado] Me acabo de dar cuenta que el resultado de mi Ajax no se ve bien los acentos debido a la codificación ya que necesito utilizar UTF-8 porque en el encabezado de mi página manejo:

y cuando me regresaba el resultado del Ajax pues como quite el content type pues ya me fallaba el asunto, así que para solucionar el problema del UTF y de la misma forma no afecte el error del IE solo se tiene que agregar la siguiente linea:

Y listo!, todo funciona como debe de ser

He estado probando el sitio de un cliente con los diferentes Navegadores (Firefox, IE6, IE7, Safari y Opera) y para variar he tenido más de algún problema, ya saben con quien!!, claro!! con el Internet Explorer 7 y no se diga con la versión 6 del IE (todo un asco de navegador).

Bueno, la cosa esta en que quiero editar dinamicamente mediante Javascript el valor de la propiedad CLASS (clase en español jeje) y al utilizar la propiedad setAttribute('class',"NOMBRE_CLASE") en el Explorer nomas no se realiza el cambio y en los demas navegadores todo va de maravilla.

Ahora bien, después de investigar un poco he encontrado que el IE no soporta el atributo class y en lugar de eso utiliza uno llamado className.

Como he utilizado prototype para mayor compatibilidad solo es necesario poner el siguiente código:

La verdad esta muy fácil de entender, solo es cosa de agregar las librerías del prototype y usar la clausula del IF la cual nos indica si es Internet Exploder entonces se procede con el className y si es cualquier otro navegador decente se procede con el atributo class, asi de fácil.

He estado probando el sitio de un cliente con los diferentes Navegadores (Firefox, IE6, IE7, Safari y Opera) y para variar he tenido más de algún problema, ya saben con quien!!, claro!! con el Internet Explorer 7 y no se diga con la versión 6 del IE (todo un asco de navegador)

Bueno, la cosa esta en que quiero editar dinamicamente mediante Javascript el valor de la propiedad CLASS (clase en español jeje) y al utilizar la propiedad setAttribute('class',"NOMBRE_CLASE") en el Explorer nomas no se realiza el cambio y en los demas navegadores todo va de maravilla.

Ahora bien, después de investigar un poco he encontrado que el IE no soporta el atributo class y en lugar de eso utiliza uno llamado className.

Como he utilizado prototype para mayor compatibilidad solo es necesario poner el siguiente código:

La verdad esta muy fácil de entender, solo es cosa de agregar las librerías del prototype y usar la clausula del IF la cual nos indica si es Internet Exploder entonces se procede con el className y si es cualquier otro navegador decente se procede con el atributo class, asi de fácil.

En internet explorer 6 me aparecía el siguiente error en el debuger del IE:

Lo más curioso es que a veces me aparecia en algunas paginas y en otras no aparecía y tenían los mismos encabezados, hasta que encontre el problema: Utilizo un la etiqueta BASE, pero ejecutaba código javascript antes mediante un archivo externo de JS, osease tenia algo asi:

Osease que todas las rutas estan ligadas a lo que se encuentre en BASE, pero el archivo de JS lo queria cargar antes y pues no encontraba la ruta, asi que la solución es primero poner el BASE y despues ya lo del Javascript, quedando algo asi:

Y listo! no más error en el explorer 6 (en los otros navegadores, Safari, Firefox, Explorer 7 y Opera no me aparecía ese error)

Después de instalar la versión 1.6.0.2 de prototype me aparecía el siguiente error en Firefox

Y buscando la linea de codigo del error me encontraba con el siguiente codigo:

Y para variar en Internet Explorer tenia un bonito mensaje de:

La solución a este problema es actualizar la librería scriptaculous ya que yo tenia la versión 1.7.0 y la cambie por la 1.8.1 y listo! no más mensajes molestos de errores.

Hoy me fije que me apareció el siguiente error en la consola de error de javascript en Firefox:

ó que es lo mismo pero en español.

Primero pensé que era la libreria de javascript prototype ya que la había actualizado a la versión 1.6.0.2 asi que la regrese a la versión 1.5.0 que es con la que estoy trabajando en un proyecto de envío de mensajes vía SMS, pero aun así me aparecia el mismo error, luego pense que se trataba de la propiedad innerHTML ya que habia leido que tenia problemas en InternetExplorer y todas las peticiones con innerHTML las cambie por la función replaceHtml que encontre en el sitio de anieto2k pero aun así tenia el mismo problema.

Luego observe que solo me aparecia cuando le daba click en las cajas de texto ( input type="text" ) o escribia algo en dichas cajas, lo cual me parecia un más raro, y despues de buscar y buscar en Google encontre la solución al problema del HTMLDivElement.parentNode

En primera nunca pense que tenia relación el problema con la librería CalendarPopup la cual permite visualizar un calendario con muchisimas funciones interesantes. y bueno lo unico que se tiene que hacer es remplazar todo lo que diga:

La verdad esta muuy fácil la solución, pero bueno, cuando uno no tiene ni la mas minima idea del error esto se vuelve realmente complicado.

Hoy tuve que agregar un atributo NAME a la página web de compra y venta de equipo médico, Medicalmex ya que tengo un menú y queria que al picarle en las opciones me mandara a una sección definida de la página, de ahi que se utiliza el atributo NAME dentro de una etiqueta A (para enlaces), teniendo algo como: Pie de página y mandar llamarla de la siguiente forma: Ir al pie de página, hasta este punto todo muy normal con la sintaxis HTML , pero el problema empieza cuando tenemos un elemento llamado BASE, el cual nos permite cambiar la dirección principal para cuando utilice una página con ruta relativa tome la base y complete el URL (jeje, no se me hagan bolas ), algo como sigue:

Tenemos nuestra página www.oviedos.com.mx y cuando mandamos llamar la página index.php el navegador automaticamente agrega www.oviedos.com.mx ya que es el sitio web que estamos visitando en este momento, pero que ta si no queremos que al picarle en cualquier liga de la página nos mande llamar a http://www.oviedos.com.mx sino que queremos que llame http://start.oviedos.com.mx, haaa!! pues una solución es utilizar y listo!!! todas las páginas mandaran llamar los links como si fueran de la dirección BASE..., un poco mas claro no???

Entonces si mezclamos NAME con BASE tenemos un problemon!!, ya que si estamos en la página index.php/pages/1.html y mandamos llamar con NAME #abajo deberia quedar index.php/pages/1.html#abajo hasta aquí todo bien!! si no fuera porque nos queda index.php#abajo ya que en nuestra etiqueta BASE tenemos y ahi es donde empiezan los problemas!!, ahora bien la solución a todo esto es utilizar JavaScript

El algoritmo que utilizaremos es:

• Obtener la cadena del URL actual
• Contar con el valor de NAME a el que queremos dirigirnos en la página
• Buscar el cualquier valor NAME en la cadena URL, osease que comience con gato #
• Si se encontro el valor NAME se debe eliminar y dejar la cadena URL sin esa información
• Concatenar el nuevo valor NAME a la URL ya parseada
• Mandar llamar la nueva página web.

Solo se tiene que mandar llamar la función hrefbase con el parametro que es la etiqueta NAME a la cual queremos ir y listo!!, una forma practica es mediante el evento ONCLICK:

Despues pueden utilizar alguna hoja de estilo CSS para darle un formato más adecuado, ya se poniendo una linea de subrayado ( text-decoration: underline; ), o la manita del cursor como si fuera un enlace ( cursor: pointer; ).

Para variar el Internet Explorer (aka, Internet Exploder) no tiene buen soporte para Javascript, porque lo digo!, facil, traten de aplicar a X widget (jeje, ya se me esta pegando esto del Piwi de Jaws) un atributo con setAttribute en especial el onclick que es el que ando utilizando para un proyecto de un sistema de recordatorio de medicamentos en francia

La cosa esta así, uso Jaws con JSpan para todo lo de Ajax y Javascript que a su vez usan prototype para eso de la sintaxis:

Codigo que chafea en el IE.

Aqui la cosa esta que el Internet Exploder NUNCA reconoce el atributo onclick!..., despues de investigar un poco doy con una página en Frances (jeje, que casualidad que esta en frances.., ya parace que poco a poco voy aprendiendo el idioma) que indica la solucion a nuestros problemas.

Cual es la diferencia???..., pues que ya no usamos setAttribute sino que especificamos como un atributo de la funcion delete_button (tiene esa sintaxis rara tipo PHP gracias a prototype) y despues lo igualamos a nuestra funcion, que en este caso es newBene() y listo!...

Ahora tengo otro problema que no puedo crear controles input ni hidden ni cualquier otro tipo en IE con Javascript y recibirlos mediante PHP (me imagino que en ASP tambien seria algun error) por eso digo y sigo insistiendo que el Internet Explorer apestaaa!..., y aunque me digan que es lo que usa la gente!., espero en un futuro no muy lejano que ya no sea el navegador predeterminado de las computadoras!. en verdad se los dice un programador web que vive dia a dia con estos problemas de incompatibilidad con explorer!.. porfas!..., INSTALEN FIREFOX u otro navegador descente en las compus de sus amigos, trabajo, casa, escuela!...

Pues con eso de que me la he pasado programe y programe (se nota debido a la falta de mensajes en el blog) en Jaws ha llegado el momento de utilizar un buscador en donde nos suguiera las coincidencias todo mediante Ajax!..., asì que me di a la tarea de buscar algo de eso!..., bueno en realidad ya habia probado uno pero me gustaria uno que tuviera un scroll para cuando sean muchos resultados y que a su vez al picarle un click fuera desaparecieran los resultados..., asi que todavia estoy en esas!...,

Bueno, el motivo tambien de este mensaje es compartirles esta wiki referente a Ajax! (AjaxPatterns.org)..., y aunque esta en ingles se me hace muy completo ya que explican muchas cosas y vienen muchoooos ejemplos, desde como crear un suggest, herramientas para manipular Ajax o hasta los diferentes Frameworks tanto de lenguajes de programaciòn como de efectos..,

La verdad si estan metidos en este rollo de Ajax, o quieren saber un poquitin más, les recomiendo el wiki de Ajax.

He encontrado un sitio donde nos dice como poner nuestro Completador al estilo de Google Suggest, creo que me quedo por lo pronto con este ya que se ve bonito!. jeje.... el nombre oficial del Framework es: AjaxAC - Open-souce PHP framework for AJAX aqui tienen la versión pirachina jejeje..., se llama GoogleSuggestCloneJax (original el nombre), ya veremos que tan facil es integrarlo a Jaws

Voy a inaugurar la sección de JavaScript con un pequeñin truco para manipular un array asociativo. Para los que conozcan de programación existen 2 tipos de arreglos:

• Indice númerico (solo números para el indice)
• Asociativos (el indice es un caracter alfanumerico)

Ahora bien!, para declarar nuestro arreglo en JavaScript procedemos con la siguiente instrucción:

Hay que recordar que para crear un arreglo (no importa de que tipo), se utiliza la misma instrucción de arriba, claro!! cambiando el nombre MiArreglo por el nombre de tu variable (no olvides agregar var para indicar que inicializas una variable)

Ahora viene lo divertido!, vamos a ponerle datos a nuestro arreglo

Aquí estamos declarando 3 posiciones en nuestro arreglo, las cuales se llaman nombre, apellido y web, en lugar de tener numeros del 0 al 2 (como en los arreglos normales), ahora bien!, para poder sacar un dato es facil, solo hacemos referencia a la posición de nuestro arreglo, por ejemplo si queremos obtener la web solo tenemos que poner:

Con esto nos imprime (alert) la página web, pero que pasa si no conocemos los nombres de los indices de nuestro arreglo??..., para recorrer todo el arreglo utilizamos el ciclo for, pero no el tipico de i=0;icode]

Que hace este ciclo??, primero inicializamos nuestra variable llamada i, y le decimos que recorrar nuestro arreglo (instruccion in), y bueno!!, despues se imprime el valor de nuestro array con la posicion i, que en realidad es el nombre de nuestro indice!..., facil no??...