Scribd Logo
Importer

Bienvenue sur Scribd !

  • Guia1 2018

    Transféré par

    Gina Huertas
    23 vues9 pages
    asp.net

    Titre original

    GUIA1_2018

    Copyright

    © © All Rights Reserved

    Formats disponibles

    DOC, PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document
    asp.net

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme DOC, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    23 vues9 pages

    Guia1 2018

    Transféré par

    Gina Huertas
    asp.net

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme DOC, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 9

    I.S.T.P.

    ”Argentina” Taller de Programación Web VI – A-B Diurno

    Guía De Laboratorio Nº 01
    Semana 01 del… al …. Agosto del 2018

    INTRODUCCION A LA PLATAFORMA DE ASP.NET


    Objetivos
    Luego de completar este laboratorio, el estudiante será capaz de:
     Conocer y manejar el nuevo entorno de ASP.NET
     Implementar código lado cliente
     El alumno implementara APLICACIONES WEB con codigo HTML y funciones en Script

    Creación de un proyecto ASP.NET con Visual Studio

    Veremos como crear una aplicación web con Asp net utilizando el entorno de Visual Studio, crearemos una simple
    aplicacion, un clasico hola mundo, que nos mostrara el proceso y dudas al crear una aplicación web en esta plataforma,
    veremos desde el proceso de inicio de nuestra aplicacion hasta como poder ver el resultado final de nuestra aplicación. Asp net
    (active server pages) es un framework para aplicaciones web desarrollado por Microsoft, con el puedes construir páginas web
    dinámicas, aplicaciones web y servicios web XML. Visual studio incluye características nuevas para mejorar el desarrollo web,
    ya que el desarrolo de aplicaciones web y webs dinámicas no es una tarea sencilla, visual studio facilita enormemente esta
    tarea. Veamos entonces el como crear una aplicación web con asp.net . Para lo cual desarrollamos los siguientes pasos:
    1. Abrimos Visual Studio .NET y creamos un nuevo proyecto web.
    2. Seleccionamos el tipo de proyecto que deseamos realizar.
    a. Seleccionamos ASP.NET Web Site.
    b. Indicamos la ruta donde vamos a guardar el proyecto: d:\TallerWebVIAoB\WebSiteGuia1
    c. Determinamos el lenguaje que vamos a utilizar: Visual C#.
    d. Por último presionamos el botón OK para crear la solución.

    Pág # 1 Prof. Gina Huertas Camacho


    I.S.T.P.”Argentina” Taller de Programación Web VI – A-B Diurno

    3. Agregar un WebForm

    Sitio Web/Agregar nuevo elemento/WebForm

    En el webform escribimos

    Pág # 2 Prof. Gina Huertas Camacho


    I.S.T.P.”Argentina” Taller de Programación Web VI – A-B Diurno

    Ejercicio 1
    Crear una pagina web , solo con código HTML
    que nos permita visualizar el texto Bienvenido
    a ASP.NET en 6 tamaños distintos de fuente

    Código
    Agrega el sgte. Código en la sección BODY
    <body>
    <form id="form1" runat="server">
    <div>
    <h3>Mi Primera Aplicacion Web </h3>
    <% int i ;
    for (i=0;i<=7;i++ ){%>
    <center>
    <font size="<%=i%>">Bienvenido a ASP.NET </font>
    </center>
    <br>
    <%}%>
    </div>
    </form>
    </body>
    Ejercicio 2
    ASP permite el programador intercalar fragmentos de código de scripting
    dentro del código HTML.Esta scripting código puede ser escrito en un
    script lenguaje como JavaScript o VBScript (lado cliente ) o c# ,vb (lado
    servidor) etc

    En la etiqueta Form
    <form id="form1" runat="server">
    <div>
    Ingrese Nombre : <input type ="text" runat ="server" id="nombre" />
    <div id="etiqueta" runat ="server"> </div>
    <div>
    <input id="Button1" type ="button" runat ="server" onserverclick ="saludo"
    value="SALUDO"/>
    </div>
    </form>

    En La sección head agregar


    <head runat="server">
    <title></title>
    <script language ="C#" runat ="server">
    void saludo(Object origen,EventArgs args ){
    etiqueta.InnerText ="hola " + nombre.Value;
    }
    </script>
    </head>
    Pág # 3 Prof. Gina Huertas Camacho
    I.S.T.P.”Argentina” Taller de Programación Web VI – A-B Diurno

    Finalmente muestre la pagina ingrese nombre y observe el sgte. Resultado

    Ejercicio 3
    Crear con código HTML una página como la muestra, además agregar una marquesina

    Cód
    igo
    Agregar en la etiqueta <body> la marquesina y en la etiqueta <form>
    <body>
    <marquee behavior="scroll" bgcolor="#ffffcc">I.S.T.P."Argentina"</marquee>
    <form id="form1" runat="server" >
    <div>
    Nombre : <input id="nombre" type="text" runat ="server" >
    Categorias
    <select id="Categoria" size="1" runat="server">
    <option>Psicologia</option>
    <option>Negocios</option>
    <option>Computacion</option>
    </select>

    <input type="submit" value="busqueda" onserverclick="mostrar" runat


    ="server" >
    <p id="p1" runat="server"></p>
    </div>
    </form>
    </body>

    En la sección head
    <head runat="server">
    <title></title>
    <script runat ="server" runat ="server" >
    void mostrar(Object o, EventArgs a){
    p1.InnerText = " Bienvenido(a): "+ nombre.Value+" a " + Categoria.Value;
    }
    </script>

    </head>

    Pág # 4 Prof. Gina Huertas Camacho


    I.S.T.P.”Argentina” Taller de Programación Web VI – A-B Diurno

    Crear una página Web con controles HTML que


    permita ingresar los datos completos de una alumna
    y al dar clic en el boton muestre un mensaje de
    bienvenida para el alumno.

    Código
    En la sección head agrega
    <script runat =”server”>
    sub submit(sender As object, e As eventArgs)
    p1.InnerHtml="<b> Bienvenido(a): </b> " &textarea1.value
    end sub
    </script>
    En la seccion Form agregar
    <form id="Form1" method="post" runat="server">
    Ingresa nombre apellido completo Sección <textarea id="textarea1" cols="36" rows="2" runat="server"
    NAME="textarea1"></textarea>
    <input type="submit" value="Submit" OnServerClick="submit" runat="server" ID="Submit1" NAME="Submit1">
    <p id="p1" runat="server"></p>
    </form>

    Ejercicio 4

    Agregar en un Webform los siguientes controles de


    servidor web (cuadro de herramientas) y luego crear un
    evento que muetre el codigo y categoría seleccionado

    Código
    Agregar los controles del cuadro de herramientas

    Pág # 5 Prof. Gina Huertas Camacho


    I.S.T.P.”Argentina” Taller de Programación Web VI – A-B Diurno

    En la sección html agregar


    <script language="vb" runat="server">
    sub boton_click (byval sender as object, byval e as EventArgs)
    lblmensaje.text="Hola "+ me.txtcodigo.text & " , ha seleccionado: " + _
    me.DdlCategorias.selecteditem.text
    end sub
    </script>
    En la etiqueta HTML del Button AGREGAR OnClick="Boton_click"
    asp:Button id="Button1" runat="server" Text="Busqueda" OnClick="Boton_click"></asp:Button>

    Pág # 6 Prof. Gina Huertas Camacho


    I.S.T.P.”Argentina” Taller de Programación Web VI – A-B Diurno

    Ejercicio 4
    Diseñar un formulario web que mediante una
    funcion en javascript calcule la suma de 2 numeros
    ingresados por el usuario

    Agregar en la seccion head el

    siguiente script
    <SCRIPT LANGUAGE=JavaScript>
    <!--
    function sumar(a, b) {
    var valor1 = 0;
    var valor2 = 0
    valor1 = parseInt( a.value )
    valor2 = parseInt( b.value )
    resultado = valor1 + valor2
    document.write("la suma es : " ,resultado) Como puedes ver, aquí utilizamos
    Document.Write() (un objeto del IE, junto
    return sumar con uno de sus métodos), que es
    equivalente al objeto de ASP
    } Response.Write(), y que sirve para
    // --> escribir en la ventana del navegador
    cualquier resultado generado por el
    </SCRIPT> código.
    Codigo de la seccion form
    <h1>SUMA DE NUMEROS</h1>
    Ingrese numero 1 <INPUT TYPE="text" NAME="campo1" id="Text1" ><br>
    ingrese numero 2<INPUT TYPE="text" NAME="campo2" id="Text2" ><br>
    <input type="button" name="Button1" value="Presióneme" onclick="sumar(campo1,campo2)"> <br>

    Pág # 7 Prof. Gina Huertas Camacho


    I.S.T.P.”Argentina” Taller de Programación Web VI – A-B Diurno

    WEBFORM 5
    Ahora agregemos texto en la barra de estado, (la barra enl a parte inferior de su browser donde
    se ven las URL's)
    Este script muestra como se puede escribir un
    simple texto en la barra de estado:

    Codigo en
    headº

    <script language="JavaScript">
    <!-- Hide
    function statbar(txt) {
    window.status = txt;
    }
    // -->
    </script>
    <SCRIPT FOR="Boton1" EVENT="onClick"
    LANGUAGE="VBScript">
    window.close

    </script>

    Codigo de la sección form


    <input type="button" name="look" value="Escribir!" onclick="statbar('Hola! esta es la barra de estado!');">
    <input type="button" name="erase" value="Borrar!" onclick="statbar('');">
    <INPUT TYPE="button" NAME="Boton1" VALUE="cerrar" id="Button1"

    WEBFORM 6

    Diseñar un webform que muestre un scroller en la barra


    de estado

    <script language="JavaScript">
    <!-- Hide

    var scrtxt="Aqui va el mensaje, los visitantes de su pagina "+

    Pág # 8 Prof. Gina Huertas Camacho


    I.S.T.P.”Argentina” Taller de Programación Web VI – A-B Diurno

    "la veran por horas totalmente fascinados...";


    var lentxt=scrtxt.length;
    var width=100;
    var pos=1-width;
    function scroll() {
    pos++;
    var scroller="";
    if (pos==lentxt) {
    pos=1-width;
    }
    if (pos<0) {
    for (var i=1; i<=Math.abs(pos); i++) {
    scroller=scroller+" ";}
    scroller=scroller+scrtxt.substring(0,width-i+1);
    }
    else {
    scroller=scroller+scrtxt.substring(pos,width+pos);
    }
    window.status = scroller;
    setTimeout("scroll()",150);
    }
    //-->
    </script>
    En la sección body
    <body onLoad="scroll();return true;">
    Este script usa las mismas funciones (o parte de ellas) que usamos antes. El setTimeout(...) le dice al 'timer' que invoque la
    función scroll() cuando el tiempo es el justo. El scroller se moverá un paso mas adelante. Al comienzo hay muchos cálculos pero
    esto no es muy importante para saber como funciona el script. Los cálculos se hacen para determinar la posicióon donde el
    scroller debe arrancar. Si se ubica solo al comienzo se deben poner unos espacios en blanco para ubicar el texto correctamente

    Pág # 9 Prof. Gina Huertas Camacho

    Vous aimerez peut-être aussi