LABORATORIO #14 Studio

Adobe DreamWeaver Cs 3 Acceso a Datos Utilizando ASP.
Net Interactuando con Visual Studio
LABORATORIO N 14
Objetivos: Creacin de un Catalogo Virtual. Utilizacion de la propiedade AutoPostBack Utilizacion de la propiedade IsPostBack Agregar Elementos Existentes al Proyecto. Configuracin de un GridView. Utilizacion de Plantillas. Envio de parametros de una pagina a otra. Utilizacion del Control HyperLink.
Cueva Valverde Diego Alberto - Instructor en T.I
diegoalberto_1987@hotmail.com
Adobe DreamWeaver Cs 3 Acceso a Datos Utilizando ASP.Net Interactuando con Visual Studio
Creando un Catalogo Virtual

1. Seleccionar la carpeta Compras
2. Hacer clic en el men Sitio Web > Agregar Nuevo Elemento. 3. Aparecer el cuadro de dialogo llamado Agregar Nuevo elemento. 4. Seleccionar Web Forms asignar el nombre de listaProductos.aspx. 5. Activar las siguientes fichas. Seleccionar Pagina principal. Colocar el cdigo en un archivo independiente.
6. Aparecer un cuadro d dialogo llamado Seleccionar una pgina principal. 7. Hacer clic en la carpeta Compras y al lado derecho selecciona la pgina master llamada compras.master. Cueva Valverde Diego Alberto - Instructor en T.I diegoalberto_1987@hotmail.com
8. Como usted podr observar se ah generado la pagina llamada listaproductos.aspx.
9. Ejecutar la Pagina (pulsar la Tecla F5).
Utilizacion de las propiedades AutoPostBack y IsPostBack

IsPostBack.- Obtiene un valor que indica si la pgina se est cargando como respuesta a un valor devuelto por el cliente, o si es la primera vez que se carga y se obtiene acceso a la misma. AutoPostBack.- Es true si se produce una devolucin automtica al servidor cuando el usuario cambia el texto en el cuadro de texto y sale del control con el tabulador; de lo contrario, es false. El valor predeterminado es false. 10. Arrastra el control ListBox de la Ficha Estndar a la pgina web. 11. Seleccionar el control ListBox y en la propiedad ID asignar el nombre de lstCategorias. 12. Hacer clic en la etiqueta inteligente y Activar la Opcin AutoPostBack.
13. Hacer doble clic en el formulario e importar los siguientes Namespaces. Cueva Valverde Diego Alberto - Instructor en T.I diegoalberto_1987@hotmail.com
Imports System.Data.SqlClient Imports System.Data 14. Establecer la cadena de conexin y crear un dataSet para todo el formulario. Dim carritocn As New SqlConnection(ConfigurationManager.ConnectionStrings("cn").ToString()) Dim ds As New DataSet 15. Digitar dentro del Evento load del Formulario el siguiente codigo.
If Page.IsPostBack = False Then Dim da As New SqlDataAdapter("select * from categoras", carritocn) ds.Clear() da.Fill(ds, "categorias") Me.lstCategorias.DataSource = ds.Tables("categorias") Me.lstCategorias.DataTextField = "NombreCategora" Me.lstCategorias.DataValueField = "idcategora" Me.lstCategorias.DataBind() End If 16. Ejecutar la Pagina(Pulsar la Tecla F5).
17. Arrastrar el control GridView al Formulario.
18. Hacer doble clic sobre el control ListBox y estando dentro del evento SelectedIndexChanged digitar el siguiente codigo. Try Dim dalista As New SqlDataAdapter("Select idproducto,nombreproducto,cantidadporunidad,preciounidad,unidadesenexistencia from productos where idcategora=" & _ Me.lstCategorias.SelectedValue, carritocn) ds.Clear() dalista.Fill(ds, "lista") Me.GridView1.DataSource = ds.Tables("lista") Me.GridView1.DataBind() Catch ex As Exception Response.Write(ex.Message) End Try 19. Seleccionar el control GridView y hacer clic en la etiqueta inteligente y seleccionar la opcion Formato Automatico.
20. Seleccionar el formato que usted desee.
21. Ejecutar la Pagina (pulsar la Tecla F5) 22. Hacer clic en una de las categorias.
Agregando elementos Existentes

23. Seleccionar la carpeta Compras y hacer clic derecho sobre dicha carpeta y seleccionar la opcion Agregar Elemento Existente.
24. Seleccionar todos los elementos que se encuentran dentro de la carpeta imgenesproductos (Solicitar la Carpeta al Instructor).
Dar Formato al Control GridView

