Problemas con boton creado mediante dom y problemas I.E. - M.F.

midas84 · #1 (**permalink**) 02/04/2009, 16:33

Hola a todos soy nuevo en ajax, estoy intentando mostrar mediante ajax una tabla en php el problema que tube en realidad fueron 2 pero el mas importante es que...

Este codigo lo que hace es consultar a la base de datos primero para ver si es que el usuario que pone su contraseña es quien dice ser.... el famoso por favor vuelva a introducir su contraseña por seguridad y luego de eso carga una tabla con la bitacora que almaceno en una bd postgres con un menu que sirve para manejar los resultados.

1.- Lo programe probandolo en firefox pero cuando se me ocurrio probarlo en explorer como supondran no funcionaba, haciendo un seguimiento del codigo vi que el error aparece en la linea que destaco de todo este codigo:

Código:

xml3 = conexion3.responseXML;
cant=xml3.getElementsByTagName();
cantidad= cant.firstChild.nodeValue;

sin esa linea funciona, bueno aparece todo el esqueleto que deberia aparecer, obvio que el dato que necesito ahi lo remplace por un valor cualquiera digamos cantidad=100; llega a ejecutarse como deberia.

El segundo problema que tengo es algo mas complicado por que llega a funcionar algún momento en firefox, pero en explorer jamas osea que es muy irregular el funcionamiento en ambos navegadores, el problema es que mediante codigo creo un menu, con 3 selects, donde se selecciona el orden que debe seguir una tabla de bd para ser mostrada, por ejemplo que este ordenada ascendentemente o desendentemente por algun atributo, entonces al momento de crear el boton le asigno un evento que cuando haga click obvio haga la consulta y cree la tabla con los resultados, ahi es el problema cuando le asigno el evento de ejecutar una funcion no se crea el boton, por algun error que desconosco la linea es esta.

Código:

bot= document.createElement('button');
addEvent(bot, 'click',hola,false);
elmTD.appendChild(bot);

lo extraño de esa linea es que por ejemplo con esa funcion hola que esta funciona bien, pero cuando le pongo la funcion correcta que este caso es mirar. No se crea el boton...
ojala que alguien pueda darme una ayudita ahora les paso el codigo completo, que esta con algunas paginas de conexion a bd postgres.

este es el JS

Espero puedan ayudarme, gracias de antemano, Chau.

midas84 · #2 (**permalink**) 02/04/2009, 16:35

Código:

	addEvent(window,'load',inicializarEventos,false);
