universidad don bosco facultad de estudios … · guía #7: introducción al desarrollo de...

Desarrollo de aplicaciones con software propietario

UNIVERSIDAD DON BOSCO

FACULTAD DE ESTUDIOS TECNOLÓGICOS

COORDINACION DE COMPUTACIÓN

CICLO II

GUIA DE LABORATORIO #7

Nombre de la Práctica: Introducción al desarrollo de aplicaciones Web con ASP.NET MVC

Lugar de Ejecución: Centro de cómputo

Tiempo Estimado: 2 horas con 30 minutos

Materia: Desarrollo de aplicaciones con software propietario

I. OBJETIVOS

En esta guía de práctica se pretende:

1. Conseguir que los estudiantes tengan un primer contacto con la programación de aplicaciones web del lado del servidor haciendo uso del marco de trabajo de ASP.NET y la forma de trabajo del mismo.

2. Desarrollar las habilidades mínimas necesarias para crear aplicaciones web haciendo uso de ASP.NET y el lenguaje de programación C#

3. Identificar las partes, tipos de archivos, extensiones y componentes de un proyecto basado en ASP.NET.

4. Lograr la capacidad de consolidar los conocimientos de materias anteriores orientadas al desarrollo web con C#.

II. INTRODUCCIÓN TEÓRICA

¿Qué es ASP.NET?

ASP.NET es un framework para aplicaciones web desarrollado y comercializado por Microsoft. Es usado por programadores y diseñadores para construir sitios web dinámicos, aplicaciones web y servicios web XML. Apareció en enero de 2002 con la versión 1.0 del .NET Framework, y es la tecnología sucesora de la tecnología

Active Server Pages (ASP). ASP.NET está construido sobre el Common Language Runtime,

permitiendo a los programadores escribir código ASP.NET usando cualquier lenguaje admitido por el .NET Framework.

ASP.NET es un modelo de desarrollo Web unificado que incluye los servicios necesarios para crear aplicaciones Web empresariales con el código mínimo.

ASP.NET forma parte de .NET Framework y al codificar las aplicaciones ASP.NET tiene acceso a las clases en .NET Framework.

Guía #7: Introducción al desarrollo de aplicaciones Web con ASP.NET

Desarrollo de aplicaciones con software propietario 2

El código de las aplicaciones puede escribirse en cualquier lenguaje compatible con el Common Language Runtime (CLR), entre ellos Microsoft Visual Basic, C#, JScript .NET y J#.

Estos lenguajes permiten desarrollar aplicaciones ASP.NET que se benefician del Common Language Runtime, seguridad de tipos, herencia, etc. ASP.NET incluye:

Marco de trabajo de página y controles

Compilador de ASP.NET

Infraestructura de seguridad

Funciones de administración de estado

Configuración de la aplicación

Supervisión de estado y características de rendimiento

Capacidad de depuración

Marco de trabajo de servicios Web XML

Entorno de host extensible y administración del ciclo de vida de las aplicaciones

Entorno de diseñador extensible

Requisitos para el desarrollo en ASP.NET

Un editor de código.

NET Framework.

Un servidor Web como IIS (Servicios de Internet Information Server).

Adicionalmente a la programación web es necesario tener algún tipo de soporte para el almacenamiento de datos (SQL Server, Oracle, etc.).

Arquitectura de ejecución de aplicaciones del lado del servidor con ASP.NET

La forma tradicional de trabajar con las aplicaciones basadas en ASP es a través del modelo cliente-servidor. En el modelo cliente-servidor:

Un servidor es un equipo que produce datos

Un cliente es un equipo que utiliza los datos

Las aplicaciones Web utilizan el modelo cliente-servidor

Navegadores Web se ejecutan en los clientes y los datos de solicitud de servidores web

Sitios web se hospedan en servidores web que producen los datos conforme a lo solicitado por los navegadores web

El archivo especial Web.config

Toda la información de configuración de ASP.NET reside en el elemento configuration de los archivos Web.config. La información de configuración incluida en este elemento se agrupa en dos áreas principales: el área de declaración del controlador de sección de configuración (sectionGroup) y el área de valores de la sección de configuración (pages).

En el siguiente ejemplo de código se muestra el lugar que ocupan las secciones mencionadas anteriormente en un archivo Web.config. Observe que el elemento namespaces del elemento pages carece de una declaración de controlador de sección de configuración. El motivo es que el controlador de sección