25. Seleccionar el control GridView y hacer clic en la etiqueta intelgente. 26. Seleccionar la opcion Editar Columnas.
27. Desactivar la opcion Generar Campos Automaticamente.
28. Agregar 5 campos BoundField. 29. Seleccionar el primer BoundField y dar el siguiente formato. 30. Eln la propiead HeaderText dar el nombre de Cod.
31. En la propiedad DataFiled asignar el campo idprodcuto.
32. Para los siguientes BoundFiled, asignar el siguiuente formato: Control BoundField BoundField BoundField BoundField HeaderText Nombre Descripcion Precio U. Stock Propiedades DataFiled nombreproducto cantidadporunidad preciounidad unidadesenexistencia
DataFormatString
{0:N1}
33. Agregar el Campo CommadField > Seleccionar. 34. Seleccionar el Campo Seleccionar y en la porpiedad ButtonType seleccionar la opcion Image.
35. Seleccionar el Campo Seleccionar y en la porpiedad SelectImageUrl seleccionar una imagen de la carpeta imgenes con el nombre de carrito10.jpg (pedir la imagen al Instructor).
36. Ejecutar la pagina y hacer clic en alguna de las categorias.
Cules son los cambios que usted nota en el Control GridView?
______________________________________________________________________________
Agregando Cantidades al Pedido

37. Hacer clic sobre el control Gridview. 38. Hacer clic en la etiqueta inteligente y seelccionar la opcion Editar Columnas. 39. Agregar el Campo llamado TemplateField. 40. En la propiedad HeaderText asignar el nombre de Cantidad. 41. Llevar el campo Cantidad encima del Campo Seleccionar.
42. Hacer clic en aceptar. 43. Seleccionar el Campo que se cuentra con el nombre de Cantidad. 44. Como usted podra observar toda esa columna con el nombre de Cantidad se encuentra vacia. 45. Hacer clic en la etiqueta inteligente y seleccionar Editar Plantillas.
46. Se tiene que mostrar una plantilla tal como se muestra en la figura. Cueva Valverde Diego Alberto - Instructor en T.I diegoalberto_1987@hotmail.com
47. Esta plantilla nos permite insertar cualquier control. 48. Agregar a la plantilla un TextBox, al TextBox en la propiedad ID asignar el nombre de txtcantidad.
49. Hacer clic en la etiqueta inteligente y seleccionar la opcion Terminar Edicion de plantilla. 50. Ejecutar la Pagina (Pulsar la Tecla F5). 51. Seleccione cualquiera de las categorias. 52. Como usted podra obaservar ahora dentro del GridView se encuentra un TextBox.
Creando el Catalogo de Productos en Oferta

53. Arrastrar el control DataList, debajo del GridView. 54. Habilitar la opcin Edicin de Plantilla. 55. Dentro de la plantilla crear una tabla de 6 filas y 1 Columna.
56. Agregar a las filas de la tabla los siguientes controles.
Control Label Label Label Image Label Label HyperLink HyperLink ID Lblnombre Label2 Lblcodigo Image1 Label1 Label3 HyperLink2 HyperLink1 Text Codigo
Propiedades Editar DataBinding Eval("nombreproducto") Eval("idproducto") Eval("imagen")
NavigateUrl
Precio Eval("preciounidad") Pedir Detalles "detalleProducto.aspx?Codigo=" & Eval("IdProducto")
57. Tiene que quedar tal como se muestra en la figura.
58. Dentro del Evento Load del formulario agregar la siguiente sentencia SQL, esta sentencia va al final del END IF. Dim daoferta As New SqlDataAdapter("select * from productos where preciounidad < 9.5", carritocn) Dim dt As New DataTable dt.Clear() daoferta.Fill(dt) Me.DataList1.DataSource = dt Me.DataList1.DataBind() Explicar la sentencia SQL contenida en el SqlDataAdapter?
_________________________________________________________________________________ 59. Dentro del evento SelectedIndexChanged del control lstCategorias agregar el siguiente codigo al final del Script anterior. Me.DataList1.Visible = False
Enviando Parametros de una Pagina a Otra

Anteriormente se habia agregado un parametro al control HyperLink1 en la propiedad NavigateUrl.El parametro ingreado es el siguiente.
"detalleProducto.aspx?Codigo=" & Eval("IdProducto")
Explicacion del Codigo

detalleProducto.aspx.- Es el nombre de la pagina a donde se va a enviar. Codigo.- Es el nombre del parametro que se le esta asignando. Eval("IdProducto").- Es el valor que va a tomar la variable del parametro enviado a la pagina detalleProducto.aspx 60. Crear una pagina llamada detalleProducto.aspx. 61. Arrastrar el control DataList. 62. Habilitar la opcin Edicin de Plantilla. 63. Dentro de la plantilla crear una tabla de 7 filas y 1 Columna. 64. Agregar a las filas de la tabla los siguientes controles. Control Label Label Label Label Image Label Label Label Label HyperLink ID Lblnombre Lbldescripcion Label2 Lblcodigo Image1 Label1 Label3 Label4 Label6 HyperLink1 Text Propiedades Editar DataBinding Eval("nombreproducto") Eval("cantidadporunidad") Eval("idproducto") Eval("imagen") Precio Eval("preciounidad") Stock Eval("unidadesenExistencia") Pedir
NavigateUrl
Codigo
65. Tiene que quedar tal como se muestra en la figura.
66. Digitar el siguiente cdigo dentro del Evento Load de la pgina detalleProducto.aspx. If Request.QueryString("codigo") <> "" Then Dim da As New SqlDataAdapter("Select * from Productos where IdProducto=" & _ Request.QueryString("codigo"), cn) ds.Clear() da.Fill(ds, "detalle") Me.DataList1.DataSource = ds.Tables("detalle") Me.DataList1.DataBind() Else Response.Redirect("ListaProductos.aspx") End If
Explicacion del Codigo

