Wst p 5 Rozdzia 1. Szybki start 9



Podobne dokumenty
Technologie ASP.NET i ADO.NET w Visual Web Developer

Microsoft Management Console

STRONA GŁÓWNA SPIS TREŚCI. Zarządzanie zawartością stron... 2 Tworzenie nowej strony... 4 Zakładka... 4 Prawa kolumna... 9

Pracownia internetowa w szkole podstawowej (edycja 2004)

I. Zakładanie nowego konta użytkownika.

Użytkowanie elektronicznego dziennika UONET PLUS.

Metody opracowywania dokumentów wielostronicowych. Technologia Informacyjna Lekcja 28

Aplikacje internetowe i rozproszone - laboratorium

Instalacja. Zawartość. Wyszukiwarka. Instalacja Konfiguracja Uruchomienie i praca z raportem Metody wyszukiwania...

Firma Informatyczna JazzBIT

dbsamples.udl lub przygotowany wcześniej plik dla Excela) i OK,

Instalacja i konfiguracja automatu synchronizacji CDN OFFLINE

GEO-SYSTEM Sp. z o.o. GEO-RCiWN Rejestr Cen i Wartości Nieruchomości Podręcznik dla uŝytkowników modułu wyszukiwania danych Warszawa 2007

Kancelaris - Zmiany w wersji 2.50

Wtedy wystarczy wybrać właściwego Taga z listy.

INSTRUKCJA PROGRAMU BHM SPIS TREŚCI

Archiwum Prac Dyplomowych

Rozliczenia z NFZ. Ogólne założenia. Spis treści

INTERAKTYWNA APLIKACJA MAPOWA MIASTA RYBNIKA INSTRUKCJA OBSŁUGI

Nowe funkcjonalności

INSTRUKCJA KORZYSTANIA Z ELEKTRONICZNEJ ŚCIEŻKI WYKAZÓW

Zarządzanie Zasobami by CTI. Instrukcja

Przeniesienie lekcji SITA z płyt CD na ipoda touch

Instrukcja obsługi platformy zakupowej e-osaa (klient podstawowy)

SINAMICS G120C STARTER. Tworzenie nowego projektu w trybie online.

Miejski System Zarządzania - Katowicka Infrastruktura Informacji Przestrzennej

Specyfikacja techniczna banerów Flash

Przekształcenie danych przestrzennych w interaktywne mapy dostępne na stronach www (WARSZTATY, poziom podstawowy)

Zdalne odnawianie certyfikatów do SWI

WF-FaKir dla Windows

Instrukcja instalacji oraz wykorzystania podpisu cyfrowego

INSTRUKCJA DO PROGRAMU LICZARKA 2000 v 2.56

INFORMATOR TECHNICZNY WONDERWARE

INSTRUKCJA Panel administracyjny

System Informatyczny CELAB. Przygotowanie programu do pracy - Ewidencja Czasu Pracy

Zmiany w programie C GEO v. 6.5

Symfonia Produkcja Instrukcja instalacji. Wersja 2013

Platforma zamówień personelu JOBMAN.pl

Instrukcja wprowadzania ocen do systemu USOSweb


enova Workflow Obieg faktury kosztowej

Konfiguracja programu Outlook 2007 do pracy z nowym serwerem poczty (Exchange)

System zarządzania bazą danych (SZBD) Proces przechodzenia od świata rzeczywistego do jego informacyjnej reprezentacji w komputerze nazywać będziemy

Centrum Informatyki "ZETO" S.A. w Białymstoku. Instrukcja użytkownika dla urzędników nadających uprawnienia i ograniczenia podmiotom w ST CEIDG

SKRÓCONA INSTRUKCJA OBSŁUGI ELEKTRONICZNEGO BIURA OBSŁUGI UCZESTNIKA BADANIA BIEGŁOŚCI

1. Korzyści z zakupu nowej wersji Poprawiono Zmiany w słowniku Stawki VAT Zmiana stawki VAT w kartotece Towary...

Spis treści. Rozdział 1 ewyniki. mmedica - INSTR UKC JA UŻYTKO W NIKA

Moduł. Rama 2D suplement do wersji Konstruktora 4.6

SZABLONY KOMUNIKATÓW SPIS TREŚCI

PERSON Kraków

INSTRUKCJA WebPTB 1.0

INTENSE BUSINESS INTELLIGENCE PLATFORM

MySource Matrix CMS - PROSTY INTERFEJS UŻYTKOWNIKA. INSTRUKCJA ver 1.2

VinCent Office. Moduł Drukarki Fiskalnej

Spis tre ci. Zawarto :

