Guida Aspnet. Lezione 4 Visual Earth

Iniziamo l’introduzione ai controlli Server con l’aggiunta del comando label, quindi aprite il Personal Portal e introducete il comando label che trovate nella colonna di sinistra del vostro Visual Web Developer, nella sezione standard una volta introdotto digitate proprieta e vedete questa volta nella colonna di destra tutte le proprietà che potete modificare.

Niente di piu’ semplice.

I Controlli Server Aspnet

Incominciamo adesso a creare un menu di navigazione per il nostro sito. Quindi facciamo i seguenti passi.

  1. Clic destro sul progetto in Esplora Soluzioni e seleziona Aggiungi nuovo elemento.
  2.  Seleziona Mappa del Sito nel campo name digita Web in modo da creare web.sitemap che potrai vedere su Esplora Soluzioni.

 

se tutto è andato a buon fine troverete il seguente codice relativo

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="" title="" description="">
<siteMapNode url="" title="" description="" />
<siteMapNode url="" title="" description="" />
</siteMapNode>
</siteMap>

 

come potete vedere si tratta di un campo xml in cui dovere e potere inserire i valori, facciamo il seguente esempio, modificate il file in modo da ottenere

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="~/Default.aspx" title="Home" description="">
<siteMapNode url="~/Admin/ChangePassword.aspx" title="Change Password" description="Change Your Password" />
<siteMapNode url="" title="" description="" />
</siteMapNode>
</siteMap>

 

Come vedete abbiamo descritto il nodo radice e i sottonodi alla radice. D’ora in avanti ogni volta che dvete aggiungere una nuova voce di menu per puntare a una pagina del sito, aprite questo file XML e modfificatelo di conseguenza.

 

 

I comandi di Visual Earth

Visual Earth di Aspnet

Sicuramente ne’ avete gia’ sentit parlare, se ancora non l’avete fatto è sicuramente questa un’ottima occasione per introdurla, stiamo parlando di una tecnologia totalmente made in microsoft chiamata Visual Earth, molt comoda se avete un’azienda e volete abbellire il vostro sito.

Andate all’indirizzo

http://www.bing.com/maps/

non è lo scopo di questa guida spiegarvi dettagliatamente cosa sia virtual earth cmq chi desidera saperne di piu’ puo’ visitare il sito

http://dev.live.com/virtualearth/sdk/

Vediamo dunque come integrarlo nel nostro sito web. In pratica bisogna referenziare la pagina e si fa nel seguente modo

<script type="text/javascript"

src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6"> </script>

 

aggiungiamo anche un p’ di codice javascript in mdo da potere utilizzare megli la mappa,

var map = null;

function GetMap()

{


map = new VEMap('myMap');

map.LoadMap(null, 10, 'h', false);




}

 

 

 

 

l’oggetto VEMap e LoadMap esulano lo scopo di questa guida cmq sono i comandi per potere caricare determinate porzioni della mappa.

A questo punto modifichiamo il body in modo tale che la funzione GetMap venga caricato con la pagina e facciamo

<body onload="GetMap(); ">

 

queste due porzioni di codice vanno inserite nel personal Portal in modo tale che alla fine il codice risulti il seguente.

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="PersonalPortal.master.cs" Inherits="PersonalPortal" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>

<script type="text/javascript"

src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6"> </script>

<script type ="text/javascript" >
var map = null;

function GetMap() {


map = new VEMap('myMap');

map.LoadMap(null, 10, 'h', false);




}




</script>

<style type="text/css">
.style1
{
width: 100%;
}
.style2
{
height: 23px;
}
</style>
</head>
<body onload="GetMap(); ">


<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">




</asp:ContentPlaceHolder> 


<table class="style1">
<tr>
<td>

<asp:LoginStatus ID="LoginStatus1" runat="server" />
</td>
<td>
<asp:Login ID="Login1" runat="server">
</asp:Login>
</td>
</tr>
<tr>
<td>
&nbsp;</td>
<td>
&nbsp;</td>
</tr>
<tr>
<td colspan="2" class="style2">
<asp:Label ID="Label1" runat="server" Font-Bold="True" 
Text="Questo Sito è di proprietà esclusiva mia "></asp:Label>
</td>
</tr>
</table>


</div>
<asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1">
</asp:Menu>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
</form>
</body>
</html>

 

manca un ultima aggiunta e finalmente potremmo andare a vedere il risultat finale

 

e apriamo il nostro default.aspx nel seguente modo

<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile ="~/MasterPages/PersonalPortal.master" CodeFile="~/Default.aspx.cs" Inherits="_Default" %>

<asp:Content ID="SomeContent" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

<div id='myMap' style ="position:relative; width:600px; height:400px" > </div>
</asp:Content>

 

come potete vedere nel div id abbiamo richiamato myMap che è l’oggetto che abbiamo istanziato prima nel Javascript.

 

