Cargando datos en formularios aspx con AJAX y Visual Studio 2003
No todos tenemos la suerte de poder trabajar con VS 2005 y ASP.NET AJAX, ASP.NET AJAX Control Toolkit para facilitar el desarrollo de aplicaciones ricas en cliente y de vez en cuando algún cliente te pide cosas como: "Quiero que cuando el usuario introduzca un código en la caja de texto se carguen una serie de datos en la página..." y piensas: "Si me pide esto para una página, no va a ser la única en la que me lo pidan", con lo cual te pones a pensar en como te montas algo para automatizar esa labor.
Bueno, pues el caso anterior fue mi caso y decidí atacarlo de la siguiente manera:
Primero: Crear una librería javascript para manejar AJAX a pelo (como decía José María Alarcón en algunos de sus post).
Segundo: Crear una página aspx que recepcione esas llamadas y devuelva la info en formato XML:
Aquí uno de los puntos fuertes fue el diseño del XML, en el creo un campo llamado name que corresponde con el nombre del txt a cargar y su valor, para que en el cliente el código javascript sepa a que campos debe cargar cada valor. Se pueden devolver todos los valores que se quiera en el xml (Incluir los campos que se quieran en la SQL, en una llamada a SAP...), ya que el código javascript del cliente se encargará de cargar solo aquellos que existan:
<?xml version="1.0" ?>
<response>
<txt name="CustomerID">ALFKI</txt>
<txt name="CompanyName">CLH</txt>
<txt name="ContactName">Maria Anders</txt>
<txt name="ContactTitle">Sales Representative</txt>
<txt name="Address">Obere Str. 57</txt>
<txt name="City">Berlin</txt>
<txt name="Region"></txt>
<txt name="PostalCode">12209</txt>
<txt name="Country">Germany</txt>
<txt name="Phone">6578</txt>
<txt name="Fax">030-0076545</txt>
</response>
Otra cosa importante es que los campos de la página aspx se deben llamar como los de la base de datos anteponiéndoles el prefijo txt. Lo he hecho así para no tener que modificar mucho código en servidor, además que es realmente fácil e intuitivo a la hora de leer el fichero XML y saber que se trata de la estructura de la tabla Customers de la DB Northwind.
Y por último: Crear una función javascript que procese la respuesta XML de la página aspx y cargue los datos:
if (xmlHttp.readyState == 4 || xmlHttp.readyState == 'complete')
{
if (xmlHttp.status == 200)
{
objXml = new ActiveXObject("MSXML2.DOMDocument.3.0");
objXml.async = false;
objXml.loadXML(xmlHttp.responseText);
rootNode = objXml.documentElement;
if(rootNode.childNodes.length > 0)
{
for (iCont=0; iCont<rootNode.childNodes.length; iCont++)
{
var txt = document.getElementById('txt'+rootNode.childNodes(iCont).getAttribute("name"));
if (txt != null)
{
document.getElementById('txt'+rootNode.childNodes(iCont).getAttribute("name")).value = rootNode.childNodes(iCont).text;
}
}
}
else
{
var camposTexto = document.forms[0].elements;
for (x = 0; x < camposTexto.length; x++)
{
if (camposTexto[x].type=='text')
{
document.getElementById(camposTexto[x].name).value = '';
}
}
alert('No se han encontrado coincidencias');
}
}
}
Bueno espero que os haya parecido interesante y espero críticas y comentarios.
Salu2.