INFORMATOR TECHNICZNY WONDERWARE. Konfiguracja komputera klienckiego do łączenia się z serwerem IndustrialSQL

ECDL Advanced Moduł AM3 Przetwarzanie tekstu Syllabus, wersja 2.0

Opis obsługi systemu Ognivo2 w aplikacji Komornik SQL-VAT

Co nowego w systemie Kancelaris 3.31 STD/3.41 PLUS

Instrukcja obsługi Norton Commander (NC) wersja 4.0. Autor: mgr inż. Tomasz Staniszewski

OPIS SYSTEMU. Wersja podstawowa:

Pracownia internetowa w szkole podstawowej (edycja 2004)

Dynamiczna pomoc dla Edytora Tekstu.

Zestaw skróconych instrukcji dotyczący najważniejszych operacji w programie Merkury Quattro.

Opis zmian funkcjonalności platformy E-GIODO wprowadzonych w związku z wprowadzeniem możliwości wysyłania wniosków bez podpisu elektronicznego

SINAMICS G120C STARTER. Tworzenie nowego projektu w trybie offline.

CitiDirect EB - Mobile

Wdrożenie modułu płatności eservice dla systemu Virtuemart 2.0.x

Instrukcja. 1 Zamawiając kuriera. W Paczkomacie lub POK. 3 Nadając list polecony. nadawania przesyłek z Allegro: (Punkt Obsługi Klienta)

Instrukcja obsługi Zaplecza epk dla Pracowników Instytucji w zakresie administracji danymi instytucji

Opis Najważniejsze cechy modułu: Predefiniowane opcje wysyłki Rozszerzony podgląd zamówień... 2

JMMS Instrukcja użytkowania kont Autor oraz Recenzent

Spring MVC Andrzej Klusiewicz 1/18

Ramki tekstowe w programie Scribus

Instrukcja pod czenia komputera z systemem Microsoft Windows XP do sieci PWSZ-FREE-WIFI

Audyt SEO. Elementy oraz proces przygotowania audytu. strona

Technologie internetowe Internet technologies Forma studiów: Stacjonarne Poziom kwalifikacji: I stopnia. Liczba godzin/tydzień: 2W, 2L

I. INSTALACJA BAZY DANYCH ORACLE10g EXPRESS EDITION

Centrum Informatyki "ZETO" S.A. w Białymstoku. Obsługa licencji, zaświadczeń i zezwoleń transportowych w systemie ProcEnt Licencje

emszmal 3: Automatyczne księgowanie przelewów w sklepie internetowym Magento (plugin dostępny w wersji ecommerce)

Pracownia internetowa w ka dej szkole (edycja 2004/2005)

Ćwiczenie 6.5. Otwory i śruby. Skrzynia V

ATEKO, s.r.o. E-learning. Instrukcje dla studentów

Posiadane punkty lojalnościowe można również wykorzystać na opłacenie kosztów przesyłki.

Poniżej instrukcja użytkowania platformy

Program Płatnik Instrukcja instalacji

Zmiany w wersji 1.18 programu VinCent Office.

Fabian Stasiak. Przyk adowe wiczenie z podr cznika: Zbiór wicze. Autodesk Inventor Kurs podstawowy.

Platforma Aukcyjna Marketplanet. Podręcznik Oferenta. Aukcja dynamiczna zniŝkowa

Konfiguracja historii plików

Jak spersonalizować wygląd bloga?

Instrukcja programu PControl Powiadowmienia.

Krok po kroku czyli jak zbudować własne strony WWW.

Pracownia internetowa w każdej szkole (edycja Jesień 2007)

Pracownia internetowa w każdej szkole. Opiekun pracowni internetowej SBS 2003 PING

emszmal 3: Eksport wyciągów do Subiekt (Su\Re\Ra) nexo (plugin dostępny wraz z dodatkiem Biznes)

Polecenie HYPERLINK wstawia hiperpołączenia, umożliwia ich modyfikację oraz usuwanie

Aktualizacja CSP do wersji v7.2. Sierpień 2014

Opis programu EKSoft Rezerwacje

Transkrypt:

Spis tre ci Wst p 5 Rozdzia 1. Szybki start 9 Tworzenie projektu pierwszej strony ASP.NET 10 Projektowanie interfejsu strony 11 Edycja kodu w pliku.aspx 15 Programowanie silnika strony ASP.NET 17 Walidacja danych 20 Rozdzia 2. Praktyka projektowania stron ASP.NET 25 Wzorzec strony (master page) 25 Site map i komponent SiteMapPath 31 Dwa s owa na temat kaskadowych arkuszy stylów 36 Czas ycia sesji i aplikacji ASP.NET 40 Sesja i dane sesji 41 Pliki cookies 45 Dane aplikacji 46 AJAX dla ASP.NET 49 Cz ciowa aktualizacja strony 50 AJAX Control Toolkit 57 Rozdzia 3. ASP.NET, ADO.NET i LINQ 67 Moc ADO.NET 68 SQL Server 2005 70 Microsoft Access 76 Bardzo krótki wst p do j zyka SQL 80 Modyfikacje danych z poziomu aplikacji ASP.NET 82 LINQ to SQL 92

4 A S P. N E T w V i s u al Web Developer 2008 wiczenia Rozdzia 4. Studium przypadków: strona domowa nauczyciela 103 Dane witryny i konta u ytkowników 109 Baza danych 111 Autoryzacja 114 Strony nauczyciela 118 Prezentacja ocen 134 Ksi ga go ci 136 Rozdzia 5. Publikowanie aplikacji ASP.NET 143 Przygotowanie serwera IIS 144 Publikowanie witryn ASP.NET na serwerze IIS 149

2 Praktyka projektowania stron ASP.NET Wzorzec strony (master page) W przypadku witryny zawieraj cej kilka stron warto pos u y si wzorcem. Wzorzec (ang. master page) to zwyk a strona ASP.NET zapisana do pliku z rozszerzeniem.master. Wyró nia j jednak to, e zawiera komponenty ContentPlaceHolder, które rezerwuj miejsce do wype nienia przez strony korzystaj ce ze wzorca. Poza tym wzorzec mo e zawiera zwyk e elementy HTML, jak i komponenty ASP.NET. Wzorzec s u y jako szablon pozosta ych stron projektu. Tworz c nowe strony projektu, mo emy wskaza ich wzorzec, a wówczas w widoku projektowania, zamiast edytowa ca stron, b dziemy edytowa jedynie te miejsca, które we wzorcu zosta y zarezerwowane komponentami ContentPlaceHolder. W najprostszym przypadku mo na pos u y si wzorcem do ujednolicenia nag ówków i stopek wszystkich stron witryny wówczas wzorzec zawiera tylko jeden komponent ContentPlaceHolder. I w a nie na takim przyk adzie nauczymy si teraz tworzenia wzorców i korzystania z nich.

26 A S P. N E T w V i s u al Web Developer 2008 wiczenia 2.1 Przygotowywanie projektu Dodanie wzorca do projektu i zastosowanie go w odniesieniu do istniej cych stron jest mo liwe, ale wymaga edycji szablonu strony. Od o- ymy to zatem na pó niej, a teraz utworzymy zupe nie nowy projekt, w którym pierwsz czynno ci b dzie usuni cie domy lnie utworzonej strony Default.aspx. Nast pnie zdefiniujemy wzorzec i utworzymy korzystaj ce z niego strony. 1. Tworzymy nowy projekt: a) z menu File wybieramy New Web Site, b) zaznaczamy pozycj ASP.NET Web Site, c) z rozwijanej listy Location wybieramy File System (warto domy lna), d) a z rozwijanej listy Language Visual C#, e) klikamy OK. 2. Z projektu usuwamy stron Default.aspx: a) zaznaczamy j w oknie projektu (podokno o nazwie Solution Explorer), b) rozwijamy menu kontekstowe, c) wybieramy z niego polecenie Delete, d) pojawi si pytanie o potwierdzenie, w którym klikamy przycisk OK. To usunie plik strony nie tylko z projektu, ale tak e z dysku. W tym miejscu umie cimy now wersj strony o nazwie Default.aspx, ale korzystaj c ze wzorca. Wcze niej musimy oczywi cie przygotowa wzorzec. Nie b dziemy w tym zbyt wymy lni zdefiniujemy prosty nag ówek oraz stopk strony i zadowolimy si jednym komponentem Content PlaceHolder. Nie nale y myli usuwania pliku (tak e z dysku), a wi c polecenia Delete, z usuwaniem pliku z projektu, tj. z poleceniem Exclude From Project.