https://msdn.microsoft.com/es-es/library/ms228147%28v=vs.100%29.aspx

System.Web.Configuration.PagesSection controla todos los elementos secundarios de la sección de configuración pages.

<?xml version="1.0" encoding="us-ascii"?>

<configuration>



<configSections>

<sectionGroup name="system.web"

type="System.Web.Configuration.SystemWebSectionGroup, System.Web,

Version=2.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a">

<section

name="pages"

type="System.Web.Configuration.PagesSection, System.Web,

Version=2.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a"

/>



</sectionGroup>



</configSections>



<pages

buffer="true"

enableSessionState="true"

asyncTimeout="45"



>

<namespaces>

<add namespace="System" />

<add namespace="System.Collections" />

</namespaces>

</pages>



</configuration>

Páginas de código embebido (in-line) y páginas con código de clase subyacente (Code-Behind)

Un bloque de código incrustado o in-line es código del servidor que se ejecuta durante la fase de representación de la página. El código incluido en el bloque puede ejecutar instrucciones de programación y llamar a funciones de la clase de página actual. En el siguiente ejemplo se muestra una representación de código en línea:

<%@ page language="C#" %>

<script runat="server">

https://msdn.microsoft.com/es-es/library/system.web.configuration.pagessection%28v=vs.100%29.aspx



void Button1_Click(object sender, EventArgs e)

{

Label1.Text = "Hello " + TextBox1.Text;

}

</script>

<html>

<head>

<title>ASP.NET Inline Pages</title>

</head>

<body>

<form id="Form1" runat="server">

<h1>Welcome to ASP.NET 2.0!</h1>

<b>Enter Your Name:</b>

<asp:TextBox ID="TextBox1" Runat="server"/>

<asp:Button ID="Button1" Text="Click Me" OnClick="Button1_Click" Runat="server"/>

<br />

<br />

<asp:Label ID="Label1" Text="Hello" Runat="server" />

</form>

</body>

</html>

Como puede observar, tanto el código de programación como el marcado HTML de la estructura de la página se encuentran en un mismo archivo. Esto se indica mediante la primera línea de código (directiva page), en la que únicamente se le indica que el lenguaje de programación a utilizar es C#. La principal utilidad de este modelo es poder conservar la compatibilidad con versiones antiguas de ASP. No obstante, hoy en día no es muy recomendable seguir esta práctica.

Por otra parte, manejar código detrás del modelo o code-behind nos permite organizar los eventos en forma separada, todo lo relacionado con interfaz de usuario lo manejamos en el archivo .aspx y el control de los eventos en un archivo separado .cs (para C Sharp).

De forma similar a la que manejamos los archivos de JavaScript (.js) donde incluimos todas las funciones y luego las referenciamos en el aspx hacemos con el Code Behind.

La forma de compilación y de ejecución de este tipo de modelo se presenta en la siguiente figura.

A continuación se muestra un bloque de código bajo el modelo code-behind.



CodeBehind_cs.aspx

<%@ page language="C#" CodeFile="CodeBehind_cs.aspx.cs" Inherits="CodeBehind_cs_aspx" %>

<html>

<head>

<title>ASP.NET CodeBehind Pages</title>

</head>

<body>

<form runat="server">

<h1>Welcome to ASP.NET 2.0!</h1>

<b>Enter Your Name:</b>

<asp:TextBox ID="TextBox1" Runat="server"/>

<asp:Button ID="Button1" Text="Click Me" OnClick="Button1_Click" Runat="server"/>

<br />

<br />

<asp:Label ID="Label1" Text="Hello" Runat="server" />

</form>

</body>

</html>

CodeBehind_cs.aspx.cs

using System;

public partial class CodeBehind_cs_aspx : System.Web.UI.Page {

protected void Button1_Click(object sender, EventArgs e) {

Label1.Text = "Hello " + TextBox1.Text;

}

}

Como puede observar, ahora existen dos tipos de archivos, uno en el que se maneja el aspecto visual de la página y el otro donde se implementa la lógica de programación por separado. Esto es muy útil en aquellos equipos de desarrollo multidisciplinario en el que es necesario trabajar junto a diseñadores web y otros programadores. Además, se sabe que es code-behind ya que a diferencia del modelo de código en línea, la directiva page de la línea uno del archivo CodeBehind_cs.aspx muestra los siguientes componentes:

<%@ page language="C#" CodeFile="CodeBehind_cs.aspx.cs" Inherits="CodeBehind_cs_aspx" %>

