sucede que tengo una pagina html que deseo que envie una solicitud via AJAX a un servidor PHP y deseo q los datos XML devueltos por el servidor PHP sean tratados via XSL (esto lo quiero en el lado del cliente). El tema es que el servidor me esta respondiendo bien con el XML pero no veo nada en la pagina:
La pagina HTML
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link href="libreria/css/maqueta_tel.css" rel="stylesheet" type="text/css" /> <script language="javascript" type="text/javascript" src="libreria/js/Telefonia.js"></script> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Documento sin título</title> </head> <body background="libreria/imagen/fondo.gif"> <form id="form_respta" action="" method="" enctype="multipart/form-data" target="_blank"> <div id="container"> <div id="principal" class="principal"> <div id="datpers" class="datpers"> <div id="datacli" class="datacli"> </div> <div id="datacli_btn" class="datacli_btn"> <input id="busCliente" class="myButton" name="busCliente" type="button" value="Buscar Cliente" onclick="buscar(this,'CL001','METFULL','gerardo');"/> </div> </div> </div> </div> </form> </body> </html>
Código:
// almacena la referencia al objeto XMLHttpRequest
var xmlHttp = createXmlHttpRequestObject();
// el nombre del archivo XSLT
var xsltFileUrl = "grid.xsl";
// el archivo que devuelve los datos pedidos en formato XML
var pagPhp = "libreria/php/cTelefonia/telefonia.php";
// el id del div de la parrilla
var gridDivId = "gridDiv";
// el div de la parrilla de status
var statusDivId = "statusDiv";
// almacena temporalmente los datos de las filas
var tempRow;
// la ID del producto que está siendo editado
var editableId = null;
// el documento XSLT
var stylesheetDoc;
// Envio peticion de busqueda
function buscar(obj,agencia, campana, usuario)
{
// cadenaFormulario
var cadenaFormulario = "";
// Nombre del objeto solicitante;
var nomObjeto = obj.name;
// La cadenaFormulario se añade el nombre del objeto.
cadenaFormulario += 'obj='+nomObjeto;
// La cadenaFormulario se añade la agencia.
cadenaFormulario += '&agencia='+agencia;
// La cadenaFormulario se añade la campaña.
cadenaFormulario += '&campana='+campana;
// La cadenaFormulario se añade el usuario.
cadenaFormulario += '&usuario='+usuario;
// carga la parrilla
loadStylesheet("libreria/xsl/telCliente.xsl");
// almacena la referencia al objeto XMLHttpRequest
xmlhttp = null;
// deshabilita el modo edición cuando carga una nueva página
editableId = false;
//continúa sólo si el objeto XMLHttpRequest no está ocupado
if (xmlHttp && (xmlHttp.readyState == 4 || xmlHttp.readyState == 0)) {
var query = pagPhp;
xmlHttp.open("POST", query, true);
xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=ISO-8859-1');
if (nomObjeto == 'BusCliente'){
xmlHttp.onreadystatechange = handleLoadCliente;
}
xmlHttp.send(cadenaFormulario);
}
}
// Manejador de la peticion
function handleLoadCliente () {
// cuando readyState is 4, leemos la respuesta del servidor
if (xmlHttp.readyState == 4) {
// continúa sólo si el estatus HTTP es "OK"
if (xmlHttp.status == 200) {
// lee la respuesta
response = xmlHttp.responseText;
// ¿error del servidor?
if (response.indexOf("ERRNO") >= 0 || response.indexOf("error") >= 0 || response.length == 0) {
// muestra mensaje de error
alert("hola");
alert(response.length == 0 ? "Server serror." : response);
// sale de la función
return;
}
// respuesta del servidor en formato XML
xmlResponse = xmlHttp.responseXML;
var gridDiv = document.getElementById("datacli");
gridDiv.innerHTML = xmlResponse;
// ¿navegador con funcionalidad nativa?
if (window.XMLHttpRequest && window.XSLTProcessor && window.DOMParser) {
// carga el documetno XSLT
var xsltProcessor = new XSLTProcessor();
xsltProcessor.importStylesheet(stylesheetDoc);
// genera el código HTML para la nueva página de productos
page = xsltProcessor.transformToFragment(xmlResponse, document);
// muestra la página de productos
var gridDiv = document.getElementById("datacli");
gridDiv.innerHTML = "";
gridDiv.appendChild(page);
}
// código Internet Explorer
else if (window.ActiveXObject) {
// carga el documento XSLT
var theDocument = createMsxml2DOMDocumentObject();
theDocument.async = false;
theDocument.load(xmlResponse);
// muestra la página de productos
var gridDiv = document.getElementById("datacli");
gridDiv.innerHTML = "";
gridDiv.innerHTML = theDocument.transformNode(stylesheetDoc);
}
}
else
{
alert("Error leyendo respuesta del servidor.");
}
}
}
function loadStylesheet(hojaEstilo)
{
var xmlHttp = createXmlHttpRequestObject();
// carga el archivo desde el servidor
xmlHttp.open("GET", hojaEstilo, false);
xmlHttp.send(null);
// intenta cargar el documento XSLT
if (this.DOMParser) // navega con funcionalidad nativa
{
var dp = new DOMParser();
stylesheetDoc = dp.parseFromString(xmlHttp.responseText, "text/xml");
}
else if (window.ActiveXObject) // ¿Internet Explorer?
{
stylesheetDoc = createMsxml2DOMDocumentObject();
stylesheetDoc.async = false;
stylesheetDoc.load(xmlHttp.responseXML);
}
}
// crea una instancia XMLHttpRequest
function createXmlHttpRequestObject()
{
// almacenará la referencia al objeto XMLHttpRequest
var xmlHttp;
// esto debería funcionar en todos los navegadores excepto IE6 y más antiguos
try
{
// intenta crear el objeto XMLHttpRequest
xmlHttp = new XMLHttpRequest();
}
catch(e)
{
// asume IE6 o más antiguo
var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0",
"MSXML2.XMLHTTP.5.0",
"MSXML2.XMLHTTP.4.0",
"MSXML2.XMLHTTP.3.0",
"MSXML2.XMLHTTP",
"Microsoft.XMLHTTP");
// prueba cada id prog hasta que una funcione
for (var i=0; i<XmlHttpVersions.length && !xmlHttp; i++)
{
try
{
// intenta crear objeto XMLHttpRequest
xmlHttp = new ActiveXObject(XmlHttpVersions[i]);
}
catch (e) {}
}
}
// devuelve el objeto creado o muestra un mensaje de error
if (!xmlHttp)
alert("Error creating the XMLHttpRequest object.");
else
return xmlHttp;
}
el XSL es:
Código:
<?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <div id="datacli1" class="datcli"> <ul> <li class="lista"> <xsl:value-of select="data/row/TipCliente/"/> <xsl:value-of select="data/row/IdCliente/"/> </li> <li class="lista"> <xsl:value-of select="data/row/Nombre/"/> </li> <li class="lista"> <xsl:value-of select="data/row/Sexo/"/> </li> <li class="lista">Profesion: <xsl:value-of select="data/row/Profesion/"/> </li> <li class="lista">Suc.Agencia: <xsl:value-of select="data/row/PtoContacto/"/> </li> </ul> </div> <div id="datacli2" class="datcli"> <ul> <li class="lista">Mandante: <xsl:value-of select="data/row/NomMandante/"/> </li> <li class="lista">Servicio: <xsl:value-of select="data/row/Servicio/"/> </li> </ul> </div> <div id="datacli3" class="datcli"> <ul> <li class="lista">Telefono: <xsl:value-of select="data/row/TelNumero/"/> </li> <li class="lista">Linea: <xsl:value-of select="data/row/TelLinea/"/> </li> <li class="lista">Anexo: <xsl:value-of select="data/row/TelAnexo/"/> </li> <li class="lista">Prefijo Local: <xsl:value-of select="data/row/TelPreLocal/"/> </li> <li class="lista">Prefijo Pais: <xsl:value-of select="data/row/TelPrePais/"/> </li> </ul> </div> </xsl:template> </xsl:stylesheet>
el XML devuelto por el servidor es:
Código:
por favor les pido su ayuda...<?xml version="1.0" encoding="ISO-8859-1"?><data><action>busCliente</action><row><IdCliente>11676018-5 </IdCliente><TipCliente>Rut</TipCliente><Profesion>Contador Auditor</Profesion><Nombre>Pedro Gonzalez Ramirez</Nombre><Sexo>M</Sexo><NomMandante>Metrogas</NomMandante><PtoContacto>Estado 324, Santiago, Santiago</PtoContacto><Servicio>Judicial</Servicio><TelNumero></TelNumero><TelLinea></TelLinea><TelAnexo ></TelAnexo><TelPreLocal></TelPreLocal><TelPrePais></TelPrePais><CliFolio>2</CliFolio></row></data>
Gracias
