Foros del Web » Programando para Internet » Javascript »

Problema IE7 y evento onchange

Estas en el tema de Problema IE7 y evento onchange en el foro de Javascript en Foros del Web. Buenas tardes compañeros.. Me encuentro con la siguiente duda / problema.. se trata de un simple select box.. Resulta que cuando he querido probarlo en ...
  #1 (permalink)  
Antiguo 05/08/2012, 07:40
 
Fecha de Ingreso: junio-2012
Ubicación: sabadell
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 6
Problema IE7 y evento onchange

Buenas tardes compañeros..

Me encuentro con la siguiente duda / problema..

se trata de un simple select box..

Resulta que cuando he querido probarlo en IE7 me dice que 'tu tia'..

- En firefox, chrome, opera y safari funciona perfectamente..

Código PHP:
Ver original
  1. // La idea sería más o menos esta..
  2. $puntos = array(0, 1, 2, 3, 4, 5); // valores usados para puntuar el articulo
  3.  
  4. // La puntuación la recupero de la bd, donde despues de calcular la media ponderada, la aplicaria al codigo para comparar con los posibles valores..
  5.  
  6. echo '  <select name="puntuacion" type="text" id="'.$articulo['articulo_id'].'" onchange="ValorarArticulo(this.value,'.$articulo['articulo_id'].',3)">';
  7. echo '   <option value="'.$puntos[0].'"';if($puntos[0]==$puntuacion){echo ' selected';} echo '>0</option>';
  8. echo '   <option value="'.$puntos[1].'"';if($puntos[1]==$puntuacion){echo ' selected';} echo '>1</option>';
  9. echo '   <option value="'.$puntos[2].'"';if($puntos[2]==$puntuacion){echo ' selected';} echo '>2</option>';
  10. echo '   <option value="'.$puntos[3].'"';if($puntos[3]==$puntuacion){echo ' selected';} echo '>3</option>';
  11. echo '   <option value="'.$puntos[4].'"';if($puntos[4]==$puntuacion){echo ' selected';} echo '>4</option>';
  12. echo '   <option value="'.$puntos[5].'"';if($puntos[5]==$puntuacion){echo ' selected';} echo '>5</option>';
  13. echo '  </select>';

Y la funcion ValorarArticulo..
<header>
Código Javascript:
Ver original
  1. function ValorarArticulo(puntuacion, articulo, consulta)
  2.    {
  3.     var xmlhttp;
  4.     if(window.XMLHttpRequest)
  5.      {
  6.       // codigo soportado por IE7+, Firefox, Chrome, Opera, Safari
  7.       xmlhttp=new XMLHttpRequest();
  8.      }
  9.     else
  10.      if(window.ActiveXObject)
  11.       {
  12.        // código soportado por IE6, IE5
  13.        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  14.       }
  15.      else
  16.       {
  17.        alert("Tu navegador no soporta XMLHTTP!");
  18.       }
  19.      
  20.      document.getElementById('tr'+articulo).innerHTML= '<img src="images/anim.gif">';
  21.      eliminarElemento('etiqueta_formulario');
  22.  
  23.      xmlhttp.onreadystatechange=function()
  24.       {
  25.        if(xmlhttp.readyState==4)
  26.         {        document.getElementById('tr'+articulo).innerHTML=xmlhttp.responseText;
  27.         }
  28.       }
  29.      
  30.      xmlhttp.open("GET","procesar_comentario.php?puntuacion="+puntuacion+"&accion="+consulta+"&articulo_id="+articulo,true);
  31.      xmlhttp.send(null);
  32.    }
</header>

Simplemente.. no me carga nada..

¿Porqué? - ¿Alguna idea?

Gracias de antemano!!
__________________
Ante una duda.. ha de mostrarse valor/esfuerzo..
  #2 (permalink)  