var ps;
var codigo=document.getElementById('validacion');
var df=1;
var conexion1;
var conexion2;
var conexion3;
	function inicializarEventos(){
	var boton=document.getElementById('accion');
	var ed=document.getElementById('ps')	
		addEvent(boton,'click',clave,false);
	}
	function ac(){
		clave();
		return false;
	}
	function clave(e){
		ps=	document.getElementById('ps');
		us=	document.getElementById('us');
	var nuevotexto=document.getElementById('res');
		if ((ps.value!="")&&(us.value!=""))
		{
  			nuevotexto.innerHTML="";
    		conexion1=crearXMLHttpRequest();
    		conexion1.onreadystatechange = VerPs;
    		conexion1.open('GET','bitacora/ps.php?ps='+ps.value+'&us='+us.value, true);
    		conexion1.send(null);
		}
  		else
  		{
    		nuevotexto.innerHTML="<p>Introdusca su contraseña</p>";
  		}	
	}
	function menu(){
	xml3 = conexion3.responseXML;
    var cant=xml3.getElementsByTagName('cant');
    cantidad= cant[0].firstChild.nodeValue;
	//cantidad=100;
	var men=document.getElementById('men');
		tabla = document.createElement('table');
		//tabla.setAttribute('id','m');
		men.appendChild(tabla);
		elmTBODY= document.createElement('tbody');
		tabla.appendChild(elmTBODY);
		elmTR =document.createElement('tr');
    	elmTBODY.appendChild(elmTR);	 
    	elmTD = document.createElement('th');
		elmTR.appendChild(elmTD);
		elmText = document.createTextNode("Ordenar Por:");
		elmTD.appendChild(elmText);
		elmTD = document.createElement('th');
		elmTR.appendChild(elmTD);
		elmText = document.createTextNode("Orden:");
		elmTD.appendChild(elmText);
		elmTD = document.createElement('th');
		elmTR.appendChild(elmTD);
		elmText = document.createTextNode("Página:");
		elmTD.appendChild(elmText);

		elmTR =document.createElement('tr');
    	elmTBODY.appendChild(elmTR);		
		elmTD = document.createElement('td');
		elmTR.appendChild(elmTD);
		selec= document.createElement('select');
		//selec.setAttribute('id','ordenar');
    	opt= document.createElement('option');
    	elmText = document.createTextNode("IdUsuario");
    	opt.appendChild(elmText);
    	selec.appendChild(opt);
    	opt= document.createElement('option');
    	elmText = document.createTextNode("FechaHoraRegistro");
    	opt.appendChild(elmText);
    	selec.appendChild(opt);
    	opt= document.createElement('option');
    	elmText = document.createTextNode("Accion");
    	opt.appendChild(elmText);
    	selec.appendChild(opt);
    	elmTD.appendChild(selec); 
    	
    	
    	elmTD = document.createElement('td');
		elmTR.appendChild(elmTD);
		selec= document.createElement('select');
		//selec.setAttribute('id','orden');
    	opt= document.createElement('option');
    	elmText = document.createTextNode("Ascendente (^)");
    	opt.appendChild(elmText);
    	selec.appendChild(opt);
    	opt= document.createElement('option');
    	elmText = document.createTextNode("Descendente(v)");
    	opt.appendChild(elmText);
    	selec.appendChild(opt);
    	elmTD.appendChild(selec);
		
		                                                      
			 
    	elmTD = document.createElement('td');
		elmTR.appendChild(elmTD);
		selec= document.createElement('select');
		//selec.setAttribute('id','pag');
		elmTD.appendChild(selec);
    		 
		for (var i=0; i<(cantidad/20); i++){
			opt= document.createElement('option');
    		selec.appendChild(opt);
			elmText = document.createTextNode(i);
    		opt.appendChild(elmText);
    		
    	}
		//elmTD = document.createElement('td');
		//elmTR.appendChild(elmTD);
		//bot= document.createElement('button');
		//bot.action=false;
		//codigo.appendChild(bot);
		//addEvent(bot,'click',hola,false);
		//elmTD.appendChild(bot);
		//setAttribute('value','hola');
		//addEvent(bot,'click',hola,false);
		
	}
		
	function VerPs(){
	var xml = conexion1.responseXML;
	var pals=xml.getElementsByTagName('resp');
    	if (pals[0].firstChild.nodeValue=='si'){
    		if (df==1){
				df=2;
				//menu();
				conexion3=crearXMLHttpRequest();
    			conexion3.onreadystatechange = menu;//generar menu
    			conexion3.open('GET','bitacora/pag.php', true);  //llamada paginación
    			conexion3.send(null);
				                             
			}
			mirar();
    	var nuevotexto=document.getElementById('res');
			nuevotexto.innerHTML="Contraseña correcta|"+pals[0].firstChild.nodeValue;
		
		
		}
    	else{
		var nuevotexto=document.getElementById('res');
			nuevotexto.innerHTML="Contraseña incorrecta|"+pals[0].firstChild.nodeValue;
			
		} 
	}
	function mirar(){
		conexion2=crearXMLHttpRequest();
    		conexion2.onreadystatechange = mostrar;
    		conexion2.open('GET','bitacora/lista.php?ord=desc&nom=idusuario&pag=3&func=1', true);
    		conexion2.send(null);
	}
	function mostrar(){
	var xml1 = conexion2.responseXML;
    var no=xml1.getElementsByTagName('no');
    var fecha=xml1.getElementsByTagName('fecha');
    var id=xml1.getElementsByTagName('id');
    var accion=xml1.getElementsByTagName('accion');
	codigo=document.getElementById('validacion');
		while (codigo.childNodes.length>0) {
			codigo.removeChild(codigo.childNodes[0]);
		}	
 		tabla = document.createElement('table');
		codigo.appendChild(tabla);
		elmTBODY= document.createElement('tbody');
		tabla.appendChild(elmTBODY);
		elmTR =document.createElement('tr');
    	elmTBODY.appendChild(elmTR);
    	
    		elmTD = document.createElement('th');
			elmTR.appendChild(elmTD);
			elmText = document.createTextNode(no[0].firstChild.nodeValue);
			elmTD.appendChild(elmText);	
				elmTD = document.createElement('td');
				elmTR.appendChild(elmTD);
			elmTD = document.createElement('th');
			elmTR.appendChild(elmTD);
			elmText = document.createTextNode(fecha[0].firstChild.nodeValue);
			elmTD.appendChild(elmText);
				elmTD = document.createElement('td');
				elmTR.appendChild(elmTD);
			elmTD = document.createElement('th');
			elmTR.appendChild(elmTD);
			elmText = document.createTextNode(id[0].firstChild.nodeValue);
			elmTD.appendChild(elmText);
			 	elmTD = document.createElement('td');
				elmTR.appendChild(elmTD);
			elmTD = document.createElement('th');
			elmTR.appendChild(elmTD);
			elmText = document.createTextNode(accion[0].firstChild.nodeValue);
			elmTD.appendChild(elmText);
		
		for (var i=1; i<no.length; i++){//genera tabla
			elmTR =document.createElement('tr');
    		elmTBODY.appendChild(elmTR);
    	
    		elmTD = document.createElement('td');
			elmTR.appendChild(elmTD);
			elmText = document.createTextNode(no[i].firstChild.nodeValue);
			elmTD.appendChild(elmText);
				elmTD = document.createElement('td');
				elmTR.appendChild(elmTD);	
			elmTD = document.createElement('td');
			elmTR.appendChild(elmTD);
			elmText = document.createTextNode(fecha[i].firstChild.nodeValue);
			elmTD.appendChild(elmText);
				elmTD = document.createElement('td');
				elmTR.appendChild(elmTD);
			elmTD = document.createElement('td');
			elmTR.appendChild(elmTD);
			elmText = document.createTextNode(id[i].firstChild.nodeValue);
			elmTD.appendChild(elmText);
				elmTD = document.createElement('td');
				elmTR.appendChild(elmTD);
			elmTD = document.createElement('td');
			elmTR.appendChild(elmTD);
			elmText = document.createTextNode(accion[i].firstChild.nodeValue);
			elmTD.appendChild(elmText);
		
		} 
	}

