Uso De Xml En Asp

OBJETIVOS

! "

"#$

%&

'

REQUERIMIENTOS

SOFTWARE Microsoft Visual Studio 2005 .NET FrameWork 2.0 DESCRIPCIÓN

El siguiente tutorial está destinado a trabajar mostrar datos provenientes de un archivo XML

con

Web

Forms

para

ACTIVIDAD 1 – CREANDO EL PROYECTO

Crear un nuevo proyecto Web y agregue un archivo XML que contenga los datos de libros. Los libros cuentan con un ISBN, un título y un precio y, eventualmente se tienen comentarios y cada comentario tiene un rating y un texto que describe el comentario. Para agregar el archivo XML a su proyecto hacemos clic derecho sobre el proyecto (en el Explorador de soluciones) y selecciona Agregar Nuevo Elemento debería aparecer una ventana como lo que se indica a continuación:

La estructura del archivo XML debería quedar como lo muestra la siguiente figura:

NOTA. El archivo se encuentra disponible junto a este tutorial. La estructura del archivo XML dice relación con los datos asociados a cada libro. Cada libro tiene un ISBN, un título, un precio y, eventualmente, una lista de comentarios y cada comentario tiene un rating y el texto que describe el comentario en sí. ACTIVIDAD 2 – AGREGAR EL CONTROL GridView PARA VER LOS DATOS

Al formulario Web (en el caso de que usted no le haya cambiado el nombre debería llamarse Default.aspx) que se tiene se va a agregar, a través del Cuadro de Herramientas, un control del tipo XmlDataSource tal y como se indica en la siguiente figura:

(

En el menú de Tareas del XmlDataSource haga clic en Configurar origen de datos, tal y como se muestra en la siguiente figura:

Usando el botón Examinar seleccione el archivo XML que ha creado en la sección anterior. Luego clic en Aceptar. Ahora vamos a agregar un control del tipo GridView que representa una tabla (grilla) para mostrar los datos presentes en el XML. Para ello usamos el Cuadro de Herramientas tal y como se muestra en la siguiente figura:

)

Luego se selecciona del menú Tareas de GridView la opción Elegir origen de datos y de la lista disponible seleccionar el objeto XmlDataSource (en mi caso se llama XmlDatos) tal y como se muestra en la siguiente figura:

Lo anterior va a permitir que la grilla se complete con los datos que se encuentran en el archivo XML. Nuestro diseño del archivo .aspx debería quedar como se muestra a continuación:

*

Si ahora intentamos ejecutar el proyecto obtenemos la siguiente salida:

Es posible apreciar que no están todos los datos que se han incluido en el archivo XML. Las siguientes actividades nos van a indicar la forma en la cual vamos a mostrar los datos faltantes que dicen relación con los comentarios asociados a los libros. ACTIVIDAD 4 – VISUALIZAR EL RESTO DE LOS DATOS DEL XML

Para poder visualizar el resto de los datos se procede a filtrar datos XML mediante una expresión XPath. En las actividades anteriores, se trabajó en el comportamiento predeterminado de los controles XmlDataSource y GridView para extraer información del archivo xml. Sin embargo, el control sólo muestra parte de estos datos XML. En esta parte del tutorial, agregará un segundo control GridView y lo usará para mostrar información principal-detalle. Los usuarios podrán seleccionar un libro individual en el primer control GridView y el segundo control GridView mostrará los comentarios del usuario relacionados, si existieran, para ese libro. Para mostrar comentarios, utilizará una expresión XPath, que le permite especificar el nivel del

+

archivo de datos XML que desea extraer. Puesto que desea mostrar comentarios para un libro específico únicamente, creará la expresión XPath de forma dinámica, dependiendo del libro que haya seleccionado el usuario. Agregamos un nuevo control GridView y seleccionamos desde el menú Tareas de GridView la opción Elegir origen de datos y luego tal y como lo indica la siguiente figura:

Con lo anterior se va a desplegar una ventana con el asistente para escoger el origen de datos, seleccionamos Archivo XML como se indica en la siguiente figura:

,

Le damos el ID XmlDetalle y hacemos clic en el botón Aceptar. Aparece el cuadro de diálogo Configurar origen de datos. En la sección de Archivo de datos seleccionamos el XML que tenemos disponible. En la sección Expresión XPath colocamos la expresión que se muestra en la siguiente figura:

Luego clic en el botón Aceptar. El diseño del archivo .aspx queda, ahora, como lo muestra la siguiente figura:

-

Lo que vamos a hacer ahora es permitir que los comentarios que se han hecho de los libros sólo se vean cuando el usuario seleccione un libro de la grilla principal. Para lograr lo anterior se tiene que configurar el primer GridView agregado. También agregará código para crear una expresión XPath basada en la selección del usuario y asignarla al control XmlDetalle. El resultado final es que el segundo control GridView mostrará los comentarios del usuario para el libro seleccionado. ACTIVIDAD 5 – CONFIGURANDO EL CONTROL GridView PARA LA SELECCIÓN

Lo primero que vamos a hacer es dejar el GridView de los comentarios invisible, a través de la ventana de Propiedades, modificamos la propiedad Visible en False. Ahora, en la vista de diseño seleccione el primer GridView y en el menú de Tareas se debe marcar la opción Habilitar Selección, tal y como se muestra a continuación:

Al habilitar esta opción cambia el diseño de la grilla, y debería quedar como lo muestra la siguiente figura:

.

Luego usando la ventana de propiedades vamos a cambiar el DataKeyNames por ISBN tal y como se muestra en las siguientes figuras:

/

Desde el cuadro de diálogo que se muestra en la figura anterior se selecciona el ISBN y se traspasa a la lista de campos de datos seleccionados y luego clic en el botón Aceptar. Lo anterior permite configurar el GridView para que trate al ISBN como clave principal de cada elemento presente en el archivo XML. Ahora desde la misma ventana de Propiedades del primer GridView hacer clic en Eventos, tal y como lo indica la siguiente figura:

Hacer doble clic sobre el evento SelectedIndexChanged. Esto nos lleva a:

0

Acá estamos programando el evento asociado al cambio del ítem seleccionado en la grilla. El código asociado a este evento es el que se indica en la siguiente figura:

Se obtiene el ISBN del libro seleccionado y luego se modifica, en tiempos de ejecución, la expresión XPath de acuerdo al ISBN que se ha seleccionado. Ahora ejecute su proyecto y comience a seleccionar libros de la tabla que se va a presentar, lo que debería pasar es que a medida que seleccione los libros de la grilla principal debería aparecer (en caso de que existan comentarios) en grilla inferior los comentarios del libro seleccionado.