Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Problema con los Div en Ajax

Estas en el tema de Problema con los Div en Ajax en el foro de Frameworks JS en Foros del Web. Hola, recurro a ustedes ya que he buscado y no he podido encontrar nada con respecto a mi pregunta. Les comento mi problema: Resulta que ...
  #1 (permalink)  
Antiguo 15/06/2011, 08:09
 
Fecha de Ingreso: abril-2009
Mensajes: 6
Antigüedad: 11 años, 6 meses
Puntos: 0
Pregunta Problema con los Div en Ajax

Hola, recurro a ustedes ya que he buscado y no he podido encontrar nada con respecto a mi pregunta.

Les comento mi problema:

Resulta que estoy realizando una función que me cargue un combo dependiendo de otro, por ejemplo dependiendo el área seleccionada, me cargue el curso correspondiente a esa área, hasta ahí todo bien. El problema es que los campos son dinámicos, es decir que el select o combo del área puede estar una o N veces en la pagina al igual que los div donde me carga el curso, yo le pongo un id a este div, lo que pasa es que cuando son más de una, este id se repite y esto no puede ser ya que los id son únicos.

Bien como esta medio enredado este asunto, lo grafico de la siguiente manera.
- Puedo agregar o quitar filas a través de una función javascript, presionando sobre la imagen con signo más y con signo menos.

[URL=http://imageshack.us/photo/my-images/706/dinamico.png/][IMG]http://img706.imageshack.us/img706/4985/dinamico.png[/IMG][/URL]

- Este script lo que hace es copiarme el primer <tr> de la tabla y copiarlo una vez por cada click sobre la imagen.

- Es por esto que me duplica el id del div.
- Este es el <tr> que se copia N veces.
Código PHP:
<tr id="example" class="selection">
   <
td height="25px" align="center">
        <
select name="cbxArea[]" class="select" onchange="recuperaMuestraActividadDinamic(this);">
             <
option value="0" selected="selected">Seleccione...</option>
             <
option value="1">Area 1</option>
             <
option value="2">Area 2</option>
        </
select>
   </
td>
   <
td align="center">
        <
div id="idDivMuestraCurso">
             <
select name="cbxCurso[]" class="select">
                  <
option value="0" selected="selected">Seleccione...</option>
             </
select>
        </
div>
   </
td>
</
tr
Los nombre de los campos están como array porque estoy trabajando con PHP y de esta manera los puedo recibir por post.

en fin.
El ID del DIV es "idDivMuestraCurso".
Y llamo a la función ajax así: onchange="recuperaMuestraCurso(this);"

En el archivo .js los recibo así:
Código PHP:
function recuperaMuestraCurso(elemento){
    var 
idArea=elemento;
    
idArea=idArea.options[idArea.selectedIndex].value;
    
strURL="../ajaxMuestraCurso.php?id="+idArea;
    
ajaxReturnMuestraCurso(strURL);
}

function 
ajaxReturnMuestraCurso(strUrl){
    var 
xmlHttp;
    try  {
        
xmlHttp=new XMLHttpRequest();
    }
    catch (
e) {
          try  {
            
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
          }
          catch (
e) {
            try {
                
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (
e) {
                
alert("Your browser does not support AJAX!");
                return 
false;
            }
          }
    }
    
xmlHttp.onreadystatechange=function() {
        if(
xmlHttp.readyState<=3){
            
document.getElementById('idDivMuestraCurso').innerHTML "<select name='cbxCurso[]' disabled='disabled' class='select' style='width:280px'><option value='0'>Cargando...</option></select>";
        }
        if(
xmlHttp.readyState==4){
            if(
xmlHttp.status==200){
                
ajaxResultMuestraCurso(xmlHttp.responseText);
            }else{
                
document.getElementById('idDivMuestraCurso').innerHTML "<select name='cbxCurso[]' disabled='disabled' class='select' style='width:280px'><option value='0'>Error... Por Favor Intente Nuevamente</option></select>";
            }
        }
    }
    
xmlHttp.open("POST",strUrl,true);
    
xmlHttp.send(null);
}

function 
ajaxResultMuestraCurso(consulta){
    var 
idDivMuestraCurso=document.getElementById('idDivMuestraCurso');
    
idDivMuestraCurso.innerHTML=consulta;    

En la función me recibe bien el valor del combo del select del area que yo selecciono, pero al mostrar el resultado siempre me lo muestra en el primer select del curso. y yo quiero que se me muestre al lado, sin afectar a los otros.

Ojala se entienda mi problema y puedan ayudarme.

Desde ya muchas gracias amigos.

Última edición por jhon_nos; 15/06/2011 a las 08:18

Etiquetas: ajax
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 06:06.