Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Agregar código a un formulario Web Form con Microsoft ASP.NET
Descripción <ul><li>Uso de las páginas de código subyacente </li></ul><ul><li>Agregar procedimientos de evento a controles...
Lección: uso de las páginas de código subyacente <ul><li>Cómo implementar código </li></ul><ul><li>Escribir código en líne...
Cómo implementar código <ul><li>Tres métodos para  agregar código: </li></ul><ul><ul><li>Ubicar el código en el mismo arch...
Escribir código en línea <ul><li>Código y contenido en el mismo archivo </li></ul><ul><li>Distintas secciones en el archiv...
¿Qué son las páginas de código subyacente? <ul><li>Separación de código y contenido </li></ul><ul><ul><li>Los desarrollado...
Cómo funcionan las páginas de código subyacente <ul><li>Crean archivos distintos para la interfaz de usuario y la lógica d...
Lección: agregar procedimientos de evento a controles de servidor Web <ul><li>¿Qué son los procedimientos de evento? </li>...
¿Qué son los procedimientos de evento? <ul><li>Acciones en respuesta a la interacción de un usuario con los controles de l...
Demostración: uso de eventos <ul><li>Abrir una página ASP.NET con controles y procedimientos de evento en el lado del clie...
Procedimientos de evento en el lado del cliente Internet Páginas  .HTM <ul><li>Normalmente, se utilizan únicamente con con...
Procedimientos de evento en el lado del servidor <ul><li>Utilizados tanto con controles de servidor Web como HTML </li></u...
Multimedia: eventos en el lado del cliente y en el lado del servidor
Crear procedimientos de evento <ul><li>Visual Studio .NET declara variables y crea una plantilla de procedimiento de event...
Práctica dirigida por el profesor: crear un procedimiento de evento <ul><li>Crear un formulario Web Form utilizando Visual...
Interactuar con controles en procedimientos de evento <ul><li>Leer las propiedades de los controles de servidor Web </li><...
Lección: uso de los eventos de página <ul><li>Ciclo de vida de un evento de página </li></ul><ul><li>Multimedia: el proces...
Ciclo de vida de los eventos de página <ul><li>La página se gestiona </li></ul>Page_Load Page_Unload Textbox1_Changed Butt...
Multimedia: el proceso de postback
Demostración: gestionar eventos
Práctica: ordenar los eventos <ul><li>Los estudiantes: </li></ul><ul><ul><li>En determinados escenarios, enumerarán los ev...
Gestión de los eventos Page.IsPostback <ul><li>Page_Load se invoca en cada solicitud </li></ul><ul><ul><li>Utilizar  Page....
Vínculo de dos controles <ul><li>Vincular un control con otro resulta útil para obtener  valores de cuadros de lista o lis...
Demostración: vincular controles <ul><li>Vincular un control Label a un control ListBox </li></ul>
Upcoming SlideShare
Loading in …5
×

4. Agregar Codigo A Los Formularios Web Form

0 views

Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