R o z d z i a 2. Praktyka projektowania s t r on ASP.NET 27 2.2 Definiowanie wzorca 1. W oknie projektu zaznaczamy g ówn ga reprezentuj c projekt ca ej witryny (a nie katalog App_Data). 2. Z menu File wybieramy New File. 3. W oknie Add New Item (rysunek 2.1) zaznaczamy pozycj Master Page. Rysunek 2.1. Polecenie dodawania pliku jest czu e na zaznaczon pozycj w oknie projektu aby zobaczy wszystkie mo liwe rodzaje plików, nale y zaznaczy pozycj odpowiadaj c ca emu projektowi 4. Klikamy Add. Do projektu zostanie dodany nowy plik MasterPage.master. W edytorze zobaczymy jego kod. Zawiera on dwa komponenty ContentPlaceHolder: jeden w nag ówku (w znaczniku head), drugi w ciele strony (w znaczniku body). My b dziemy si teraz interesowa przede wszystkim tym drugim. 5. Przejd my do widoku projektowania nowej strony (zak adka Design w dole okna). Zobaczymy na niej komponent klasy ContentPlaceHolder ten zdefiniowany w znaczniku body.

28 A S P. N E T w V i s u al Web Developer 2008 wiczenia Rezerwuje on miejsce, które b dzie zape niane przez strony korzystaj ce z naszego wzorca. Je eli chcemy doda wi cej komponentów ContentPlaceHolder, znajdziemy je na zak adce Standard w Toolbox. 6. Umie my powy ej i poni ej tego komponentu jaki tekst pe ni cy rol nag ówka i stopki stron naszej witryny. Przyk ad widoczny jest na rysunku 2.2. Rysunek 2.2. Osadzanie komponentu ContentPlaceHolder we wzorcu witryny 2.3 Strona korzystaj ca ze wzorca Nasz wzorzec jest prosty, eby nie powiedzie prymitywny, ale nie o estetyk teraz chodzi, a o ide. Stworzymy zatem przyk adowe strony, które b d z tego wzorca korzysta. 1. Z menu File wybieramy ponownie pozycj New File. 2. Tym razem zaznaczamy ikon Web Form. 3. Koniecznie musimy zaznaczy pole opcji Select master page. Tylko w momencie tworzenia strony mo na wskaza jej wzorzec.

R o z d z i a 2. Praktyka projektowania s t r on ASP.NET 29 4. Zalecam równie zaznaczenie opcji Place code in separate file, dzi ki której ewentualne metody zdarzeniowe b d umieszczone w osobnym pliku. 5. Musimy wskaza jeszcze nazw pliku strony domy lnie jest to Default.aspx oraz j zyk u yty do programowania metod zdarzeniowych. Jak ju si pewnie Czytelnik zorientowa, w tej ksi ce zalecamy u ywanie C#. 6. Wreszcie klikamy Add. 7. Natychmiast pojawi si okno Select a Master Page. Wskazujemy w nim stron MasterPage.master i klikamy OK. Ciekawe mo liwo ci daje zagnie d anie tworzonej strony wzorca w innych wzorcach. Mo na tego u y mi dzy innymi do bardziej elastycznej kontroli wygl du stron z ró nych dzia ów jednej witryny. Po utworzeniu strony znajdziemy si w edytorze kodu. Przejd my niezw ocznie do widoku projektowania. Zobaczymy w nim stron wzorca, ale poza obszarem wyznaczonym przez komponent ContentPlaceHolder jest ona niedost pna do edycji (rysunek 2.3). Miejscem, w którym mo emy umieszcza nasze komponenty, jest wy cznie miejsce zarezerwowane wcze niej we wzorcu. Rysunek 2.3. Edycja stron korzystaj cych ze wzorca ogranicza si do obszarów wyznaczonych we wzorcu przez komponent ContentPlaceHolder

30 A S P. N E T w V i s u al Web Developer 2008 wiczenia Wype nijmy miejsce przeznaczone na stron jak przyk adow zawarto ci. Umie my w nim np. komponent HyperLink. Za pomoc okna Properties do jego w a ciwo ci ImageUrl przypiszmy adres http:// helion.pl//img/logo162_35.gif, natomiast do w a ciwo ci NavigateUrl adres http://helion.pl. Na podgl dzie powinni my zobaczy natychmiast logo Wydawnictwa Helion (por. rysunek 2.3). Mo emy stworzy teraz kolejne strony korzystaj ce z tego samego wzorca, który ujednolici ich wygl d. Wzorzec poprawia zatem spójno ca ej witryny. Nie do przecenienia jest fakt, e stopk i nag ówek wszystkich stron witryny kontrolujemy z jednego pliku, zatem je eli chcemy co do nich doda lub je zmieni, wystarczy edytowa tylko plik wzorca. 2.4 Stosowanie wzorca w istniej cej stronie Mo e si zdarzy, e zechcemy doda do rozwijanego od pewnego czasu projektu witryny wzorzec ujednolicaj cy wygl d stron. Wówczas stajemy przed problemem u ycia nowego wzorca w istniej cych ju stronach. Wymaga to od programisty modyfikacji kodu w pliku.aspx, ale jest jak najbardziej wykonalne. Za ó my zatem, e projekt zawiera wzorzec i stron nie korzystaj c ze wzorca oraz e chcemy ow stron w ten wzorzec wt oczy. Wówczas nale y: 1. Przej do pliku.aspx strony (widok Source). 2. W dyrektywie Page umie ci atrybut MasterPageFile, podaj c nazw pliku wzorca. 3. Usun wszystkie niepotrzebne znaczniki, a pozostawi tylko te, które stanowi cia o strony (samo wn trze znacznika body). 4. Sprecyzowa, w którym kontenerze umie cimy cia o strony. W tym celu wszystkie znaczniki oprócz Page trzeba umie ci w znaczniku asp:content, dla którego nale y ustawi trzy atrybuty: a) ID z dowoln warto ci, b) ContentPlaceHolderID tutaj przy ustawianiu warto ci automatycznie otrzymamy do wyboru wszystkie kontenery dost pne we wzorcu, c) runat z warto ci serwer. 5. Je eli w kodzie strony znajduje si znacznik form z atrybutem runat="server", nale y go tak e usun.