Language=”C#”: este atributo le está indicando al compilador que el código estará escrito en lenguaje C

Sharp.

AutoEventWireup=”true”: indica si el código será inline o Behind. Al “setearlo” en “true” le estamos indicando que el código será detrás del modelo (CodeBehind) y se especifica el nombre del archivo donde buscará el código de eventos.

CodeFile=”CodeBehind_cs.aspx.cs”: indica el nombre del archivo donde incluiremos el código de eventos.

Inherits=” CodeBehind_cs_aspx”: se especifica la clase a heredar, esta clase la busca dentro del archivo que indicamos en CodeFile.



Entorno de desarrollo para ASP.NET de Visual Studio

Al crear un nuevo desarrollo de sitio web haciendo uso de Visual Studio, la parte visual tiende a cambiar un poco con relación a la mostrada en los desarrollos de programas desktop. En lo que respecta a la visualización de la pantalla para formularios, podemos distinguir las siguientes secciones:

1. Barra estándar: contiene las funciones de ejecución del proyecto así como también la posibilidad de seleccionar sobre que versión de HTML se procederá a realizar la compatibilidad

2. Cuadro de controles: contiene los diferentes tipos de controles que se pueden agregar a un WebForm

3. Vista de código de WebForm: contiene el marcado combinando elementos HTML junto con su correspondiente control ASP. No es el código de programación como tal, sino que es la traducción de lo que se presenta en la forma gráfica.

4. Vista de diseño: corresponde al área visual donde se permite arrastrar y colocar código de forma mucho más fácil.

5. Pestañas de selección con la cual se puede cambiar de modalidad con respecto a las diferentes vistas de presentación.

6. Explorador de soluciones

7. Cuadro de propiedades de cada control

2

3

4

5

6

7

1



III. MATERIALES Y EQUIPO

Para la realización de la guía de práctica se requerirá lo siguiente:

No. Requerimiento Cantidad

1 Guía de práctica #2: Introducción al desarrollo de aplicaciones Web con ASP.NET

1

2 Computadora con Visual Studio 2012 instalado 1

3 Memoria USB o disco flexible 1

IV. PROCEDIMIENTO

Ejercicio #1 – Ejercicio único que muestra una introducción a sitios web basados en ASP.NET.

Se muestra una simulación de un cajero ATM on-line, donde el usuario realiza transacciones con el saldo de su cuenta posterior a una autenticación básica que se realiza en el sitio.

1. Proceda a ejecutar Visual Studio en su computadora. Una vez cargado el IDE, proceda a crear un nuevo sitio web. Para eso, seleccione del menú Archivo la opción “Nuevo Proyecto”. Refiérase a la siguiente imagen.



2. Una vez realizado lo anterior, se abrira una ventana como la siguiente, donde deberá seleccionar el tipo de sitio web a desarrollar. En esta ocasión, seleccione el nodo de Visual C# a la izquierda de la pantalla, del listado central, seleccione Aplicación Web ASP.NET, en nombre coloque Cajero y haga de clic en botón Aceptar.

3. En la ventana de plantillas de ASP.NET, seleccione aplicación Vacia y en Agregar carpetas y referencias

principales para, marque opcion MVC. Haga clic en Aceptar.

4. Con lo anterior habremos creado un nuevo sitio web ASP.NET MVC vacío, el cual tendrá el siguiente aspecto:



5. El diseñador de página nos permite arrastrar y colocar elementos, sin embargo, a diferencia de una ventana, no podemos arrastrar libremente los controles (a menos que tenga posición absoluta). Esto lo debemos realizar con hojas de estilo CSS, por lo que procederemos a crear una nueva carpeta en la raíz del sitio. Para ello de clic derecho sobre el nombre del proyecto en el cuadro del explorador de soluciones. Se le mostrará un menú contextual, del cual deberá seleccionar la opción “Agregar” y luego “Nueva carpeta”. A la nueva carpeta a crear en la raíz, asígnele nombre Content.

6. Una vez creada la carpeta “Content”, agregue los archivos proporcionados como recursos de la guía. Para ello, arrastre la carpeta llamada css, hasta la carpeta “Content”; luego arrastre la carpeta “imágenes”. La carpeta Content almacena las 2 subcarpetas, como se observa a continuación:



7. Agregue un nuevo modelo a nuestro proyecto de nombre transaccion. Para ello, desde la ventana del Explorador de soluciones, ubique y haga clic secundario sobre la carpeta Models. Se le mostrará un menú contextual, del cual deberá seleccionar la opción Agregar y luego Clase. Redacte nombre de clase transaccion y de clic en botón Agregar.

8. Dentro de la nueva clase transaccion, proceda a digitar el siguiente código:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

namespace Cajero.Models{

/// Clase que se utiliza para gestionar las transacciones a realizar por el cajero ATM

public class transaccion

{

//Variables miembro de la clase de visibilidad privada

private String sNumeroTarjeta;

private double fSaldo;

//Constructor de clase que solo acepta un parametro de tipo String

public transaccion(String tarjeta)

{

sNumeroTarjeta = tarjeta;

fSaldo = 500;

}



//Constructor de clase que acepta dos parametros: String y double.

//Pueden haber tantos constructores como se necesiten, pero c/definición debe tener

// una firma (lista y orden de tipos de datos en parametros) diferente.

public transaccion(String tarjeta, double saldo)

{


fSaldo = saldo;

}

//Implementa métodos (get y set) para acceder a campos de clase

public double getSaldo()

{

return fSaldo;

}

public void setSaldo(double saldo)

{

fSaldo = saldo;

}

public String getNumTarjeta()

{

return sNumeroTarjeta;

}

public void setNumTarjeta(String tarjeta)

{


}

public void transferenciaNacional(double monto)

{

fSaldo = fSaldo - monto;

}

public void transferenciaInternacional(double monto)

{

fSaldo = fSaldo - monto;

}

}

}



9. Proceda a crear un nuevo controlador para nuestra pagina principal. Para ello, ubique en Explorador de soluciones a la carpeta Controller y de clic secundario sobre la misma. Del menú contextual, seleccione la opción Agregar y luego Controlador.

10. Cree un controlador vacío, seleccionando opción Controlador de MVC 5: en blanco. Llame a su controlador HomeController. Refierase a la siguiente imagen.

11. Automáticamente, se agregará una clase de C# dentro de nuestra carpeta Controller. Dentro de la nueva clase HomeController proceda a digitar el siguiente código:

using System;


using System.Linq;

using System.Web;

using System.Web.Mvc;

using Cajero.Models;

using System.Runtime.Remoting.Contexts;



namespace Cajero.Controllers

{

public class HomeController : Controller

{

// GET: Home

public ActionResult Index()

{

return View();

}

[HttpPost]

public ActionResult Index(string sNumeroTarjeta,string sNumeroPIN)

{

double sSaldo;

string numero;

transaccion nuevaTransaccion = new transaccion(sNumeroTarjeta);

if (sNumeroTarjeta == "123456" && sNumeroPIN == "654321")

{

numero = nuevaTransaccion.sNumeroTarjeta;

sSaldo = nuevaTransaccion.getSaldo();

return Redirect("../Menu/Menu?sNumeroTarjeta=" + sNumeroTarjeta + "&sSaldo="+sSaldo);

}

else

{

// Si el numero de pin o de tarjeta no corresponde, entonces se

// procede a mostrar un mensaje de error

ViewBag.Error = "Error en número de tarjeta o número de PIN. Verifique";

return View();

}

}

}

}



12. Ahora procederemos a crear una vista para nuestra página principal. Dentro de la clase HomeController, localice y de clic secundario sobre su método View. Del menú contextual, seleccione la opción Agregar vista…

13. En la ventana Agregar vista, deje el nombre por defecto (Index) para la Vista y el tipo de Plantilla predeterminado Vacio (sin modelo), para hacer clic en Agregar.

14. Dentro de la ruta de carpetas View/Home, se agregará automáticamente a un archivo de C# con extensión cshtml llamado Index.cshtml.



15. Abra el archivo index.cshtml y reemplace el código predeterminado por el siguiente código:

@{

ViewBag.Title = "Index";

}

<article class="middle">

<h2>Bienvenido</h2>

Innovando las transacciones en línea, ponemos a su disposición el cajero ATM online

donde podrá realizar sus pagos y transferencias en línea de una forma rápida y fácil

siempre con la calidad y la confianza que nos caracterizan. Realice sus transacciones

desde la comodidad de su hogar las 24 horas del día los 7 días de la semana.

<div class="credenciales">

<div class="bloque">

@Html.Label("Tarjeta #:", new { @class = "etiqueta" });

@Html.Editor("sNumeroTarjeta", "", new { @class = "control" });