Se utiliza una condicional, diciendo que si la variable de parametro es diferente a ser un valor nullo, entonces sucede la consulta.Esta consulta devuelve un valor y ese valor lo toma el control DataList1. En caso de la que la varible de parametro este vacia, esta la reenvia a la pagina ListaProductos.aspx. Request.- Captura el parametro enviado por otra pagina. QueryString.- Obtiene el nombre del parametro enviado por la otra pagina.
Response.- Este Objeto permite enviar Datos de respuesta Http a un cliente y contiene informacin sobre esa respuesta. Redirect.- Redirecciona un cliente a una nueva direccion URL y especifica la nueva URL. 67. Ejecutar la pagina (pulsar la Tecla F5). 68. Como uste podra observar al ejecutar la pagina detalleProducto.aspx, esta la reenvia a la pagina ListaProductos.aspx, ya que la variable de parametro no contiene ningun valor.
69. Como usted puede observar, se muestra en forma automatica un listado de productos. 70. Sealar el Hipervinculo Detalles.
Dejar el puntero del mouse sobre el Hipervnculo
71. Como usted podra obasevar en la barra de estado se muestra un valor, este valor representa al valor del parametro.
72. Quiere decir del que el parametro tiene el Valor de 13. 73. Hacer clic en el Hipervinculo Detalles. 74. Como uste dpodra observar fue enviado a la pagina detalleProducto.aspx. 75. El producto que nos muestra en esta pagina es el producto con el codigo 13. 76. Como usted recordara la consulta que se realizo en el Evento Load del formulario Web, iguala al Campo IdProducto a la Variable de Parametro.

LABORATORIO #14 Studio

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

LABORATORIO #14 Studio

Uploaded by

Copyright:

Available Formats

Adobe DreamWeaver Cs 3 Acceso a Datos Utilizando ASP.

Net Interactuando con Visual Studio

Cueva Valverde Diego Alberto - Instructor en T.I

Creando un Catalogo Virtual

8. Como usted podr observar se ah generado la pagina llamada listaproductos.aspx.

9. Ejecutar la Pagina (pulsar la Tecla F5).

Cueva Valverde Diego Alberto - Instructor en T.I

Utilizacion de las propiedades AutoPostBack y IsPostBack

17. Arrastrar el control GridView al Formulario.

Cueva Valverde Diego Alberto - Instructor en T.I

20. Seleccionar el formato que usted desee.

Cueva Valverde Diego Alberto - Instructor en T.I

Agregando elementos Existentes

Cueva Valverde Diego Alberto - Instructor en T.I

Dar Formato al Control GridView

27. Desactivar la opcion Generar Campos Automaticamente.

Cueva Valverde Diego Alberto - Instructor en T.I

Cueva Valverde Diego Alberto - Instructor en T.I

31. En la propiedad DataFiled asignar el campo idprodcuto.

Cueva Valverde Diego Alberto - Instructor en T.I

36. Ejecutar la pagina y hacer clic en alguna de las categorias.

Cueva Valverde Diego Alberto - Instructor en T.I

Cules son los cambios que usted nota en el Control GridView?

Agregando Cantidades al Pedido

Cueva Valverde Diego Alberto - Instructor en T.I

Cueva Valverde Diego Alberto - Instructor en T.I

Creando el Catalogo de Productos en Oferta

56. Agregar a las filas de la tabla los siguientes controles.

Cueva Valverde Diego Alberto - Instructor en T.I

Propiedades Editar DataBinding Eval("nombreproducto") Eval("idproducto") Eval("imagen")

Precio Eval("preciounidad") Pedir Detalles "detalleProducto.aspx?Codigo=" & Eval("IdProducto")

57. Tiene que quedar tal como se muestra en la figura.

Cueva Valverde Diego Alberto - Instructor en T.I

Enviando Parametros de una Pagina a Otra

"detalleProducto.aspx?Codigo=" & Eval("IdProducto")

Explicacion del Codigo

65. Tiene que quedar tal como se muestra en la figura.

Cueva Valverde Diego Alberto - Instructor en T.I

Explicacion del Codigo

Cueva Valverde Diego Alberto - Instructor en T.I

Cueva Valverde Diego Alberto - Instructor en T.I

Dejar el puntero del mouse sobre el Hipervnculo

Cueva Valverde Diego Alberto - Instructor en T.I

You might also like