R o z d z i a 2. Praktyka projektowania s t r on ASP.NET 31 Listing 2.1 prezentuje kod strony, która zosta a stworzona bez wzorca, a nast pnie przystosowana do pokazania swojej zawarto ci (przycisk z etykiet ) w komponencie ContentPlaceHolder1 u ywanego dot d w tym rozdziale wzorca. Listing 2.1. Kod przekre lony zosta usuni ty z domy lnego kodu strony bez wzorca. Kod z szarym t em dodano, aby strona wspó pracowa a ze wzorcem <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" MasterPageFile="~/MasterPage.master" %> <!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>untitled Page</title> </head> <body> <asp:content ID="dowolna" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> <form id="form1" runat="server"> <div> </div> </form> </asp:content> </body> </html> //przyk adowa zawarto strony Etykieta:<br /> <asp:button ID="Button1" runat="server" onclick="button1_click" Text="Hello World!" /> Site map i komponent SiteMapPath Pozosta my przy tym samym projekcie i dorzu my do niego jeszcze kilka stron. Je eli witryna ma wi cej stron (mowa o kilkunastu, kilkudziesi ciu), warto pomy le o site map mapie witryny. W ASP.NET przygotowanie takiej mapy polega na utworzeniu pliku XML o nazwie Web.sitemap, w którym znajduje si zhierarchizowana grupa elementów sitemapnode. W atrybutach ka dego z nich wskazujemy adres strony

32 A S P. N E T w V i s u al Web Developer 2008 wiczenia z witryny, jej tytu i ewentualnie opis. Struktura znaczników ma odzwierciedla logiczn struktur strony, wskazuj c strony nadrz dne i ich podstrony. Ilo stopni hierarchii jest w zasadzie dowolna. W naszym projekcie jest tylko kilka stron (za ó my, e trzy: Default.aspx, Default2.aspx i Default3.aspx), ale i my zdefiniujemy plik Web.sitemap. Przyjmijmy, e Default.aspx jest stron tytu ow jakiego dzia u witryny o nazwie cza do wa nych stron, a Default2.aspx i Default3.aspx s zwyk ymi stronami tego dzia u. 2.5 Tworzenie mapy witryny (site map) 1. Z menu File wybieramy pozycj New File i w oknie Add New Item wskazujemy pozycj Site Map. 2. Powstanie plik Web.sitemap. Uzupe niamy go wed ug wzoru z listingu 2.2. Listing 2.2. Plik Web.sitemap to plik XML opisuj cy logiczn struktur witryny ASP.NET na potrzeby komponentów nawigacyjnych <?xml version="1.0" encoding="utf-8"?> <sitemap xmlns="http://schemas.microsoft.com/aspnet/sitemap-file-1.0" > <sitemapnode url="" title="nazwa witryny" description="opis witryny"> <sitemapnode url="default.aspx" title="linki do stron" description="linki do stron zwi zanych z projektem" > <sitemapnode url="default2.aspx" title="link do ASP.NET" description="linki do oficjalnej strony ASP.NET" /> <sitemapnode url="default3.aspx" title="link do MSDN" description="link do strony dokumentacji MSDN2" /> </sitemapnode> <sitemapnode url="" title="" description="" /> </sitemapnode> </sitemap> W elemencie sitemap mo e by tylko jeden element sitemapnode, wi c ewentualn rozbudow powy szej struktury nale y zacz od trzeciego poziomu zagnie d enia elementów XML. Plik Web.sitemap mo e by ród em danych dla komponentów umieszczanych na stronach, które b d pozwala internaucie na zorientowanie si w pozycji ogl danej strony w strukturze ca ej witryny i umo liwi szybkie przej cie do innych jej stron. Na pocz tek przyjrzyjmy si komponentowi SiteMapPath.