</div>

<div class="clear"></div>


@Html.Label("PIN:", new { @class = "etiqueta" });

@Html.Editor("sNumeroPIN", "", new { @class = "control" });

</div>


<button type="submit" ID="btnEntrar" CssClass="submit" runat="server" onclick="location.href('@Url.Action("Index", "Home")')">Ingresar</button>

</div>


</div>

@using (Html.BeginForm())

{


<label class="error">@ViewBag.Error</label>

</div>

}

</article>

<article class="right">

<img src="~/Content/images/200253863-001.jpg" class="bannerRight" />

</article>

16. Ahora, procederemos a modificar la plantilla principal de nuestro proyecto.

Abra la carpeta View->Shared y ubique el archivo Layout.cshtml.



17. Dentro de este archivo Layout.cshtml, reemplace el cod. predeterminado por el siguiente código:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>@ViewBag.Title - Transacciones Cajero ATM</title>

<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />

<link href="~/Content/css/style.css" rel="stylesheet" type="text/css" />

<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />

<script src="~/Scripts/modernizr-2.6.2.js"></script>

</head>

<body>

<form id="form1" method="post">

<section id="wrap">

<section id="top"></section>

<section id="content">

<header class="header">

<h1><a href="#">Cajero ATM</a></h1>

<h2>Transacciones online</h2>

</header>

<article class="breadcrumbs">@Html.ActionLink("INICIO","/")</article>

@RenderBody()

<article id="clear"></article>

</section>

<section id="bottom"></section>

</section>

</section>

</section>

</form>



<footer id="footer">

<a href="http://www.udb.edu.sv">Universidad Don Bosco</a>

</footer>

<script src="~/Scripts/jquery-1.10.2.min.js"></script>

<script src="~/Scripts/bootstrap.min.js"></script>

</body>

</html>

18. Ejecute la aplicación web y deberá mostrar lo siguiente en su navegador:

19. Tomando como base los pasos 9, 10 y 11 de este procedimiento, cree un nuevo controlador de nombre MenuController.

Luego, digite el siguiente código (en la correspondiente clase MenuController):

using System;


using System.Linq;

using System.Web;



{

public class MenuController : Controller

{

// GET: Menu

public ActionResult Menu(string sNumeroTarjeta, double sSaldo)

{

ViewBag.sNumeroTarjeta = sNumeroTarjeta;



ViewBag.sSaldo = sSaldo;

return View();

}

}

}

20. Tome como base los pasos 12 al 14, para crear una nueva Vista llamada Menu, basada en el Controlador MenuController creado en paso anterior.

Luego, digite el siguiente código en la correspondiente archivo Menu.cshtml de la nueva Vista.

@{

ViewBag.Title = "Menu";

}


<h2>Bienvenido</h2>





</article>

<nav class="right">

<ul>

<li>

@Html.ActionLink("Transferencias nacionales", "Nacionales", "Nacionales", new { sNumeroTarjeta = ViewBag.sNumeroTarjeta, sSaldo = ViewBag.sSaldo }, null)

</li>

<li>

@Html.ActionLink("Transferencias internacionales", "Menuopcion", "Home", new { opcion = 2 }, null)

</li>

<li>

@Html.ActionLink("Pagos de Servicios", "Menuopcion", "Home", new { opcion = 3 }, null)

</li>

<li>

@Html.ActionLink("Verificar saldos", "Menuopcion", "Home", new { opcion = 4 }, null)

</li>

</ul>

</nav>

21. De nuevo, repita los pasos 9 al 11 para agregar un nuevo controlador de nombre NacionalesController. Luego, digite el siguiente código en la clase correspondiente (en archivo NacionalesController.cs).

using System;




using System.Linq;

using System.Web;


using Cajero.Models;


{

public class NacionalesController : Controller

{

// GET: Nacionales

public ActionResult Nacionales(string sNumeroTarjeta, double sSaldo)

{

ViewBag.sNumeroTarjeta = sNumeroTarjeta;

ViewBag.sSaldo = sSaldo;

return View();

}

[HttpPost]

public ActionResult Nacionales(string sNumeroTarjeta, double sSaldo,double cantidad)

{

double Saldo;

//Se crea una instancia de la clase transacción y se le envían dos parámetros

transaccion nuevaTransaccion = new transaccion(sNumeroTarjeta, sSaldo);

if (cantidad > 0)

{

nuevaTransaccion.transferenciaNacional(cantidad);

}

sSaldo = nuevaTransaccion.getSaldo();

ViewBag.sNumeroTarjeta = nuevaTransaccion.sNumeroTarjeta;

ViewBag.sSaldo = nuevaTransaccion.getSaldo();

return Redirect("../Menu/Menu?sNumeroTarjeta=" + sNumeroTarjeta + "&sSaldo=" + sSaldo);

}

}

}