Antiguo 05/08/2012, 15:20
Avatar de fjrueda  
Fecha de Ingreso: marzo-2008
Ubicación: Bucaramanga
Mensajes: 313
Antigüedad: 16 años, 1 mes
Puntos: 35
Respuesta: Problema IE7 y evento onchange

Pues yo lo veo bastante bien, depronto sabe que puede ser esto ".$articulo['articulo_id'].", ya que esta repetiendo la comilla simple y pues el IE sirmpre ha dado molestio por ello.

Pruebe otra forma de escaparlo o dejelo fuera igualado a otra variavle y en esa segunda posicion lo que hace es escribir la variable ....

$pos2 = $articulo['articulo_id'];
onchange="ValorarArticulo(this.value,'.$pos2.',3)"

Pruebe asi y me cuenta, si no funciona pues buscamos otra solucion.
  #3 (permalink)  
Antiguo 05/08/2012, 16:40
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 9 meses
Puntos: 1567
Respuesta: Problema IE7 y evento onchange

Se puede saber que significa "tu tia".... cual es el mensaje de error, revisaste la consola?

Por lo pronto, en el tag select no existe el atributo type, usá correctamente el selected selected="selected"
en tu javascript llamás una función
eliminarElemento('etiqueta_formulario');
la cual no veo definida
también aparece
document.getElementById('tr'+articulo).innerHTML
pero no veo definido tampoco ningún elemento cuyo id comience con tr
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #4 (permalink)  
Antiguo 05/08/2012, 19:20
 
Fecha de Ingreso: junio-2012
Ubicación: sabadell
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 6
Respuesta: Problema IE7 y evento onchange

Cita:
Iniciado por emprear Ver Mensaje
Se puede saber que significa "tu tia".... cual es el mensaje de error, revisaste la consola?

Por lo pronto, en el tag select no existe el atributo type, usá correctamente el selected selected="selected"
en tu javascript llamás una función
eliminarElemento('etiqueta_formulario');
la cual no veo definida
también aparece
document.getElementById('tr'+articulo).innerHTML
pero no veo definido tampoco ningún elemento cuyo id comience con tr
lo de la expresion 'tu tia' es eso una expresion cariñosa por np decir no me hace nada de nada...

lo de la funcion eliminarelemento es una funcion aparte que tengo creada.. aqui solo me limite a copiar la parte de codigo que os queria mostrar.. y lo del tr.. pues es un simple id..
ahora estoy en el trabajo, solo queria agradecer las respuestas.. cuando llegue a casa reviso y comento..
gracias muchos!!
__________________
Ante una duda.. ha de mostrarse valor/esfuerzo..
  #5 (permalink)  
Antiguo 05/08/2012, 22:40
 
Fecha de Ingreso: junio-2012
Ubicación: sabadell
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 6
Respuesta: Problema IE7 y evento onchange

fjrueda **. He probado el igualarlo a una varible y nada..

emprear **
- Corregido lo del atributo type para el tag select (a cualquiera se le escapa un pedete)
- El selected está bien definido.. es un integer recuperado de la bd que define en 0 si el usuario no valoró el articulo y se comprende entre 1 y 5 en caso de haber puntuado ya el articulo..

Nota.. Las etiquetas donde recibo la respuesta de ajax, no creí necesario postearlas..

Empezamos de 0 y coloco el código completo menos archivos .php y estilos de la tabla

Estoy trabajando en una tabla, donde recojo los articulo que un usuario de un servicio ha comprado.