R o z d z i a 2. Praktyka projektowania s t r on ASP.NET 33 2.6 Informacja o pozycji bie cej strony w strukturze witryny 1. Przejd my do widoku projektowania wzorca MasterPage.master. 2. Umie my na nim komponent SiteMapPath z zak adki Navigation. Komponent ten pokazuje cie k aktualnej strony w strukturze zdefiniowanej w pliku Web.sitemap (rysunek 2.4). Rysunek 2.4. Dzia anie komponentu SiteMapPath jest uwarunkowane obecno ci pliku Web.sitemap. Zdefiniowane w nim opisy pojawiaj si w okienkach podpowiedzi 3. Zwró my uwag na ma y trójk cik widoczny po prawej stronie górnej kraw dzi nowego komponentu, w sytuacji gdy ten jest zaznaczony. Je eli go klikniemy, pojawi si lista typowych zada dotycz cych tego komponentu (rysunek 2.5). W tym przypadku sk ada si ona z dwóch pozycji Auto Format oraz Edit Templates. Pierwsze polecenie s u y do niemal automatycznego konfigurowania wygl du komponentu. Wybierzmy np. szablon Colorful. Rysunek 2.5. Podr czna lista zada to zbiór najcz ciej wykorzystywanych kreatorów zwi zanych z komponentem

34 A S P. N E T w V i s u al Web Developer 2008 wiczenia 2.7 Menu strony Innym zastosowaniem mapy witryny jest automatycznie tworzone menu i drzewo zawieraj ce strony uwzgl dnione w tym pliku. Zacznijmy od menu. Dodamy je do wzorca tym razem ponad komponentem rezerwuj cym miejsce dla stron. 1. Przechodzimy do widoku projektowania wzorca MasterPage.master. 2. Ponad komponentem ContentPlaceHolder umieszczamy komponent Menu z zak adki Navigation. 3. W li cie podr cznej z rozwijanej listy Choose Data Source wybieramy <New data source >. 4. Pojawi si kreator Data Source Configuration Wizard pozwalaj cy na wybór ród a danych, na podstawie których zostanie utworzone menu. Mo e ono zosta zbudowane w oparciu o dowolny plik XML lub nasz gotowy plik Web.sitemap. Wybieramy oczywi cie t drug mo liwo, zaznaczaj c ikon Site Map. Klikamy OK. Utworzony zostanie komponent SiteMapDataSource1. 5. Nam pozostaje tylko sformatowa wygl d menu. Proponuj równie tym razem wybra szablon Colorful (rysunek 2.6). 2.8 Drzewo pokazuj ce struktur stron w witrynie Na zak adce Navigation jest jeszcze jeden komponent, na który te warto zwróci uwag. Jest to drzewo TreeView, które prezentuje struktur witryny. Nadaje si bardziej na osobn stron ni do umieszczenia w nag ówku lub stopce stron. 1. Z menu File wybieramy New File. 2. W oknie Add New Item zaznaczamy Web Form, wybieraj c opcj Select master page, i zmieniamy nazw pliku na MapaWitryny.aspx. 3. Klikamy Add. W nowym oknie wybieramy wzorzec i klikamy OK. 4. Przechodzimy do widoku projektowania nowej strony. 5. Na dost pnym obszarze umieszczamy komponent TreeView z zak adki Navigation.

Rysunek 2.6. U ycie tego samego stylu do formatowania menu i cie ki pokazuj cej pozycj w strukturze witryny to zal ek estetycznego i spójnego wizerunku wszystkich stron witryny R o z d z i a 2. Praktyka projektowania s t r on ASP.NET 35 6. Post puj c identycznie jak w przypadku menu, tworzymy ród o danych korzystaj ce z mapy witryny (niestety, nie mo na u y gotowego komponentu SiteMapDataSource1 widocznego w obszarze wzorca). 7. Formatujemy drzewo, wybieraj c z podr cznej listy zada pozycj Auto Format. Proponuj u y stylu Arrows 2 (rysunek 2.7). Rysunek 2.7. Automatycznie generowana mapa witryny w widoku projektu 8. Now stron warto dopisa do mapy witryny, tworz c w ze równorz dny z Default.aspx.