Ma possiamo fare molto di piu’ sempre andando a leggere la documentazione di Visual Earth ci accorgiamo anche della presenza della funzione Find e quindi andiamo ad utilizzarla nel seguente modo aggiungendo nel JavaScript la seguente riga di comando.

map.Find (null, 'Rome' );

 

 

Cercare su Visual Earth dove e cosa

 

 

 

Facciamo un ulteriore passo in avanti e introduciamo un testo per potere poi ricercare una località specifica.

vediamo come modifichiamo il personalportal introducendo la funzione Find nel seguente modo

 

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="PersonalPortal.master.cs" Inherits="PersonalPortal" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>

<script type="text/javascript"

src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6"> </script>

<script type ="text/javascript" >
var map = null;

function GetMap() {


map = new VEMap('myMap');

map.LoadMap(null, 10, 'h', false);




map.Find(null, 'Rome');

}


function Find(what, where) {

try
{
map.Find(what, where);
}

catch(e) {
alert (e.message);
}

}

</script>

<style type="text/css">
.style1
{
width: 100%;
}
.style2
{
height: 23px;
}
</style>
</head>
<body onload="GetMap(); ">


<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">




</asp:ContentPlaceHolder> 


<table class="style1">
<tr>
<td>

<asp:LoginStatus ID="LoginStatus1" runat="server" />
</td>
<td>
<asp:Login ID="Login1" runat="server">
</asp:Login>
</td>
</tr>
<tr>
<td>
&nbsp;</td>
<td>
&nbsp;</td>
</tr>
<tr>
<td colspan="2" class="style2">
<asp:Label ID="Label1" runat="server" Font-Bold="True" 
Text="Questo Sito è di proprietà esclusiva mia "></asp:Label>
</td>
</tr>
</table>


</div>
<asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1">
</asp:Menu>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
<br />
&nbsp;&nbsp;&nbsp;
</form>


</body>
</html>

e il default.aspx come segue

<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile ="~/MasterPages/PersonalPortal.master" CodeFile="~/Default.aspx.cs" Inherits="_Default" %>

<asp:Content ID="SomeContent" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

<div id='myMap' style ="position:relative; width:600px; height:400px" > </div>

<p>
What
<input id="txtWhat" type="text" name="txtWhat" /></p>


<p>
Where
<input id="txtWhere" type="text" name="txtWhere" /></p>

<p>
Sottometti
<input id="find" type="button" value ="Find" name="find" onclick="Find(TxtWhat.value, txtWhere.value);"
/></p>


</asp:Content>

 

Come potete vedere abbiamo modificato il default introducendo dei tag html come input txtwhat e txtwhere, digitando il bottone find questi valori che abbiamo inserito vengono passati alla funzione Find che farà’ il gioco ossia trovare il luogo ricercato.

 

Debug Codice Aspnet

Debugging (o semplicemente debug) è un’attività che consiste nella individuazione della porzione di software affetta da errore (bug) rilevati nei software a seguito dell’utilizzo del programma.

Dobbiamo pero’ introdurre subito una limitazione e cioe’il debugging di visual web developer è possibile sol con Microsoft Internet Explorer.

 

Quindi avviamo IE andiamo su Strumenti, Options dal menu, cliccare su avanzate, deselezionare disattiva script debugging

Torniamo al progetto VWB andiamo su Esplora Soluzioni, teniamo selezionat C:\…| e click tasto destro scegliamo Pagina delle proprietà e da qui opzioni di avvio, a questo punto deselezionare se gia’ non lo è la casella ASP.NET e quindi digitare invio.

E viene eseguito il debugging del sito per intero altrimenti si potra’ scegliere anche di fare debugging pass passo, riga riga. Scegliamo infatti dal menu F11 per eseguire ogni istruzione passo per passo.

Una tecnica piu’ avanzata per analizzare il Javascript è quella dei break point ossia mettere dei Toggle Breakpoint attraverso il tasto F9 ed analizzare solamente spezzoni di codice

 

Guida Linguaggio di programmazione Aspnet
Guida al linguaggio di programmazione Aspnet Aspnet

 

Lezione 1. Introduzione ad Aspnet

 

Lezione 2. Il Tool di Amministrazione di Aspnet

 

Lezione 3. Pagine Master

 

Lezione 4. Visual Earth

 

Lezione 5. Microsoft Sql Server

 

Lezione 6. Interfaccia Aspnet e dataset MS Sql

 

Lezione 7. I Fogli di Stile CSS

 

Lezione 8. I Mashup

 

Lezione 9. I Dataset e i Datareader

 

Lezione 10. Eventi di Pagina Asnet

 

Lezione 11. Il DataBinding

 

Lezione 12. Linq

 

Lezione 13. Validazione Aspnet
Aprile 2024
L M M G V S D
1234567
891011121314
15161718192021
22232425262728
2930