Código HTML:
Ver original
  1. <table id="rounded-corner" summary="">
  2.  
  3.  <thead>  
  4.   <tr>  
  5.    <th scope="col" class="rounded-company"></th>  
  6.    <th scope="col" class="rounded">Referencia</th>  
  7.    <th scope="col" class="rounded">Estado</th>  
  8.    <th scope="col" class="rounded">Fecha compra</th>  
  9.    <th scope="col" class="rounded">Importe</th>  
  10.    <th scope="col" class="rounded">Vendedor</th>  
  11.    <th scope="col" class="rounded-q4">Puntuacion</th>
  12.   </tr>
  13.  </thead>
  14.  
  15.  <tfoot>
  16.   <tr>  
  17.    <td colspan="6" class="rounded-foot-left">    
  18.     <em> Agradeceriamos que valorases y comentases tu opinion de los articulos que has adquirido..  </em>  
  19.    </td>  
  20.    <td class="rounded-foot-right">&nbsp;</td>  
  21.   </tr>
  22.  </tfoot>
  23.  
  24.  <tbody>
  25.   <tr>
  26.    <td><input type="checkbox" name="" readonly="readonly" "="" checked="checked" onclick="javascript: return false;"></td>
  27.    <td>1234</td>
  28.    <td>PENDIENTE</td>
  29.    <td>2012-07-25</td>
  30.    <td>10 Euros</td>
  31.    <td><a href="#">Juan Talamera</a></td>
  32.    <td><select name="puntuacion" id="22" onchange="ValorarArticulo(this.value,22,3)">  
  33.             <option value="0">0</option>  
  34.             <option value="1" selected="">1</option>  
  35.             <option value="2">2</option>  
  36.             <option value="3">3</option>  
  37.             <option value="4">4</option>  
  38.             <option value="5">5</option>  
  39.           </select></td>
  40.   </tr>
  41.  
  42.   <tr id="tr22"></tr>
  43.  
  44.  </tbody>
  45.  

Bien.. se trata de una tabla dinámica que genero con php obteniendo la información de una base de datos..

Por cada articulo comprado, genero 2 filas <tr> en el body de la tabla, una general con la información y otra en blanco que tiene como agregado el numero del articulo al que nos refererimos(en este caso es el articulo 22 => tr22), que me servirá para mostrar datos vía ajax en su interior (si fuese necesario)..

Dicho esto y ya entrando de lleno en javascript he creado los siguientes scripts.. (incluidos en el header)

Código Javascript:
Ver original
  1. function ValorarArticulo(puntuacion, articulo, consulta)
  2.   {
  3.     // puntuacion, es un numero dado por el select comprendido entre 0 y 5
  4.    // articulo, identificador del producto al que nos referimos, obtenido desde la bd
  5.    // consulta, valor integer que define un proceso a seguir dentro de un archivo php
  6.     var xmlhttp;
  7.     if(window.XMLHttpRequest)
  8.      {
  9.       // codigo soportado por IE7+, Firefox, Chrome, Opera, Safari
  10.       xmlhttp=new XMLHttpRequest();
  11.      }
  12.     else
  13.      if(window.ActiveXObject)
  14.       {
  15.        // código soportado por IE6, IE5
  16.        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  17.       }
  18.      else
  19.       {
  20.        alert("Tu navegador no soporta XMLHTTP!");
  21.       }
  22.      
  23.       document.getElementById('tr'+articulo).innerHTML= '<img src="images/anim.gif">'; // lugar generado en la tabla donde mostrar la info
  24.       eliminarElemento('etiqueta_formulario'); // Eliminare esta etiqueta si la encuentra..
  25.  
  26.      xmlhttp.onreadystatechange=function()
  27.       {
  28.        if(xmlhttp.readyState==4)
  29.         {
  30.       document.getElementById('tr'+articulo).innerHTML=xmlhttp.responseText; // lugar generado en la tabla donde mostrar la info
  31.         }
  32.       }  
  33.      xmlhttp.open("GET","procesar_comentario.php?puntuacion="+puntuacion+"&accion="+consulta+"&articulo_id="+articulo,true);
  34.      xmlhttp.send(null);
  35.    }
  36.  
  37.   function eliminarElemento(id)
  38.    {
  39.     div = document.getElementById(id);
  40.     if(div)
  41.     {
  42.       padre = div.parentNode;
  43.       padre.removeChild(div);
  44.     }
  45.   }

Ahora, al seleccionar un numero (el 3 por ejemplo), del select box de la tabla, en este caso el select box que hace referencia al articulo 22, debería de cargarme la información que le envió a la etiqueta <tr22>..
Donde por ejemplo me cargaría algo así como:

<tr22>
Código HTML:
Ver original
  1. <td colspan="7" id="etiqueta_formulario">
  2.  <div style="background:url(images/panel/notificaciones/responder.png) no-repeat 12px 8px;  padding-left: 47px;">  
  3.   <form name="respuestaComentario" action="">   // No pretendo extenderme en detalles.. este formulario lo proceso en ajax
  4.    <input type="hidden" name="articulo_id" value="22">  
  5.    <input type="hidden" name="puntuacion" value="3">  
  6.    <input type="hidden" name="accion" value="2">  
  7.    <textarea  name="texto" cols="78"></textarea>    
  8.   </form>
  9.  </div>
  10. </td>
</tr>

Como podeis ver, cada vez que hago una selección de algún número de cualquier selectbox, lo primero que hace es eliminar la etiqueta, si existe, 'etiqueta_formulario', y seguidamente, cargarme el nuevo contenido solicitado en el 'tr' correspondiente, una vez más y en este ejemplo, seria 'tr22'

El problema sigue siendo el mismo, en firefox, chrome, opera y safari funciona perfectamente.. en explorer directamente no hace nada de nada..

Este ejemplo en concreto forma parte de un panel de usuario que estoy desarrollando completamente en AJAX, y cuando intento ver la información de algún error de alguna etiqueta, en la consola de errores de ie no aprecio el origen, vamos, por lo pronto me define que si hay un error, en la linea 'tal' pero no se aprecia donde, solo el código fuente original sin los contenidos cargados atreves de ajax en las etiquetas..

Gracias de nuevo muchachos!!
__________________
Ante una duda.. ha de mostrarse valor/esfuerzo..

Última edición por dannelblogger; 05/08/2012 a las 22:54
  #6 (permalink)  
Antiguo 06/08/2012, 09:03
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 9 meses
Puntos: 1567
Respuesta: Problema IE7 y evento onchange

El problema principal lo tenés porque IE no soporta hacer innerHTML a un tag tr, tendrías que hacerlo en la celda
Código HTML:
Ver original
  1. <tr><td id="tr22"></td></tr>

Además tu html no está bien generado
ej:

<td><input type="checkbox" name="" readonly="readonly" "="" checked="checked" onclick="javascript: return false;"></td>



y los id no deberían ser un valor numérico ni comenzar por uno

ej:
<select name="puntuacion" id="22" onchange="ValorarArticulo(this.value,22,3)">

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #7 (permalink)  
Antiguo 06/08/2012, 09:36
 
Fecha de Ingreso: junio-2012
Ubicación: sabadell
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 6
Respuesta: Problema IE7 y evento onchange

emprear **. Muchas gracias por responder..
- Si, el tema del checkbox si ke di cuenta que estaba mal generado.
- lo del id numerico, no la sabia.
- ' IE no soporta hacer innerHTML a un tag tr'.. ni idea.. al funcionarme en el resto de navegadores creo que jamas se me hubiese ocurrido pensar en este error..

Muchas gracias por la respuesta.. ahora mismo mirare de solucionarlo y comento..
__________________
Ante una duda.. ha de mostrarse valor/esfuerzo..
  #8 (permalink)  
Antiguo 06/08/2012, 12:35
 
Fecha de Ingreso: junio-2012
Ubicación: sabadell
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 6
Respuesta: Problema IE7 y evento onchange

Cita:
Iniciado por emprear Ver Mensaje
El problema principal lo tenés porque IE no soporta hacer innerHTML a un tag tr, tendrías que hacerlo en la celda
Código HTML:
Ver original
  1. <tr><td id="tr22"></td></tr>
Efectivamente, este ha sido el origen del problema!
Muchísimas gracias!!
__________________
Ante una duda.. ha de mostrarse valor/esfuerzo..

Etiquetas: ie7, onchange
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:41.