36 A S P. N E T w V i s u al Web Developer 2008 wiczenia Poza zwyk nawigacj, jak umo liwia komponent TreeView, mo na definiowa metody zdarzeniowe zwi zane z klikni ciem ró nych pozycji drzewa (zdarzenie SelectedNodeChanged). Dwa s owa na temat kaskadowych arkuszy stylów Wiemy ju, e w projektach ASP.NET mo emy w znacznym stopniu, w zasadzie nawet ca kowicie, odseparowa kod C# od szablonu HTML strony. W ten sposób oddzielony zostaje kod odpowiedzialny za statyczny wygl d stron witryny od metod kszta tuj cych ich dynamik. Do tych dwóch etapów projektowania dochodzi trzeci, w którym za pomoc kaskadowych arkuszy stylów wp ywamy na estetyk witryny. Podobnie jak w przypadku kodu C#, tak e arkusze stylu mog by ca kowicie odseparowane w plikach.css, a przez to ich rozwój, podobnie jak kodu C#, mo e by z atwo ci powierzony innym osobom ni te, które rozwijaj kod z plików.aspx. W kilku poni szych przyk adach przedstawi podstawowe narz dzia s u ce do budowania kaskadowych arkuszy stylów. 2.9 Tworzenie arkuszy stylów Kaskadowe arkusze stylów (ang. cascade style sheet) to kolejne obok wzorca narz dzie ujednolicenia stron witryny, a jednocze nie zcentralizowania kontroli nad ich wygl dem. I w tym przypadku wsparcie ze strony VWD jest godne pochwa y. 1. Z menu File wybieramy New File. 2. W oknie Add New Item zaznaczamy pozycj Style Sheet i je eli odczuwamy tak potrzeb, zmieniamy nazw pliku; potwierdzamy klikni ciem OK.

R o z d z i a 2. Praktyka projektowania s t r on ASP.NET 37 W edytorze zobaczymy niemal pusty plik, który zawiera jedynie tekst: body { } To zal ek stylu zwi zanego ze zwyk ym tekstem umieszczonym na stronie (tekst mi dzy znacznikami BODY w kodzie HTML). Na szcz cie nie musimy zna si na formacie arkuszy stylów, bo VWD zawiera proste narz dzie pozwalaj ce na ich definiowanie. Zacznijmy od rozbudowania regu y formatowania dotycz cej prostego tekstu. 2.10 Formatowanie tekstu na stronie 1. W edytorze ustawiamy kursor (edycji, nie myszy) mi dzy nawiasami istniej cej regu y stylu. 2. Klikamy na pasku narz dzi przycisk Build Style (dost pny jest równie z menu kontekstowego). 3. W oknie Modify Style (rysunek 2.8) mo emy wybra format i kolor czcionki, t a, list i innych elementów umieszczonych na stronie. My ograniczymy si do sformatowania czcionki, dlatego klikamy pozycj Font na li cie zak adek widocznej z lewej strony okna. Rysunek 2.8. Definiowanie regu y stylu dla znacznika body