//***************************************
//Funciones comunes a todos los problemas
//***************************************
function addEvent(elemento,nomevento,funcion,captura)
{
  if (elemento.attachEvent)
  {
    elemento.attachEvent('on'+nomevento,funcion);
    return true;
  }
  else  
    if (elemento.addEventListener)
    {
      elemento.addEventListener(nomevento,funcion,captura);
      return true;
    }
    else
      return false;
}

function crearXMLHttpRequest() 
{
  var xmlHttp=null;
  if (window.ActiveXObject) 
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  else 
    if (window.XMLHttpRequest) 
      xmlHttp = new XMLHttpRequest();
  return xmlHttp;
}

midas84 · #3 (**permalink**) 02/04/2009, 16:36

y este es el php

Código PHP:

  <?php

echo '

<script language="JavaScript" src="bitacora/func.js" type="text/javascript"></script>

<table width="600" id="centro" ><tr><td><center><fieldset id="f1"><div id="men"></div><form  id="validacion" onSubmit="return ac();"><table>

    

        <tr ><td rowspan=4><center>Validación Obligatoria<br>Volver a introducir contraseña</center></td></tr>

        

        <tr><td ><center><input name="pass"  type="password" id="ps" /></center>

        <input id="us" type="hidden" value="'.$_SESSION['login'].'"></td></tr>

        

        <tr><td align="right"><input type="button" id="accion" value="Ingresar" /></td></tr>

        

        <tr><td><div id="res"></div></td></tr>

    

        </table></form></fieldset></center></td></tr></table>';

?>

midas84 · #4 (**permalink**) 04/04/2009, 06:12

Hola no hay alguien que me pueda dar na ayudita?

midas84 · #5 (**permalink**) 05/04/2009, 14:19

Hola ya resolvi el segundo problema de una manera un tanto rustica, como les dije con esa funcion hola se lograba crear el boton, entonces lo deje con esa funcion hola y dentro mando a ejecutar la funcion que queria, todo cool, el primer problema sigue sin resolverse cuando recibo el xml de respuesta y le intento sacar sus datos no llega a funcionar.

Ahora se agrego otro problema, como ven creo 3 selects lo que quiero hacer es sacar un dato de cada uno (el que este seleccionado) y mandarlos a consulta con la base de datos para devolver la tabla, lo logre hacer en firefox, obvio todo funciona bien con firefox, pero en Internet Explorer que es mi mayor dolor de cabeza no funciona, el codigo que utilice para sacar los valores del select es este

Código:

d=document.getElementsByTagName('select');
a=d[0].value;
b=d[1].value;
c=d[2].value;

este si funciono bastante bien en firefox, como tendria que hacerlo para IE
talves seria bueno recoger los selects dandole un id propio a cada uno, pero la verdad no pude hacerlo por que cuando lo hice me aparecio errores en la creacion de los selects (no se llegaban a crear).
El codigo que utilice para eso es este:

Código:

selec.setAttribute('id','pag');

donde selec era el select creado
Luego de eso tengo un problema con xml, pero eso creo que lo preguntare por halla, muchas gracias si alguien pudiera ayudarme, nos vemos