4. Agregar Codigo A Los Formularios Web Form

  1. 1. Agregar código a un formulario Web Form con Microsoft ASP.NET
  2. 2. Descripción <ul><li>Uso de las páginas de código subyacente </li></ul><ul><li>Agregar procedimientos de evento a controles de servidor Web </li></ul><ul><li>Uso de eventos de página </li></ul>
  3. 3. Lección: uso de las páginas de código subyacente <ul><li>Cómo implementar código </li></ul><ul><li>Escribir código en línea </li></ul><ul><li>¿Qué son las páginas de código subyacente? </li></ul><ul><li>Entender cómo funcionan las páginas de código subyacente </li></ul>
  4. 4. Cómo implementar código <ul><li>Tres métodos para agregar código: </li></ul><ul><ul><li>Ubicar el código en el mismo archivo que el contenido (mezclado) </li></ul></ul><ul><ul><li>Ubicar el código en una sección distinta del archivo de contenido (código en línea ) </li></ul></ul><ul><ul><li>Ubicar el código en un archivo distinto (páginas de código subyacente) </li></ul></ul><ul><li>Las páginas de código subyacente son el método predeterminado de Visual Studio .NET </li></ul>
  5. 5. Escribir código en línea <ul><li>Código y contenido en el mismo archivo </li></ul><ul><li>Distintas secciones en el archivo para el código y HTML </li></ul><HTML> <asp:Button id=&quot;btn&quot; runat=&quot;server&quot;/> </HTML> <SCRIPT Language=&quot;vb&quot; runat=&quot;server&quot;> Sub btn_Click(s As Object, e As EventArgs) Handles btn.Click ... End Sub </SCRIPT> <HTML> <asp:Button id=&quot;btn&quot; runat=&quot;server&quot;/> </HTML> <SCRIPT Language=&quot;c#&quot; runat=&quot;server&quot;> private void btn_Click(object sender, System.EventArgs e) { . . . } </SCRIPT>
  6. 6. ¿Qué son las páginas de código subyacente? <ul><li>Separación de código y contenido </li></ul><ul><ul><li>Los desarrolladores y los diseñadores de la interfaz de usuario pueden trabajar independientemente </li></ul></ul>Form1.aspx Form1.aspx Form1.aspx.vb o Form1.aspx.cs <tags> <tags> código código Archivos distintos Un archivo
  7. 7. Cómo funcionan las páginas de código subyacente <ul><li>Crean archivos distintos para la interfaz de usuario y la lógica de la interfaz </li></ul><ul><li>Utilizan la directiva @ Page para enlazar los dos archivos </li></ul><ul><li>Pre-compilación o compilación JIT </li></ul>Page1.aspx <% @ Page Language=&quot;c#&quot; Inherits=&quot;Project.WebForm1&quot; Codebehind=&quot;Page1.aspx.cs&quot; Src = &quot;Page1.aspx.cs&quot; %> Page1.aspx.cs public class WebForm1 { private void cmd1_Click() { … } }
  8. 8. Lección: agregar procedimientos de evento a controles de servidor Web <ul><li>¿Qué son los procedimientos de evento? </li></ul><ul><li>Demostración: uso de eventos </li></ul><ul><li>Procedimientos de evento en el lado del cliente </li></ul><ul><li>Procedimientos de evento en el lado del servidor </li></ul><ul><li>Multimedia: eventos en el lado del cliente y en el lado del servidor </li></ul><ul><li>Crear procedimientos de evento </li></ul><ul><li>Práctica dirigida por el profesor: crear un procedimiento de evento </li></ul><ul><li>Interactuar con controles en procedimientos de evento </li></ul>
  9. 9. ¿Qué son los procedimientos de evento? <ul><li>Acciones en respuesta a la interacción de un usuario con los controles de la página </li></ul>
  10. 10. Demostración: uso de eventos <ul><li>Abrir una página ASP.NET con controles y procedimientos de evento en el lado del cliente y en el lado del servidor </li></ul><ul><li>Hacer clic en los controles para visualizar la ejecución de los eventos en el lado del cliente y en el lado del servidor </li></ul><ul><li>En el explorador, visualizar el código fuente de la página </li></ul><ul><li>En el editor, visualizar el código del procedimiento de evento </li></ul>
  11. 11. Procedimientos de evento en el lado del cliente Internet Páginas .HTM <ul><li>Normalmente, se utilizan únicamente con controles HTML </li></ul><ul><li>Interpretado por el navegador y se ejecuta en el cliente </li></ul><ul><li>No tiene acceso a los recursos del servidor </li></ul><ul><li>Utiliza <SCRIPT language=&quot; lenguaje &quot;> </li></ul>
  12. 12. Procedimientos de evento en el lado del servidor <ul><li>Utilizados tanto con controles de servidor Web como HTML </li></ul><ul><li>El código se compila y ejecuta en el servidor </li></ul><ul><li>Tienen acceso a recursos del servidor </li></ul><ul><li>Utilizan <SCRIPT language=&quot;vb&quot; runat=&quot;server&quot;> o <SCRIPT language=“cs&quot; runat=&quot;server&quot;> </li></ul>Internet .Páginas .ASPX
  13. 13. Multimedia: eventos en el lado del cliente y en el lado del servidor
  14. 14. Crear procedimientos de evento <ul><li>Visual Studio .NET declara variables y crea una plantilla de procedimiento de evento </li></ul><ul><li>El uso de la palabra clave Handles agrega a un evento varios procedimientos de evento </li></ul>protected System.Web.UI.WebControls.Button cmd1; private void InitializeComponent() { this.cmd1.Click += new System.EventHandler(this.cmd1_Click); this.Load += new System.EventHandler(this.Page_Load); } private void cmd1_Click(object s, System.EventArgs e) Protected WithEvents cmd1 As System.Web.UI.WebControls.Button Private Sub cmd1_Click(ByVal s As System.Object, _ ByVal e As System.EventArgs) Handles cmd1.Click
  15. 15. Práctica dirigida por el profesor: crear un procedimiento de evento <ul><li>Crear un formulario Web Form utilizando Visual Studio .NET </li></ul><ul><li>Agregar controles al formulario Web Form </li></ul><ul><li>Hacer doble clic en uno o más controles para agregar procedimientos de evento </li></ul><ul><li>Generar y examinar </li></ul>
  16. 16. Interactuar con controles en procedimientos de evento <ul><li>Leer las propiedades de los controles de servidor Web </li></ul><ul><li>Respuestas de salida a otros controles de servidor Web </li></ul>lblGreeting.Text = &quot;new text&quot; strGreeting = &quot;Hello &quot; & txtName.Text strGreeting = &quot;Hello &quot; + txtName.Text; lblGreeting.Text = &quot;new text&quot;;
  17. 17. Lección: uso de los eventos de página <ul><li>Ciclo de vida de un evento de página </li></ul><ul><li>Multimedia: el proceso PostBack </li></ul><ul><li>Demostración: gestionar eventos </li></ul><ul><li>Práctica: ordenar los eventos </li></ul><ul><li>Gestión de los eventos Page.IsPostback </li></ul><ul><li>Vínculo de dos controles </li></ul><ul><li>Demostración: vincular controles </li></ul>
  18. 18. Ciclo de vida de los eventos de página <ul><li>La página se gestiona </li></ul>Page_Load Page_Unload Textbox1_Changed Button1_Click Page_Init Eventos control Eventos de cambio Eventos de acción
  19. 19. Multimedia: el proceso de postback
  20. 20. Demostración: gestionar eventos
  21. 21. Práctica: ordenar los eventos <ul><li>Los estudiantes: </li></ul><ul><ul><li>En determinados escenarios, enumerarán los eventos que ocurrirán y el orden en que se producirán </li></ul></ul><ul><li>Tiempo: 5 minutos </li></ul>
  22. 22. Gestión de los eventos Page.IsPostback <ul><li>Page_Load se invoca en cada solicitud </li></ul><ul><ul><li>Utilizar Page.IsPostBack para ejecutar lógica condicional </li></ul></ul><ul><ul><li>Page.IsPostBack evita la recarga en cada postback </li></ul></ul>Private Sub Page_Load(ByVal s As System.Object, _ ByVal e As System.EventArgs) Handles MyBase.Load If Not Page.IsPostBack Then 'executes only on initial page load End If 'this code executes on every request End Sub private void Page_Load(object sender, System.EventArgs e) { if (!Page.IsPostBack) { // executes only on initial page load } //this code executes on every request }
  23. 23. Vínculo de dos controles <ul><li>Vincular un control con otro resulta útil para obtener valores de cuadros de lista o listas desplegables </li></ul><ul><li>Enlace de datos </li></ul><asp:DropDownList id=&quot;lstOccupation&quot; autoPostBack=&quot;True&quot; runat=&quot;server&quot; > You selected: <asp:Label id=&quot;lblSelectedValue&quot; Text=&quot; <%# lstOccupation.SelectedItem.Text %> &quot; runat=&quot;server&quot; /> private void Page_Load(object sender, System.EventArgs e) { lblSelectedValue.DataBind(); } Sub Page_Load(s As Object, e As EventArgs) Handles MyBase.Load lblSelectedValue.DataBind() End Sub
  24. 24. Demostración: vincular controles <ul><li>Vincular un control Label a un control ListBox </li></ul>

×