38 A S P. N E T w V i s u al Web Developer 2008 wiczenia 4. Rozwijamy list zatytu owan color i klikamy More Colors : a) w oknie More Colors odnajdujemy np. kolor maroon (jeden z br zowych), który b dzie dobrze wspó gra ze stylem formatowania wybranym w menu i w innych komponentach nawigacyjnych; dla wi kszej elastyczno ci kolory reprezentowane s przez liczby szesnastkowe 1 ; b) klikamy OK, aby zamkn kreator stylu. 5. Nast pnie, korzystaj c z ikony Add Style Rule na pasku narz dzi (lub analogicznego polecenia menu kontekstowego), tworzymy nowy styl dla znacznika A (tj. dla umieszczonych na stronie czy): a) ponownie uruchamiamy kreator stylów (przycisk Build Style na pasku narz dzi) i zak adk Font; b) tym razem wybieramy kolor Black; c) w cz ci text-decoration zaznaczamy pole None. 6. Po tym zdefiniujmy jeszcze jedn regu formatowania dla A:hover ( cze po naprowadzeniu na niego kursora), w którym kolor ustalamy na Red, a w cz ci text-decoration (por. rysunek 2.8) w czamy opcj Underline. Po tych czynno ciach plik kaskadowego arkusza stylów (plik z rozszerzeniem.css) powinien wygl da jak na listingu 2.3. Listing 2.3. Zawarto pliku kaskadowych arkuszy stylów body { color: #800000; } A { color: #000000; text-decoration: none; } A:hover { color: #FF0000; text-decoration: underline; } 1 Bardziej egzotyczne nazwy kolorów mog by niezrozumia e dla starszych przegl darek.

R o z d z i a 2. Praktyka projektowania s t r on ASP.NET 39 2.11 Stosowanie arkuszy stylów Czas, aby arkusz wykorzysta do formatowania stron naszej przyk adowej witryny: 1. Przejd my na stron Default.aspx. 2. W widoku projektowania dodajmy do niej prosty tekst (wpisuj c go w polu Content) oraz komponent HyperLink ze skonfigurowan w a ciwo ci NavigateUrl i etykiet (w a ciwo Text). 3. Przejd my do widoku projektowania pliku wzorca MastepPage.master. 4. Przeci gnijmy z okna projektu (Solution Explorer) utworzony plik.css. Do kodu strony dodany zostanie element <link href="stylesheet.css" rel="stylesheet" type="text/css" />, dzi ki któremu wzorzec i wszystkie u ywaj ce go strony b d korzysta y z arkusza i zdefiniowanych w nim stylów. W podgl dzie wzorca i podgl dzie stron, które z niego korzystaj, zobaczymy zmian tekst zmieni kolor na br zowy, cza na jasnobr zowy. Ponadto cza pozbawione zosta y podkre lenia. Je eli obejrzymy stron w przegl darce, to zobaczymy, e kolor czy zmienia si na pomara czowy, je eli naprowadzi na nie kursor myszy, oraz e pojawia si wówczas pod nimi podkre lenie. Je eli witryna nie ma wzorca, arkusz nale y doda do ka dej strony osobno. To samo dotyczy stron w naszej witrynie, które nie korzystaj ze wzorca. Mo na równie edytowa indywidualny styl poszczególnych komponentów na stronach. W ich menu kontekstowym znajduje si pozycja Style, która uruchamia okno Style Builder, widoczne na rysunku 2.8. Je eli natomiast chcemy u y istniej cych klas stylu, w oknie Properties odnajdujemy w a ciwo CssClass i tam wpisujemy nazw klasy zdefiniowanej w arkuszu stylu. Klasy mo na definiowa w pliku.css, dodaj c regu i zaznaczaj c opcj Class name.

40 A S P. N E T w V i s u al Web Developer 2008 wiczenia Czas ycia sesji i aplikacji ASP.NET Po pierwszym wywo aniu witryny na serwerze WWW uruchamiana jest odpowiedzialna za ni aplikacja ASP.NET i od tego momentu najcz ciej nie przestaje dzia a a do zako czenia pracy serwera. Jednocze nie w obr bie aplikacji powstaje sesja, która zwi zana jest z tym pierwszym daniem. Kolejne dania od innych przegl darek-klientów powoduj tworzenie nast pnych sesji. Po opuszczeniu przez internaut witryny sesje ko cz prac, ale aplikacja wci jest na posterunku. To zasadnicza zmiana w porównaniu do starszych technologii rozszerze serwerów WWW, w których aplikacja uruchamiana by a tylko po to, aby przetworzy otrzymane od przegl darki danie i wygenerowa nowy kod HTML. W ASP.NET mamy do czynienia ze stale pracuj c aplikacj, która przechowuje swój stan. W tym jest podobna do technologii Java Server Pages firmy Sun. W szczególno ci ci g o pracy aplikacji powoduje, e mo emy zapami ta jakie dane na jednej stronie witryny, a wykorzysta na innej. Do tego s u y zbiór danych (zmiennych) sesji. Nie ma tak e problemu, aby utworzy zmienn przechowywan nawet po zamkni ciu sesji. Wystarczy umie ci j w zbiorze danych aplikacji. A co w przypadku zamkni cia serwera WWW? Oczywi cie oba zbiory zostan utracone. Jednak dane mog by przechowywane w plikach. Mo emy do tego wykorzysta stare dobre cookies, szczególnie je eli dane dotycz konkretnego u ytkownika w tym przypadku dane przechowywane s po stronie klienta; mo na równie wykorzysta pliki XML lub wr cz jedn z baz danych ADO.NET. To ju oczywi cie po stronie serwera. Mamy tu pe n swobod dzia ania. Aby lepiej prze ledzi cykl ycia aplikacji ASP.NET i jej sesji, stwórzmy metody zdarzeniowe zwi zane z kluczowymi momentami ycia aplikacji i sesji. W tym celu do aplikacji, któr stworzyli my w poprzednim podrozdziale, dodamy specjalny plik Global.asax. 2.12 Tworzenie pliku Global.asax 1. Z menu File wybieramy New File. 2. W dobrze nam ju znanym oknie zaznaczamy pozycj Global Application Class.