22. Tome como base los pasos 12 al 14 de este procedimiento, para crear una nueva vista para el controlador anterior (NacionalesController), luego, digite el siguiente código en el archivo correspondiente Nacionales.cshtml.

@{

ViewBag.Title = "Nacionales";

}

@{

var bancos = new List<SelectListItem>(){



new SelectListItem { Text = "Banco Agrícola", Value = "0" },

new SelectListItem { Text = "Banco de América Central", Value = "1" },

new SelectListItem { Text = "Banco Davivienda", Value = "2", Selected = true },

new SelectListItem { Text = "Banco Cuscatlan", Value = "3" }

};

}


<h2>Bienvenido</h2>





<div class="credenciales">


<label class = "etiqueta">Tarjeta #:</label>

<label class="control">@ViewBag.sNumeroTarjeta</label>

</div>



<label class="etiqueta">Saldo:</label>

<label class="control">@ViewBag.sSaldo</label>

</div>



@Html.DropDownList("misbancos",bancos);

</div>


@Html.Label("Cantidad:", new { @class = "etiqueta" });

@Html.Editor("cantidad", "", new { @class = "control" });

</div>


<button type="submit" ID="btnEntrar" CssClass="submit" runat="server" onclick="location.href('@Url.Action("NacionalesNuevo", "Nacionales")')">Ingresar</button>

</div>


</div>

@using (Html.BeginForm())

{


<label class="error">@ViewBag.Error</label>

</div>

}

</article>



<nav class="right">

<ul>

<li>

@Html.ActionLink("Transferencias nacionales", "someaction", "somecontroller", new { id = "123" }, null)

</li>

<li>

@Html.ActionLink("Transferencias internacionales", "someaction", "somecontroller", new { id = "123" }, null)

</li>

<li>

@Html.ActionLink("Pagos de Servicios", "someaction", "somecontroller", new { id = "123" }, null)

</li>

<li>

@Html.ActionLink("Verificar saldos", "someaction", "somecontroller", new { id = "123" }, null)

</li>

</ul>

</nav>

23. Para probar los cambios realizados al sitio web, vaya al Explorador de soluciones y abra la carpeta Views -

>Home. Seleccione y abra al archivo de la Vista de inicio (Index.cshtml).

Luego, seleccione el navegador de su preferencia y ejecute el sitio web.

24. Para identificar el usuario y contraseña para acceder a la siguiente Vista del sitio, abra al archivo de la clase HomeController y analice su cod. fuente.

Cuando acceda con las credenciales esperadas, la próxima Vista a cargar será la de Menu, asi:



25. Del menú de enlaces, seleccione la opción Transferencias nacionales, para comprobar cómo funcionan las Vistas de esta opción.

26. Tomando como base nuestra página de “Nacionales”, crear un nuevo Controlador y Vista para las transferencias internacionales. Debe funcionar tal como se muestran en las imágenes a continuación:



27. Realizar una página y un controlador para mostrar el saldo de nuestra cuenta, tal como se muestra en la imagen siguiente (la opción Verificar saldos):

28. Ahora, proceda a ejecutar la aplicación y realice las respectivas transacciones verificando la integridad de la información.

V. DISCUSIÓN DE RESULTADOS

1. Cree los archivos y el código necesario para que la aplicación tenga habilitada la opción de Pago de Servicios, creando una página que contenga un control de lista desplegable con las opciones: Energía Eléctrica, Colegiaturas, Servicios de Alcantarillado, Servicios de Telefonía. Además, una caja de texto para el ingreso del monto.

2. Una vez el usuario realiza el pago del servicio, descontar dicho monto del saldo total y mostrarle al usuario el nombre del servicio cancelado, el monto cancelado y el nuevo saldo.

VI. BIBLIOGRAFÍA

1. Thierry GROUSSARD. (2013). C# 5: Los fundamentos del lenguaje – Desarrollar con Visual Studio 2012 . Barcelona: ENI.

universidad don bosco facultad de estudios … · guía #7: introducción al desarrollo de...

Documents