OK me explico. Estamos desarrollando con AJAX, hice una aplicación que dependiendo de cada pestaña abre una instancia de AJAX diferente. En cada pestaña se hace el llamado de 3 AJAX uno para un formulario y otro para un reporte. Hasta allí todo bien!!!
Luego que tenia eso listo me puse a investigar sobre las validaciones y consegui validation que utiliza prototype. Hice un ejemplo y luego se lo coloque al mi formulario inicial de login(que no usa AJAX) y todo bien. Pero cuando lo trate de usarlas en el código que es llamado por un AJAX no me funciona.
¿Que podrá ser?
Nota: Si desde el archivo index.php hago un include del archivo formularioB2.php si me funciona, pero si lo instacio desde AJAX, es que no me funciona
index.php
Código PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"lang="es" xml:lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CCNPG - SIREPP</title>
<link href="css/estilos.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/javascript" charset="iso-8859-1" src="js/prototype.js"></script>
<script language="JavaScript" type="text/javascript" charset="iso-8859-1" src="js/validation.js"></script>
<script language="JavaScript" type="text/javascript" charset="iso-8859-1" src="ajax/ajax1.js"></script>
</head>
<body>
<table align="center" class="tb_fondo">
<tr>
<td colspan="2" bgcolor="#FFFFFF">
<table width="100%" align="center" border="0" cellspacing="3" cellpadding="0">
<tr>
<td><img src="img/ImagenGraficaIzq.png" alt=" Logo Gobierno Bolivariano de Venezuela MPPES"></td>
<td align="right"><img src="img/ImagenGraficaDer.png" alt="Logo Venezuela ahora es de todos"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2" height="5" bgcolor="#FF0000"></td>
</tr>
<tr>
<td colspan="2">
<table wiht="100%">
<tr>
<td width="54"><img src="img/logoCNU.png" alt="Logo CNU" title="Consejo Nacional de Universidades" ></td>
<td width="140" class="titulos">Consejo Nacional<br>de Universidades</td>
<td width="85"><img src="img/logoCCNPG.png" alt="Logo CCNPG" title="Consejo Consultivo Nacional de Postgrado" ></td>
<td width="170" class="titulos"> Consejo Consultivo <br>Nacional de Postgrado</td>
<td> </td>
<td width="100"> </td>
</tr>
</table>
</td>
</tr>
<tr bgcolor="FFFFFF" >
<td colspan="2" height="20" align="center" valign="center" >
<SPAN class="titulos"> SISTEMA DE REGISTRO DE PROGRAMAS DE POSTGRADO</span>
</td>
</tr>
<tr>
<td colspan="2">
<div id="divPrograma" >
Datos del programa
</div>
</td>
</tr>
<tr>
<td valign="top" height="180">
<div id="menu">
<a id="enlaceB" href="#" class="letra_menu">Planta Profesoral</a>
<a id="enlaceC" href="#" class="letra_menu">Prod. Científica</a>
<a id="enlaceD" href="#" class="letra_menu">Convenios</a>
<a id="enlaceE" href="#" class="letra_menu">Líneas de Inv.</a>
<a id="enlaceF" href="#" class="letra_menu">Proyectos</a>
<a id="enlaceG" href="#" class="letra_menu">Resumen</a>
<a id="salir" href="salir.php" class="letra_menu">Cerrar Sesión</a>
</div>
</td>
<td rowspan="2" valign="top" >
<div id="contenidos" class="conteni2">Div formulario
</div>
<div id="resultados">Div resultados</div>
<div id="reporte">Div reporte</div>
</td>
</tr>
<tr>
<td valign="top"><span class="letra_subFooter">Ccs / Venezuela - Consejo Consultivo Nacional de Postgrado - Copyright © 2010</span></td>
<td></td>
</tr>
</table>
</body>
</html>
Código:
formularioB2.phpaddEvent(window,'load',inicializarEventos,false); function inicializarEventos() { // Asignamos el evento Onclick al boton1 var $ob1=document.getElementById('enlaceB'); addEvent($ob1,'click',presionBotonB,false); presionBotonB(); } //Funciones Presionaron un Boton--------------------------------------------- function presionBotonB(B) { cargarFormulario('php/formularioB2.php') ; } // funciones varias ---------------------------------------------------------------------- function mostrarDiv($Div){ var $IdDiv = document.getElementById($Div); $IdDiv.style.display=''; } // session de ajax ------------------------------------------------------- var $conexion1;//La variable es global para los manejos de eventos function cargarFormulario(url) { if(url=='') { return; } $conexion1=crearXMLHttpRequest(); $conexion1.onreadystatechange = procesarEventosContenidos; $conexion1.open("GET", url, true); $conexion1.send(null); mostrarDiv("contenidos");// muestra div por si esta oculto } function procesarEventosContenidos() { var $IdContenidos = document.getElementById("contenidos"); if($conexion1.readyState == 4) { if($conexion1.status==200) { $IdContenidos.innerHTML = $conexion1.responseText; }else if($conexion1.status==404){ $IdContenidos.innerHTML = 'La direccion no existe'; }else { $IdContenidos.innerHTML = 'Error: '.$conexion1.status; } } else { $IdContenidos.innerHTML ='<img src="/MI3/img/cargando.gif" alt="Cargando..." >'; } } //*************************************** //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; }
Código PHP:
<form name="formularioB" id="formularioB" action="#">
<table align="center">
<tr>
<td colspan="2" align="center">
<h5 id="titulos" class="titulo_detalle">
Planta Profesoral Adscrita al Doctorado
</h5>
<br>
</td>
</tr>
<tr>
<td>
<div class="letra_peq_det">
<label for="nombre">Nombres:</label>
</div>
</td>
<td>
<input type="text" name="nombre" id="nombre" class="required validate-alphanum" maxlength="50" title="Ingrese los nombres" />
<span class="letra_validar">*</span>
</td>
</tr>
<tr>
<td>
<div class="letra_peq_det">
<label for="usuario">Apellidos:</label>
</div>
<td>
<input type="text" name="apellido" id="apellido" class="required validate-alphanum" maxlength="50" title="Ingrese apellidos" />
</td>
<td>
</td>
</tr>
<tr>
<td class="letra_peq_det">
Cédula de identidad:
</td>
<td>
<input type="text" id="cedula" name="cedula" maxlength="10" class="campo_cedula">
<span class="letra_validar">*</span>
</td>
</tr>
<tr>
<td class="letra_peq_det">
Grado académico:
</td>
<td>
<?php
include('../cls/cls_conexiones.php');
$cn = new cls_conexion();
$cn->query = "SELECT id_grado as grado,nombre FROM grado_otorga";
$result = $cn->ejecutar();
$combo="<select id='id_grado' name='id_grado' SIZE=1 class='campo_form_lista'>\n<option value=0 selected>Seleccione</option>";
while($resultado = $cn->consultar())
{
$combo.="\n<option value='".$resultado[0]."'>".$resultado[1]."</option>";
}
$combo.="\n</select>";
echo $combo;
$cn->close();
?>
</td>
</tr>
<tr>
<td class="letra_peq_det">
Escalafón:
</td>
<td>
<?php
$cn->query = "SELECT id_escalafon as escalafon,nombre FROM escalafon";
$result = $cn->ejecutar();
$combo="<select id='id_escalafon' name='id_escalafon' SIZE=1 class='campo_form_lista'>\n<option value=0 selected>Seleccione</option>";
while($resultado = $cn->consultar())
{
$combo.="\n<option value='".$resultado[0]."'>".$resultado[1]."</option>";
}
$combo.="\n</select>";
echo $combo;
$cn->close();
?>
</td>
</tr>
<tr>
<td colspan="2" height="40" align="center" valign="bottom">
<input type="submit" id="agregar" name="agregar" value="Agregar" alt="Agregar" ACCESSKEY="enter">
<a id="siguientC" class="enlace" href="#" ><img src="img/Siguiente.gif" border="0" alt="Siguiente"></a>
</td>
</tr>
</table>
</form><p class="letra_validar">* Campos obligatorios</p>
<script type="text/javascript">
function formCallback(result, form) {
window.status = "valiation callback for form '" + form.id + "': result = " + result;
}
var valid = new Validation('formularioB', {immediate : true, onFormValidate : formCallback});
</script>