You are on page 1of 46

IDZ DO

PRZYKADOWY ROZDZIA
SPIS TRECI

KATALOG KSIEK
KATALOG ONLINE
ZAMW DRUKOWANY KATALOG

TWJ KOSZYK
DODAJ DO KOSZYKA

CENNIK I INFORMACJE
ZAMW INFORMACJE
O NOWOCIACH
ZAMW CENNIK

CZYTELNIA
FRAGMENTY KSIEK ONLINE

Dreamweaver UltraDev 4.
Ksiga eksperta
Autor: Sean Nicholson
Tumaczenie: Piotr Ducher
ISBN: 83-7197-610-0
Tytu oryginau: Inside Dreamweaver UltraDev 4
Format: B5, stron: 368

Generowanie stron dynamicznych wymaga nie tylko znajomoci zagadnie zwizanych


z tworzeniem stron WWW, lecz obejmuje rwnie wiedz dotyczc projektowania baz
danych, konfiguracji poczenia z bazami danych i technologii wykorzystywanych na
serwerach. Dreamweaver UltraDev 4. Ksiga eksperta stanowi kompletne rdo
informacji na temat procesu konfiguracji poczenia z bazami danych, pomaga rwnie
zrozumie, w jaki sposb si to odbywa od strony czysto technicznej.
Jako profesjonalista w dziedzinie tworzenia stron internetowych wiesz, e czas to
pienidz. Im duej uczysz si nowych jzykw programowania i aplikacji, tym mniej
czasu spdzasz na wykorzystywaniu poznanych technologii na stronach WWW.
Ta ksika zostaa opracowana, aby pomc Ci w realizacji tego zadania, Dreamweaver
UltraDev 4. Ksiga eksperta omawia implementacj technologii oraz pokazuje, w jaki
sposb korzysta z funkcji UltraDeva w procesie projektowania witryny WWW.
W czci I znajdziesz rozdziay dotyczce technologii wykorzystywanych podczas
tworzenia dynamicznych stron internetowych. Przykady w rozdziale II, III i IV maj Ci
pomc w zaprojektowaniu i zarzdzaniu witryn wsppracujc z baz danych.
"UltraDev4. Ksiga eksperta" jest podzielona na cztery czci.
Cz I Przygotowujemy si do dynamicznego przejcia omwienie historii
powstania UltraDeva i technologii wykorzystywanych w procesie tworzenia
dynamicznych stron internetowych. Tematy: historia UltraDeva, zrozumienie procesu
tworzenia stron dynamicznych oraz podstawy projektowania baz danych
wsppracujcych z witrynami internetowymi.

Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl

Cz II Tworzymy solidne podstawy omwienie opcji UltraDeva umoliwiajcych


tworzenie i zarzdzanie statycznymi i dynamicznymi stronami internetowymi
z wykorzystaniem trybu projektowania graficznego ukadu strony i podgldu kodu
rdowego. Tematy: narzdzia UltraDeva do zarzdzania witryn, opcje tworzenia stron
w trybie podgldu graficznego ukadu strony oraz wstawianie obiektw
multimedialnych.
Cz III Opracowujemy witryn wsppracujc z baz danych omwienie sposobw
czenia stron internetowych z baz danych i metod generowania stron dynamicznych
zawierajcych informacje z baz danych.
Cz IV Rozszerzamy zakres opcji administracyjnych omwienie procesu tworzenia
stron internetowych umoliwiajcych zarzdzanie baz danych za pomoc przegldarki
internetowej. Dodatkowy materia obejmuje prezentacj moliwoci rozbudowy witryn
tworzonych za pomoc UltraDeva o opcje handlu elektronicznego (eCommerce)
i prowadzenia nauczania przez Internet (eLearning).



 

 

 
  
  !" #
Tworzenie stron internetowych przed UltraDevem...............................................................................20
Historia powstania UltraDeva ...............................................................................................................21
Na pocztku by Dreamweaver .......................................................................................................21
Macromedia bierze Drumbeata 2000 w adopcj.............................................................................23
Poczenie Dreamweavera z Drumbeatem......................................................................................23
Narodziny UltraDeva ......................................................................................................................24
Porwnanie Dreamweavera z Dreamweaverem UltraDev ....................................................................25
Prawdziwe moliwoci UltraDeva ........................................................................................................26
Nowe opcje w UltraDevie 4 ..................................................................................................................28
Tryby podgldu ...............................................................................................................................28
Kolorowanie skadni........................................................................................................................28
Poczenie z baz danych na serwerze ............................................................................................29
Zarzdzanie obiektami multimedialnymi........................................................................................29
Dodatkowe behawiory serwera .......................................................................................................30
Poznajemy rodowisko autorskie UltraDeva.........................................................................................31
Okno Document ..............................................................................................................................31
Palety i paski narzdziowe ..............................................................................................................32
Inspektor Property.....................................................................................................................33
Paleta Objects............................................................................................................................33
Paleta Launcher.........................................................................................................................34
Podsumowanie.......................................................................................................................................34

$ %&'(  ) *( +


Omwienie procesw wykonywanych na serwerach ............................................................................35
Wybr serwera WWW ..........................................................................................................................37
Personal Web Server .......................................................................................................................37
Internet Information Server (IIS) ....................................................................................................38
Apache.............................................................................................................................................39
Wybr serwera aplikacji WWW............................................................................................................40
ASP (Active Server Pages) .............................................................................................................41
JavaScript ..................................................................................................................................42
Skrypt JavaScript generujcy formularz sprawdzajcy poprawno
wprowadzenia danych przez uytkownika ...............................................................................42


    
VBScript....................................................................................................................................45
Skrypt VBScript generujcy formularz sprawdzajcy
poprawno wprowadzenia danych przez uytkownika ...........................................................45
JSP (Java Server Pages) ..................................................................................................................46
Skrypt Java generujcy formularz sprawdzajcy
poprawno wprowadzenia danych przez uytkownika ...........................................................47
ColdFusion ......................................................................................................................................49
Skrypt CFML generujcy formularz sprawdzajcy
poprawno wprowadzenia danych przez uytkownika ...........................................................49
Konfiguracja stacji roboczej jako serwera testowego stron dynamicznych ..........................................51
Ustawienia dla Windows 98............................................................................................................51
Ustawienia dla Windows NT4 Workstation....................................................................................53
Ustawienia dla Windows 2000 Professional i Windows 2000 Server ............................................55
Ustawienia dla MacOS....................................................................................................................57
Podsumowanie.......................................................................................................................................58

 ,*&)&

- . 
 * && /
Podstawowe informacje o bazach danych .............................................................................................61
Modele baz danych..........................................................................................................................62
Pliki jednorodne ........................................................................................................................62
Hierarchiczne bazy danych .......................................................................................................63
Sieciowe bazy danych...............................................................................................................65
Relacyjne bazy danych..............................................................................................................65
Wybr platformy systemowej i systemu zarzdzania baz danych ................................................66
Microsoft Access.......................................................................................................................66
Microsoft SQL Server...............................................................................................................67
MySQL......................................................................................................................................68
IBM DB2...................................................................................................................................69
Oracle ........................................................................................................................................69
Tworzenie bazy danych wsppracujcej z witryn internetow ..........................................................70
Tworzenie tabel ...............................................................................................................................71
Tworzenie relacji i weryfikacja wizw integralnoci....................................................................73
Poczenie bazy danych z witryn.........................................................................................................75
Komunikacja z baz danych ..................................................................................................................77
W jaki sposb UltraDev przyspiesza proces czenia si z baz danych? ............................................78
Podsumowanie.......................................................................................................................................78

 

   
!
! 0&& 1
Planowanie witryny ...............................................................................................................................81
Tworzenie mapy witryny.................................................................................................................82
Planowanie stron i katalogw ...................................................................................................83
Katalogowanie elementw skadowych witryny ......................................................................84
Tworzenie mapy witryny w oknie Site............................................................................................87
Konfiguracja poczenia z serwerem.....................................................................................................88
Poczenie sieciowe.........................................................................................................................89
Poczenie za pomoc FTP..............................................................................................................91
Poczenie za pomoc WebDAV ....................................................................................................92
Poczenie z Visual SourceSafe Database.......................................................................................93

 

Wykorzystanie okna Site do tworzenia witryny....................................................................................95


Tworzenie nowej strony z poziomu okna Site ................................................................................95
Tworzenie stron poczonych automatycznie .................................................................................97
Wykorzystywanie techniki przecignij i upu ...........................................................................99
Synchronizacja plikw ....................................................................................................................99
Weryfikacja poprawnoci dziaania czy i identyfikacja plikw nie poczonych z innymi.............101
Tworzenie witryny w zespole..............................................................................................................102
Procedury Check In/Check Out.....................................................................................................102
Notatki ...........................................................................................................................................104
Podsumowanie.....................................................................................................................................105

+   23


Definiowanie waciwoci strony ........................................................................................................108
Tytu strony ...................................................................................................................................108
Kolory i pliki graficzne w tle strony .............................................................................................110
Kolory tekstu uywanego w czach .............................................................................................111
Znaczniki sekcji <head>................................................................................................................112
Znaczniki meta........................................................................................................................113
Sowa kluczowe ......................................................................................................................114
Opis strony ..............................................................................................................................115
Dodatkowe znaczniki sekcji <head> ......................................................................................116
Projektowanie graficznego ukadu strony ...........................................................................................116
Wybr trybu podgldu graficznego ukadu strony........................................................................116
Tworzenie tabeli gwnej ..............................................................................................................117
Tworzenie tabeli nagwka strony ................................................................................................119
Wstawianie tabeli, w ktrej bd umieszczone gwne informacje na stronie .............................120
Wstawianie tabeli, w ktrej bd umieszczone elementy nawigacyjne........................................122
Wstawianie elementw graficznych na stron i dodawanie hiperczy ........................................123
Tworzenie szablonu .............................................................................................................................126
Zaznaczanie obszarw edytowalnych ...........................................................................................127
Tworzenie nowych stron w oparciu o szablony ............................................................................127
Przypisywanie szablonu do strony ................................................................................................128
Odczanie strony od szablonu......................................................................................................129
Podsumowanie.....................................................................................................................................129

/ &)*-(' &


  &

Paleta Assets ........................................................................................................................................132
Katalogowanie elementw skadowych witryny w palecie Assets ...............................................132
Tworzenie listy ulubionych obiektw palety Assets.....................................................................134
Wstawianie obiektw z palety Assets na stron............................................................................136
Tworzenie przyciskw dynamicznych ................................................................................................137
Rollovery .......................................................................................................................................137
Rollovery Flash .............................................................................................................................141
Wstawianie animacji na stron ............................................................................................................144
Filmy Flash....................................................................................................................................144
Filmy Shockwave ..........................................................................................................................148
Sekwencje wideo...........................................................................................................................148
Wstawianie plikw dwikowych .......................................................................................................148
Pliki WAV.....................................................................................................................................149
Pliki MIDI .....................................................................................................................................149
Pliki MP3.......................................................................................................................................149
Podsumowanie.....................................................................................................................................150


    

 " 



#$ %%&%
'(
3 ,. &&).&
+
Sprawdzamy, czy wszystko jest w porzdku.......................................................................................153
Konfiguracja poczenia z baz danych i definiowanie zbioru rekordw...........................................154
Wstawianie danych dynamicznych na stron ......................................................................................159
Tworzenie cza do strony zawierajcej dodatkowe informacje o produkcie .....................................163
Wykorzystanie stron i zbiorw rekordw do tworzenia stron o podobnym wygldzie ......................170
Tworzymy stron New Titles ....................................................................................................170
Tworzymy podstron dla strony New Titles zawierajc dodatkowe informacje.....................173
Tworzymy stron Spotlight Items i podstron zawierajc informacje dodatkowe..................174
Podsumowanie.....................................................................................................................................174

1 0&*&4*&*
*& . 
3+
Tworzenie konta uytkownika.............................................................................................................176
Wstawianie czy dynamicznych umoliwiajcych utworzenie konta,
zalogowanie i wylogowanie si uytkownika ...............................................................................177
Tworzenie formularza rejestracyjnego nowego uytkownika.......................................................181
Zaczynamy od szablonu..........................................................................................................182
Wstawiamy formularz rejestracyjny uytkownika .................................................................183
Sprawdzanie kompletnoci wypenienia pl...........................................................................188
Wysyanie danych do bazy danych.........................................................................................189
Zabezpieczenie przed powtrzeniem wpisu
tej samej nazwy uytkownika (identyfikatora) .......................................................................190
Dodawanie strony potwierdzajcej zaoenie konta uytkownika .........................................192
Dodawanie opcji zalogowania i wylogowania si
dla uytkownikw ponownie korzystajcych z witryny ...............................................................193
Zabezpieczenie stron przed niezarejestrowanymi uytkownikami .....................................................199
Testowanie nowych stron ....................................................................................................................199
Podsumowanie.....................................................................................................................................202

#  *& $2


Tworzenie wyszukiwarki przeszukujcej baz danych wedug kryterium jednoparametrowego.......204
Wstawianie czy wyszukiwania...................................................................................................204
Wstawianie strony zawierajcej wyniki szukania .........................................................................206
Tworzenie strony zawierajcej formularz ograniczonego wyszukiwania prostego ............................210
Tworzenie cza do strony umoliwiajcej odzyskanie zapomnianego hasa uytkownika .........211
Dodawanie strony zawierajcej formularz pozwalajcy odzyska zapomniane haso .................212
Sprawdzanie poprawnoci danych wpisanych przez uytkownika...............................................215
Testowanie mechanizmu
umoliwiajcego odzyskanie hasa zapomnianego przez uytkownika........................................218
Dodawanie opcji wyszukiwania zaawansowanego .............................................................................220
Tworzenie strony z formularzem oferujcym zaawansowane opcje wyszukiwania.....................220
Tworzenie strony z wynikami szukania ........................................................................................223
Testowanie strony z formularzem oferujcym zaawansowane opcje wyszukiwania ...................224
Podsumowanie.....................................................................................................................................226

 

 2  &&&
&**&)*-*-)&
  $$3
Wstawianie na strony obrazkw i tekstw wybieranych losowo ........................................................228
Stosowanie tekstw i obrazkw umieszczanych na stronie w zalenoci od parametru czasowego ......234
Tworzenie czy dynamicznych umoliwiajcych nawigacj w obrbie wynikw szukania .............238
Tworzenie licznika rekordw ..............................................................................................................242
Podsumowanie.....................................................................................................................................244

)*  


"   

' +,(
 0&&& &
.&).&
$!3
Tworzymy witryn do zarzdzania baz danych.................................................................................248
Zaczynamy od strony umoliwiajcej zalogowanie uytkownika ................................................249
Tworzenie uniwersalnego szablonu stron .....................................................................................254
Dodawanie strony z menu gwnym .............................................................................................256
Dodawanie strony umoliwiajcej wylogowanie uytkownika ...........................................................257
Dodawanie opcji wyszukiwania do witryny administracyjnej ............................................................258
Tworzenie strony umoliwiajcej wyszukanie produktu ..............................................................258
Dodawanie strony zawierajcej wyniki szukania do witryny administracyjnej............................260
Dodawanie, edycja i usuwanie rekordw..............................................................................................263
Tworzenie strony umoliwiajcej dodawanie nowych rekordw do bazy danych .......................263
Edycja rekordw wprowadzonych do bazy danych ......................................................................265
Usuwanie rekordw z bazy danych...............................................................................................268
Potwierdzanie dodania, edycji i usunicia rekordw ....................................................................271
Testowanie witryny administracyjnej..................................................................................................272
Podsumowanie.....................................................................................................................................276

 $ 5&  *& & $33


Tworzenie prostego sklepu internetowego umoliwiajcego zoenie zamwienia
na jeden produkt ..................................................................................................................................277
Konfiguracja bazy danych.............................................................................................................278
Wstawianie cza do sekcji eCommerce witryny..........................................................................279
Tworzenie formularza umoliwiajcego wpisanie
i potwierdzenie danych adresowych klienta..................................................................................280
Potwierdzanie danych zamwienia ...............................................................................................283
Wybr sposobu zapaty .................................................................................................................287
Finalizowanie zamwienia ............................................................................................................291
Testowanie poprawnoci dziaania prostego sklepu internetowego..............................................295
Rozbudowa sklepu o opcj dodawania zakupw do koszyka .............................................................298
Instalacja UltraDev Shopping Cart 1.2..........................................................................................299
Definiowanie ustawie UltraDev Shopping Cart..........................................................................301
Tworzenie cza do koszyka..........................................................................................................302
Tworzenie strony z zawartoci koszyka ......................................................................................304
Zakoczenie sesji uytkownika.....................................................................................................308
Informowanie uytkownikw o pustym koszyku .........................................................................312
Testowanie dziaania koszyka .......................................................................................................313
Podsumowanie.....................................................................................................................................315




    

  0& * & &6&&  3


Co to jest eLearning? ...........................................................................................................................318
CourseBuilder rozszerzenie UltraDeva ..........................................................................................318
Instalacja CourseBuildera..............................................................................................................319
Poznajemy CourseBuildera ...........................................................................................................320
Wstawianie prostego quizu na stron ..................................................................................................323
Tworzenie witryny z quizami........................................................................................................323
Dodawanie pytania do quizu .........................................................................................................324
Dodawanie kolejnych pyta ..........................................................................................................329
Testowanie quizu...........................................................................................................................331
Rozbudowa prostego quizu o moliwo korzystania z bazy danych
w celu rejestrowania wynikw ............................................................................................................332
Instalacja rozszerzenia Learning Site Command ..........................................................................333
Konfiguracja witryny do nauczania interaktywnego (Learning Site) ...........................................333
Modyfikacja pyta quizu umoliwiajca wysyanie odpowiedzi do bazy danych .......................338
Umoliwienie dostpu i sprawdzenie dziaania quizu ..................................................................339
Analiza wynikw quizu.................................................................................................................340
Podsumowanie.....................................................................................................................................342

 ! )4 7   !


Par sw na temat stosowania rozszerze UltraDeva ........................................................................343
Co to s rozszerzenia? ...................................................................................................................344
Jak zdoby rozszerzenia? ..............................................................................................................344
Jak zainstalowa rozszerzenia? .....................................................................................................346
Wady i zalety stosowania rozszerze............................................................................................346
Tworzenie nowych behawiorw uruchamianych po stronie serwera..................................................348
Modyfikacja podstawowych behawiorw serwera..............................................................................350
Pakowanie nowych rozszerze za pomoc Extension Managera........................................................351
Podsumowanie.....................................................................................................................................352

-  ".(.
*8&)&*&&9 : ++
*;<& * +3
<* /#

Handel elektroniczny kwitnie! Prawie wszystkie firmy sprzedajce swoje produkty w sposb tradycyjny udostpniaj je rwnie przez Internet. Moesz kupi ksiki, samochody,
sprzt biurowy W zwizku z tym coraz czciej pojawia si potrzeba tworzenia opcji
handlu elektronicznego (eCommerce) doczonych do witryny WWW i zarzdzania nimi.
Wprawdzie UltraDev nie posiada zestawu skomplikowanych narzdzi do tworzenia
aplikacji eCommerce, w zupenoci jednak wystarczy do tworzenia prostych sklepw
internetowych. Stosujc dodatkowe rozszerzenia innych firm, moesz utworzy do
skomplikowany system realizowania zakupw przez Internet, wzbogacony o opcj wirtualnego koszyka (shopping cart).
Aby zademonstrowa moliwoci UltraDeva w zakresie tworzenia aplikacji eCommerce,
w tym rozdziale nauczysz si, jak:


tworzy prost witryn umoliwiajc zoenie zamwienia na jeden produkt


(single transaction),

budowa zaawansowan witryn wzbogacon o opcj wirtualnego koszyka.

Wspomniaem ju na wstpie, e bez rozszerze innych firm lub bez rcznego wpisywania
duych fragmentw kodu moliwoci UltraDeva w zakresie dodawania opcji handlu
elektronicznego s raczej ubogie. Nie oznacza to jednak, e niemoliwe jest utworzenie
stron sklepu internetowego moesz w tym celu wykorzysta wbudowane behawiory
serwera. W praktyce oznacza to, e takie opcje, jak obliczanie podatku i stosowanie
wirtualnego koszyka s niedostpne. Aby doczy te opcje, musisz dysponowa odpowiednim rozszerzeniem UltraDeva lub dostosowa posiadane rozszerzenia w taki sposb,
by moliwe byo doczanie opcji eCommerce.
Najpierw przypatrzmy si temu, co sam UltraDev potrafi zrobi. Najlepsz metod
sprawdzenia moliwoci UltraDeva w zakresie tworzenia sekcji eCommerce witryny
jest dodanie sklepu internetowego (sekcji eCommerce) do witryny. W naszym przypadku




    
zastosujemy witryn Nostalgic Radio Favorites i doczymy do niej prosty system eCommerce, umoliwiajcy przeprowadzenie pojedynczej transakcji przez Internet (singletransaction eComerce). Uytkownik bdzie mia moliwo przejrzenia katalogu i zakupu
interesujcego go produktu. Takie rozwizanie oczywicie nie za bardzo nadaje si do
rzeczywistego prowadzenia handlu przez Internet (w ktrym stosuje si wirtualne koszyki
i profile klientw zapisane w bazie danych), ale z pewnoci stanowi dobry przykad
implementacji jednego ze sposobw tworzenia sklepu internetowego.
Rne aspekty handlu elektronicznego
Jest wiele rnych metod umoliwiajcych realizacj zakupw przez Internet. Niektrzy
wol rozwizania polegajce na prowadzeniu klienta przez poszczeglne etapy skadania
zamwienia, inni z kolei wol, by skadanie zamwienia odbywao si tylko na jednej
stronie. Zanim zaczniesz budowa sekcj eCommerce dla witryny Nostalgic Radio
Favorites, zastanw si przez chwil, jakie informacje od uytkownikw bd Ci potrzebne
oraz w jaki sposb powinna by zaprojektowana baza danych (jeli masz takow).

Rozpoczynajc tworzenie prostej witryny, powiniene przemyle kilka aspektw. Po pierwsze, musisz przeanalizowa baz danych (Sales Database) i struktur tabel do przechowywania danych zwizanych z zamwieniem. Po drugie, musisz utworzy cze przekierowujce uytkownikw do sekcji witryny umoliwiajcej zoenie zamwienia. Po
trzecie, konieczne jest utworzenie strony, na ktrej wszystkie niezbdne dane bd zbierane w cao i wysyane do bazy danych. Na koniec przetestujemy system i sprawdzimy,
czy dziaa tak, jak zamierzylimy.


  

Pierwszy etap konfiguracji sklepu internetowego polega na przeanalizowaniu struktury
bazy danych i sprawdzeniu, czy odpowiednie tabele s prawidowo zdefiniowane oraz
czy bd prawidowo dziaa w systemie eCommerce.
Wprawdzie tabele tbProducts i tbCustomers s bardzo wane to wanie dziki nim
odbywa si przyznanie (lub nie) dostpu uytkownikom do katalogu produktw jednak
dla opracowywanego systemu eCommerce najwaniejsze s tabele tbOrders i tbLineitem.
Po skompletowaniu zamwienia dane z formularzy (widoczne i ukryte) wysyane s do
tabel tbOrders i tbLineitem, a nastpnie generowany jest nowy numer zamwienia, ktry
zostaje przypisany do zamawianych produktw (lub produktu).
W tabeli tbOrders przechowywane s wszystkie informacje o poszczeglnych zamwieniach. Za kadym razem, kiedy skadane jest nowe zamwienie, przypisany jest do
niego numer ID, a nastpnie dane klienta, data, metoda wysyki i forma patnoci s
wpisywane do bazy danych. Z kolei dane o zamawianych produktach umieszczane s
w tabeli tbLineitem. W tabeli tej umieszczane s takie dane, jak: numer zamwienia,
identyfikator ID produktu i liczba zamwionych produktw.
System eCommerce, ktry bdziesz opracowywa, jest systemem obsugujcym zoenie
zamwienia na jeden wybrany produkt, dlatego dla kadego rekordu umieszczonego
w tabeli tbOrders powinien by utworzony bliniaczy rekord w tabeli tbLineitem.

   ! ! 

"

Scalanie tabel
Zastanawiasz si pewnie, po co tworzy dwie osobne tabele, skoro wszystkie dane
mona zebra w jednej. Dla systemw obsugujcych zamwienie wybranego produktu
jest to cakiem prawidowy i nawet bardziej wygodny sposb zaprojektowania
bazy danych. Jednak ze wzgldu na to, e w dalszej czci rozdziau system eCommerce
wzbogacimy o opcj wirtualnego koszyka, rozdzielenie danych do dwch tabel jest
niezbdne.
Jeli wiesz, e w przygotowywanej witrynie bdzie wykorzystywany system umoliwiajcy
zoenie zamwienia na jeden wybrany produkt, scalenie tych dwch tabel (przy
projektowaniu bazy danych) do postaci jednej tabeli zawierajcej wszystkie dane
bdzie jak najbardziej prawidowe.

   
  
 
 
Kiedy uytkownik witryny znajdzie na stronach informacje o produktach, ktre chciaby
kupi, musisz da mu moliwo przejcia do sekcji eCommerce witryny. W tym celu
wstaw cze. Kliknicie tego cza przez uytkownika powoduje przesanie na stron
eCommerce numeru ID produktu, ktry uytkownik zamierza zakupi. Aby wykona to
zadanie, zastosuj behawior serwera Go To Related Page powodujcy otwarcie nowej
strony i przekazanie zmiennej za porednictwem adresu URL. Po przekazaniu numeru
ID wybranego produktu rozpoczyna si proces skadania i finalizowania zamwienia
(check-out process).
Wpisujc kod rcznie, zachowaj szczegln czujno
Tworzc witryn eCommerce, bdziesz musia rcznie wpisa niektre fragmenty kodu
rdowego. Nie jest to a takie straszne, ale pamitaj, e przeoczona kropka lub
niepoprawnie wpisana zmienna mog wywoa skutki, na ktre wolaby raczej nie
patrze. Zachowaj szczegln czujno, kiedy wpisujesz rcznie fragmenty wymaganego
kodu rdowego. Jeli w czasie testowania stron zostanie wywietlona strona
z informacj o wystpieniu bdu, sprawd kod rdowy dla tej strony i zmie go.
Powodzenia!


  
  
!
 Uruchom UltraDeva. Otwrz stron bargain_bin_details.asp utworzon

w rozdziale 7. pt. Poczenie witryny z baz danych.


 Na stronie bargain_bin_details.asp (zobacz rysunek 12.1) umie kursor pod tabel

w obszarze edytowalnym erMainData.


 Wpisz 
 
 (   ).
 Uaktywnij panel Server Behaviors.
 Zaznacz wpisany tekst i w panelu Server Behaviors kliknij przycisk oznaczony

symbolem +. Wybierz z menu Go To Related Page.


 W oknie dialogowym Go To Related Page wpisz   w polu

Related Page (zobacz rysunek 12.2).

#


    



Strona bargain_bin_
details.asp



Okno dialogowe
Go To Related Page

 Zaznacz opcj Pass Existing Parameters: URL Parameters. Kliknij OK.

Tak zdefiniowane cze przekierowuje uytkownika na pierwsz stron procesu


skadania zamwienia wybranego produktu. cze przekazuje rwnie za
porednictwem adresu URL numer produktu, co sprawia, e nastpne strony
wiedz, jaki produkt jest kupowany.
 Zapisz stron.

    



     
 
 
Pierwszy etap tworzenia systemu eCommerce polega na uzyskaniu od klienta informacji potwierdzajcej, e wpisane przez niego dane adresowe (na ktre ma by wysany
zamwiony produkt) s poprawne. Mgby oczywicie utworzy stron z pustym formularzem, w ktrym uytkownik wypeniby odpowiednie pola, ale nie jest to konieczne
(a jest czasochonne); moesz przecie pobra wszystkie niezbdne dane z rekordu w tabeli
tbCustomers. W tabeli tbCustomers umieszczane s dane uytkownika wpisywane
w momencie zaoenia konta (umoliwiajcego uzyskanie dostpu do stron chronionych hasem).

   ! ! 



Dodatkow zalet opisanego wyej rozwizania jest to, e uytkownicy mog uaktualnia
swoje dane adresowe. Jedyn wad jest brak moliwoci zoenia zamwienia z wysyk
na adres inny ni uytkownika witryny (np. gdy chcesz komu wysa prezent).
Wysyanie zamwionych produktw na inny adres
W wiczeniu poniej zakadamy, e osoba skadajca zamwienie chce, by produkt by
wysany na jej adres. Jeli chcesz, eby uytkownicy witryny mieli rwnie moliwo
przygotowania wysyki zamwionego produktu na inny adres ni ich wasny, musisz
zdefiniowa osobne zestawy pl w bazie danych. W jednym zestawie bd przechowywane
dane adresowe uytkownika (ulica, miejsce zamieszkania, stan USA, kod pocztowy
ZIP USA), natomiast w drugim zestawie zostan umieszczone dane adresowe
wskazujce tylko miejsce dostarczenia przesyki.



 " ## #$
 #$%!&#'# #!#
 Utwrz now stron wedug szablonu nrfdefault.
 Zaznacz i usu tekst {erMainData}.
 W obszarze edytowalnym erMainData wpisz nastpujcy tekst:

                


              
              !     

("# $% # #            # &


#
%  $& #  #  '  ()# # *
    )%     % #   &  #%+*
     ,  #-  )
 Nacinij Enter, aby przej do kolejnego wiersza.
 Sprawd, czy kursor jest w nowym wierszu. Wybierz z menu polecenie Insert/Live

Objects/Record Update Form.


 W oknie dialogowym Record Update Form (zobacz rysunek 12.3) wybierz

connSales_Database z listy rozwijanej Connection.


 Z listy rozwijanej Table To Update wybierz tabel tbCustomers. W polu Select

Record Form powiniene widzie zestaw rekordw rsLogin, natomiast w polu


Unique Key Column powinna widnie warto Customer ID.
 W polu After Updating, Go To wpisz  ..
 W oknie Form Fields uyj przycisku oznaczonego symbolem -, aby usun

wszystkie pola z wyjtkiem:




Last_Name,

First_Name,

Address,

City,

State,

Zip.




    



Okno dialogowe
Record Update Form

 Kliknij pole First_Name i strzak do gry, aby przenie pole First_Name

na pierwsz pozycj na licie dostpnych pl formularza.


 Kliknij OK, aby zamkn okno dialogowe Record Update Form.
 Umie kursor w wierszu nad wstawionym formularzem i kliknij klawisz

Backspace. Formularz sucy do uaktualniania danych adresowych


uytkownikw zosta wstawiony na stron (zobacz rysunek 12.4).


Formularz sucy
do uaktualniania
danych adresowych
uytkownikw zosta
wstawiony na stron

   ! ! 

$

 Kliknij przycisk Update Form. W inspektorze Property w polu Label wpisz
 . Nacinij Enter.
 Aby mie pewno, e przed zoeniem zamwienia uytkownik zosta

zalogowany, w panelu Server Behaviors kliknij przycisk oznaczony symbolem


+ i wybierz z menu behawior User Authentication/Restrict Acces To Page.
 W oknie dialogowym Restrict Acces To Page (zobacz rysunek 12.5) wybierz

opcj Restrict Based On: Username and Password. W polu If Access Denied
To, Go To wpisz  . Kliknij OK.


Okno dialogowe
Restrict Acces
To Page

 Zapisz stron jako   w katalogu gwnym witryny

InsideUD4.

   
  !
Wiesz ju, gdzie wysa zamwione produkty. Teraz naleaoby sprawdzi, czy zamawiany
produkt jest rzeczywicie tym produktem, ktry uytkownik chce otrzyma. W tym celu
musisz skonstruowa tabel, ktrej pola bd wypenione danymi o produkcie (w oparciu
o numer ID przekazany z poprzedniej strony).
Moesz rwnie zada klientowi pytanie o preferowany przez niego sposob dostawy
przesyki. W naszym wiczeniu nie bdziemy zwiksza ceny produktu o koszty wysyki,
ale moemy doda opcj realizujc to zadanie poprzez przypisanie wartoci numerycznej
do sposobu dostawy przesyki i, w dalszej kolejnoci, dodanie tej wartoci do cakowitej
ceny zamwienia.

(  )#&  & # #
 Utwrz now stron wedug szablonu nrfdefault.
 Usu tekst {erMainData}. Wpisz w to miejsce nastpujcy tekst:
              
/  &                /
           &       
       !    

(     #    &  - # #  


- )        #,  0+
    % &  -  ,12+  #*&   %
  #   ## # %  &   *
##    -    )

%


    
 Nacinij Enter, aby przej do nowego wiersza.
 W panelu Server Behaviors kliknij przycisk oznaczony symbolem + i wybierz

Recordset (Query). Jeli okno dialogowe Recordset otwarte jest w trybie


Advanced, kliknij przycisk Simple.
 W polu Name wpisz  . Pozostae pola wypenij tak, jak na rysunku 12.6.


Zestaw rekordw
rsProducts powinien
wyglda jak
na rysunku

 Kliknij przycisk Test. W oknie dialogowym Please Provide a Test Value wpisz
(3..45. Zostanie wywietlone okno Test SQL Statement, w ktrym widoczny

jest produkt z przypisanym numerem ID (zobacz rysunek 12.7).




Numer produktu (ID)
zosta doczony

 Kliknij OK, aby zamkn okno dialogowe Test SQL Statement, i kliknij OK,

aby zamkn okno dialogowe Recordset.


 Umie kursor w wierszu pod wpisanym tekstem i wybierz z menu polecenie

Insert/Form. Nadaj formularzowi nazw fmOrderInfo. W polu Action wpisz


 4. Nacinij Enter.
 Wewntrz formularza wstaw tabel. Wybierz z menu polecenie Insert/Table
i w oknie dialogowym Insert Table wpisz 6 w polu Rows, . w polu Columns
i ustaw szeroko tabeli (Width) na 789. W polach Cell Padding, Cell Border
i Border wpisz .. Kliknij OK.
 Zaznacz lew kolumn tabeli i w inspektorze Property kliknij przycisk Align Right.
Ustaw szeroko kolumny na :89. Nacinij Enter.
 Wypenij komrki tabeli po lewej stronie, tak eby wyglday jak na rysunku 12.8.

   ! ! 




Dodaj powysze
etykiety tekstowe
do tabeli

 W panelu Server Behaviors kliknij zakadk Data Bindings i kliknij przycisk

oznaczony symbolem + umieszczony obok zestawu rekordw rsProducts.


 Przecignij wizk danych Product_No do prawej grnej komrki tabeli.
 Przecignij wizk danych Title do komrki w tabeli obok etykiety Show Title.
 Przecignij wizki Episode_Title i Price do kolejnych komrek umieszczonych

przy odpowiadajcych im etykietach tekstowych. Na stronie zostan umieszczone


elementy zastpcze danych dynamicznych (zobacz rysunek 12.9).


Elementy zastpcze
dla wizek
dynamicznych
wstawione na stron

&

'


    
 Umie kursor w polu obok etykiety Shipping Type i wybierz z menu polecenie

Insert/Form Objects/List Menu.


 Nadaj obiektowi List/Menu (lista rozwijana/menu) nazw    
.

W inspektorze Property kliknij przycisk List Values.


 W oknie dialogowym List Values (zobacz rysunek 12.10) kliknij przycisk
oznaczony symbolem + (jeli jest to konieczne) i wpisz ;   ! 
w polu Item Label. Nacinij Tab i w polu Value wpisz ;   .


Okno dialogowe
List Values

 Kliknij przycisk oznaczony symbolem + ponownie i wpisz .<" = w polu
Item Label. W polu Value wpisz .<".
 Kliknij przycisk oznaczony symbolem + ponownie i wpisz >!  ?
w polu Item Label. W polu Value wpisz >!  . Kliknij OK, aby zamkn

okno dialogowe List Values.


 Umie kursor w lewej dolnej komrce i wybierz z menu polecenie Insert/Form/

Objects/Hidden Field. To pole bdzie uywane do przechowywania numeru ID


produktu (Product ID) dla produktu wskazanego przez uytkownika w trakcie
skadania zamwienia.
Kiedy uytkownik wysya formularz z przypisanym behawiorem serwera o nazwie
Insert Record (bdzie zaimplementowany na nastpnej stronie), wszystkie zmienne
przekazane za porednictwem adresu URL ulegaj skasowaniu. Oznacza to,
e nie bdziesz mia dostpu do ID produktu, dopki nie zostanie umieszczony
on w zmiennej sesji. Aby wykona to zadanie, wstaw warto zmiennej acucha
obejmujc ID produktu (t warto, ktra widnieje w adresie URL) do ukrytego
formularza i przeka j na nastpn stron za pomoc tego formularza. Nastpna
strona przypisuje warto z ukrytego pola do zamiennej sesji. Wszystko to wydaje si
bardzo skomplikowane, ale ju za moment przekonasz si, e jest cakiem proste.
Problemy z przekazywaniem zmiennych
Aby uzyska wicej szczegowych informacji dotyczcych przekazywania zmiennych
na stronach utworzonych w UltraDevie, odwied strony podane poniej i przeczytaj
zamieszczone na nich artykuy. W pierwszym artykule znajduje si omwienie samego
problemu, w drugim podane jest wyjanienie, jak utworzy zmienn sesji.
http://www.macromedia.com.support/ultradev/ts/documents/passingformdata.htm
http://www.macromedia.com.support/ultradev/ts/documents/session.htm

   ! ! 



 Nadaj polu ukrytemu (hidden field) nazw . Wpisz


@9A1=B C  1D D229E w polu Value.

Zmienna acucha   jest przechwycona i umieszczona w polu ukrytym.


Nacinij Enter.
 Umie kursor w lewej dolnej komrce i wybierz z menu polecenie Insert/Form

Objects/Button. Nadaj przyciskowi nazw btSubmit. W inspektorze Property


w polu Label wpisz  . Nacinij Enter.
 Zapisz stron jako  ..

 !     
Naleaoby jeszcze uzyska od uytkownika witryny informacj o preferowanym sposobie zapaty. W witrynie, ktr tworzymy, uytkownik bdzie mia do wyboru trzy sposoby
zapaty: wystawienie faktury i patno przelewem (Bill Me), odbir za zaliczeniem
pocztowym (COD) oraz kart kredytow (Credit Card). Jeli uytkownik zdecyduje si
zapaci kart kredytow, musi wypeni pola, w ktrych poda rodzaj i numer karty
kredytowej oraz dat wanoci. Po wypenieniu odpowiednich pl uytkownik klika
przycisk Submit, co sprawia, e dane przesane s do bazy danych, a nastpnie przekierowywany jest na stron potwierdzenia (finalizowania) zamwienia.

*  +##&  &#
 Utwrz now stron wedug szablonu nrfdefault.
 Usu tekst {erMainData} i zastp go tekstem nastpujcym:
            /     
 &   !    & &      

(#$ *   #$        0+ #%#


 $ , *  '  '& #  # #    #%
   #   %% )+ )
 Nacinij Enter, aby przej do nastpnego wiersza.
 Nie zmieniajc pooenia kursora (w nowym wierszu), wybierz z menu
polecenie Insert/Form. Nadaj nowemu formularzowi nazw >.

Nacinij Enter.
 Wstaw tabel do formularza. Wybierz z menu polecenie Insert/Table. W oknie
dialogowym Insert Table wpisz 6 w polu Rows, . w polu Columns i ustaw
szeroko tabeli (Width) na 789. Wpisz . w polach Border, Cell Spacing i Cell

Padding. Nacinij Enter.


 Zaznacz lew kolumn tabeli. W inspektorze Property kliknij przycisk Align
Right. Ustaw szeroko kolumny na :89.
 Umie kursor w lewym grnym polu i wpisz  (  (sposb zapaty).

Nacinij klawisz Tab, aby przej do kolejnego pola.




    
 Wybierz z menu polecenie Insert/Form Objects/List/Menu. Nadaj nowej licie
rozwijanej nazw   . W inspektorze Property kliknij przycisk List

Values. Podaj wartoci jak na rysunku 12.11. Kliknij OK, aby zamkn okno
dialogowe List Values.


W oknie dialogowym
List Values podaj
warto7ci jak
na rysunku

 W inspektorze Property z listy Initially Selected wybierz warto Bill Me.


 Umie kursor w komrce pod tekstem Payment Method i wpisz F F

G. Nacinij klawisz Tab, aby przej do nastpnego pola.


 Wybierz z menu polecenie Insert/Form Objects/List/Menu. Nadaj nowej licie
rozwijanej nazw F
. Kliknij przycisk List Values i wpisz wartoci jak

na rysunku 12.12 Kliknij OK.




I jeszcze raz w oknie
dialogowym List
Values podaj
warto7ci jak
na rysunku

 W inspektorze Property z listy Initially Selected wybierz None.


 Nacinij Enter. Umie kursor w trzeciej komrce lewej kolumny. Wpisz F
F G. Nacinij klawisz Tab, aby przej do nastpnego pola.
 Wybierz z menu polecenie Insert/Form Objects/Text Field. Nadaj nowemu polu
tekstowemu nazw FF.
 Umie kursor w komrce pod tekstem Credit Card Number i wpisz F
F ?   1H2G. Nacinij klawisz Tab.
 Wstaw nowe pole tekstowe i nazwij je FF?. W inspektorze Property w polu
Max Chars wpisz :.
 Umie kursor w polu poniej tekstu Credit Card Expiration. Wybierz z menu

polecenie Insert/Form Objects/Hidden Field. W polu zostanie umieszczony


element zastpczy (w kolorze tym) oznaczajcy, e w tym miejscu znajduje
si obiekt niewidoczny (zobacz rysunek 12.13).

   ! ! 

"



Element zastpczy
(w kolorze tym)
oznaczajcy, e w tym
miejscu znajduje si
obiekt ukryty

 W inspektorze Property w polu HiddenField wpisz F /". W polu Value
wpisz @9A  1D((;D2 9E.

Wpisana warto powoduje, e parametr CustomerID jest przechwycony ze


zmiennej sesji i umieszczony w polu ukrytym. Poniewa warto jest teraz czci
formularza, moe by pniej przekazana za pomoc behawiora Insert Behavior.
Nacinij Enter. Umie kursor w komrce po prawej stronie pola ukrytego.
 Wybierz z menu polecenie Insert/Form Objects/Hidden Field. W inspektorze
Property w polu HiddenField wpisz   ( . W polu Value wpisz
@9A=B 1D   
D29E. Nacinij Enter.

W polu ukrytym zostanie umieszczona warto informujca o wybranym sposobie


zapaty przekazana ze strony poprzedniej. To, co teraz robimy, polega na zebraniu
wszystkich wartoci w jednym formularzu i przekazaniu ich do bazy danych.
 Umie kursor w prawej dolnej komrce i wstaw do niej przycisk. Nadaj
przyciskowi nazw   . W inspektorze Property w polu Label wpisz  
. Strona z nowym formularzem powinna wyglda jak na rysunku 12.14.
 Aby wstawi wszystkie elementy formularza do bazy danych, w panelu Server

Behaviors kliknij przycisk oznaczony symbolem + i wybierz z menu behawior


Insert Record.
 W oknie dialogowym Insert Record (zobacz rysunek 12.15) wybierz connSales_

Database z listy rozwijanej Connection. Z listy rozwijanej Insert Into Table


wybierz tabel tbOrders.
 W polu After Inserting, Go To wpisz   .
 Poniewa na stronie jest tylko jeden formularz, na licie rozwijanej Get Values

From powinien by wybrany formularz fmNewOrder. W oknie Form Elements


zaznacz slPayment <ignore> i z listy rozwijanej Column wybierz Payment.

"#


    



Strona powinna
wyglda jak
na rysunku



Okno dialogowe
Insert Record

 Zaznacz element lsCardType i z listy rozwijanej Column wybierz CC_Type.


 Wedug tej samej metody pocz element tfCCNumebr z kolumn CC_Number,

tfCC_Exp z kolumn CC_Exp, hfCustomerID z kolumn CusotmerID oraz


hfShipMeth z kolumn Ship_Meth. Okno dialogowe Insert Record powinno
wyglda jak na rysunku 12.16.


Skonfiguruj parametry
w oknie dialogowym
Insert Record jak
na rysunku

   ! ! 

"

 Kliknij OK, aby zamkn okno dialogowe Insert Record. Na stronie pod formularzem

zostanie umieszczony element zastpczy w kolorze tym, co stanowi informacj


o poprawnym przypisaniu behawiora serwera Insert Record do strony.
 Ostatni rzecz, ktra zostaa Ci do zrobienia, jest utworzenie zmiennej sesji

w oparciu o numer ID produktu (Product_No), ktry zosta przekazany z formularza


na poprzedniej stronie. Aby wykona to zadanie, w panelu Data Bindings
kliknij przycisk oznaczony symbolem + i wybierz Session Variable.
 W oknie dialogowym Session Variable wpisz  . Kliknij OK.
 Aby poda warto nowo utworzonej zmiennej sesji, wstaw jedn lini kodu
ASP. Przejd do trybu podgldu kodu (Code View) i odszukaj znacznik @  E.
Przed znacznikiem @  E wpisz:

      
  

en fragment kodu realizuje funkcj przechwycenia wartoci przesanej z pola

hfProdNo na ostatniej stronie i ustawia zmienn sesji ProductNumber rwn


przechwyconej wartoci. Dostp do numeru produktu na stronie jest teraz
moliwy w caej witrynie.
 Przejd do trybu podgldu strony w tym celu kliknij przycisk Show Design View.
 Zapisz stron jako  4.

"    !


Kocowy etap tworzenia sekcji eCommerce polega na utworzeniu strony, na ktrej
uytkownik musi potwierdzi finalizacj zamwienia. Strona ta moe by prosta lub
zoona wybr naley do Ciebie. Niektre firmy decyduj si na to, by na tej stronie
wywietlane byy wszystkie informacje zwizane z zamwieniem, koszt cakowity i dane
adresowe, na ktre zostanie wysana przesyka. Jest to bardzo uyteczny zestaw informacji, poniewa uytkownik moe go wydrukowa i traktowa jako faktur pro forma.
W innych witrynach spotyka si raczej strony z informacj, e proces skadania zamwienia zosta zakoczony. Strona, ktr utworzysz w wiczeniu poniej, bdzie czym
pomidzy tak by mia pojcie, co moesz zmieni, by wstawi wicej elementw
dynamicznych (jeli to konieczne).
Na stronie potwierdzajcej sfinalizowanie zamwienia umiecimy tekst, tabel z niektrymi informacjami dotyczcymi zamwienia oraz formularz. W formularzu umiecimy
trzy pola ukryte z nastpujcymi danymi: ID uytkownika, ID produktu i numer produktu. Kiedy uytkownik zdecyduje si wysa ten formularz, zamwienie zostanie sfinalizowane i rozpocznie si jego realizacja.

,   # !
 Utwrz now stron wedug szablonu nrfdefault.
 Zastp tekst {erMainData} tekstem nastpujcym:

"


    

    


        
       &    &    
I         &         
    

("# $%  )%  


% #-  G  #-  &
- , #-  - # $   % #   ,&
   # * #-  )
 Nacinij Enter, aby przej do kolejnego wiersza.
 Wstaw tabel. Wybierz z menu polecenie Insert/Table. W oknie dialogowym Insert
Table wpisz 5 w polu Rows, . w polu Columns i ustaw szeroko tabeli (Width)
na 789. Wpisz . w polach Border, Cell Spacing i Cell Padding. Kliknij OK.
 Zaznacz lew komrk i w inspektorze Property kliknij przycisk Align Right.
Ustaw szeroko kolumny na :89.
 Wpisz wartoci do komrek zgodne z wartociami na rysunku 12.17.


Wstaw etykiety
tekstowe do tabeli,
tak by wyglday jak
na rysunku

 W panelu Server Behaviors kliknij przycisk oznaczony symbolem + i wybierz

Recordset (Query). W oknie dialogowym Recordset utwrz nowy zestaw rekordw


(zobacz rysunek 12.18). Ten zestaw rekordw pobiera z tabeli tbOrders wszystkie
zamwienia uytkownika (nazwa uytkownika przekazana jest za pomoc
zmiennej sesji). Wyniki s uporzdkowane w porzdku malejcym.
 Kliknij OK, aby zamkn okno dialogowe Recordset.
 W panelu Server Behaviors kliknij zakadk Data Bindings. Kliknij przycisk

oznaczony symbolem + obok zestawu rekordw rsOrders.


 Przecignij wizk danych CustomerID do prawej grnej komrki.

   ! ! 




Utwrz nowy zestaw
rekordw jak
na rysunku

 Przecignij wizk danych Order_No do komrki umieszczonej obok tekstu

Order Number.
 Przecignij wizk danych Order_Date do komrki umieszczonej obok tekstu

Order Date.
 Przecignij wizk danych Ship_Meth do komrki umieszczonej obok tekstu

Shipping Method.
Kolejn rzecz, jak musisz wykona na stronie, jest utworzenie formularza
zawierajcego przycisk. Kliknicie tego przycisku powoduje potwierdzenie
zoenia zamwienia. Kiedy uytkownik kliknie przycisk, strona wyle numer
zamwienia (utworzony na poprzedniej stronie), numer produktu i numer ID
klienta do tabeli tbLineitem, w ktrej biecy numer zamwienia przypisany
do okrelonego rekordu w tabeli tbOrders.
 Zanim jednak bdzie moliwe wstawienie formularza, musisz utworzy zestaw

rekordw, ktrego zadaniem jest odszukanie numeru zamwienia. W panelu


Server Behaviors kliknij przycisk oznaczony symbolem + i wybierz
Recordset (Query).
 W oknie dialogowym Recordset kliknij przycisk Advanced (jeli okno nie jest

ju otwarte w trybie zaawansowanym).


 Nadaj nowemu zestawowi rekordw nazw >. Z listy rozwijanej

Connection wybierz connSales_Database. Wpisz nastpujc instrukcj


w oknie SQL:
 !"#$  %
$&!$  

 Kliknij OK.


 Umie kursor w wierszu pod tabel, w ktrej wywietlone s informacje

o produkcie. Wybierz z menu polecenie Insert/Form. Nadaj nowemu formularzowi


nazw   F.

"$

"%


    
Moliwo wystpienia zamwie% rwnolegych
Powiniene cay czas zdawa sobie spraw z tego, e istnieje prawdopodobiestwo
skadania zamwienia przez dwch (lub wicej) klientw jednoczenie. Jeli pierwszy
klient nie skoczy wypenia swojego formularza zamwienia zanim zostanie
wysany numer nowego zamwienia do drugiego klienta wszystkie produkty
w zamwieniu pierwszego klienta zostan przypisane do numeru zamwienia klienta
drugiego (poniewa by to najwyszy numer w tabeli).
Moliwo zaistnienia takiej sytuacji w witrynach, ktre s czsto odwiedzane przez
uytkownikw i gdzie wystpuje sytuacja jednoczesnego zamawiania produktw przez
kilku klientw, sprawia, e powinno stosowa si inne metody przypisywania numerw.
 Wewntrz nowego formularza wstaw tabel. Wybierz z menu polecenie Insert/
Table. W oknie dialogowym Insert Table wpisz . w polu Rows,  w polu Columns
i ustaw szeroko tabeli (Width) na :89. Wpisz 8 w polach Border, Cell Spacing

i Cell Padding. Kliknij OK.


 Zaznacz dwie komrki. W inspektorze Property kliknij przycisk Align Center.
 W grnej komrce wstaw pole ukryte i nadaj mu nazw . W inspektorze
Property w polu Value wpisz @9A  1D D2 9E

To pole formularza przechowuje numer produktu przekazany przez zmienn sesji.


Prosty sposb umoliwiajcy definiowanie wartoci pola formularza
Zamiast rcznie wpisywa kod dla poszczeglnych pl formularza, moesz zleci
wykonanie tego zadania UltraDevowi. Zaznacz pole formularza i kliknij w inspektorze
Property zakadk Attributes (umieszczon z lewej strony inspektora Property). Kliknij
przycisk oznaczony symbolem +. Odpowiednie wartoci wybierasz z menu
kontekstowego.
Aby okreli rzeczywist (dynamiczn) warto pola formularza kliknij ikon oznaczon
symbolem byskawicy i wybierz zmienn sesji lub pole zestawu rekordw, ktre ma by
przypisane do pola formularza.
 W grnej komrce umie kursor po prawej stronie pola ukrytego i wstaw drugie
pole ukryte. Nadaj nowemu polu nazw F /".
 W inspektorze Property w polu Value wpisz:
@9A1>  / 1DF /"D2J 29E

To pole formularza bdzie zawiera numer ID klienta z zestawu rekordw rsOrders.


 W grnej komrce wstaw dodatkowe pole ukryte i nadaj mu nazw >.

W inspektorze Property w polu Value wpisz:


@9A1>  / 1D?888D2J 29E

To pole formularza bdzie zawiera warto pola Expr1000 utworzonego


w zestawie rekordw rsNewOrder (to jest ten zestaw rekordw, ktry zwraca
najwysz warto w kolumnie Order_No tabeli tbOrders). Poniewa jedynym
zadaniem tego zestawu rekordw jest przechowywanie najwyszej wartoci
w kolumnie Order_No, UltraDev tworzy kolumn zastpcz o nazwie Expr1000.
Wprawdzie masz do czynienia z elementem zastpczym, jednak cay czas moesz
traktowa go jako standardow kolumn bazy danych.

   ! ! 

"&

 W dolnej komrce tabeli wstaw przycisk i nadaj mu nazw   . W inspektorze
Property w polu Label wpisz F  K
 F   3 > (  %&
   #* #-  ).
 Kocowy etap przygotowywania sekcji eCommerce dla witryny Nostalgic Radio

Favorites polega na wstawieniu danych umieszczonych w ukrytych polach


formularza do tabeli tbLineitem. Aby wykona to zadanie, w panelu Server
Behaviors kliknij przycisk oznaczony symbolem + i wybierz behawior
Insert Record.
 W oknie dialogowym Insert Record wybierz connSales_Database z listy

rozwijanej Connection. Z listy rozwijanej Insert Into Table wybierz tabel


tbLineitem.
 W polu After Inserting, Go To wpisz  . To powoduje przekierowanie

uytkownika witryny na stron gwn witryny po sfinalizowaniu transakcji.


 Z listy rozwijanej Get Values From wybierz formularz fmFinalConf jako rdo

wartoci. W oknie Form Elements kliknij hfProdNo <ignored>. Z listy rozwijanej


Columns wybierz Product_No, aby poczy element hfProdNo z polem Product_
No w bazie danych.
 W ten sam sposb pocz element hfCustID z polem CustomerID, a take element

hfOrderNO z kolumn Order_No.


 Kliknij OK.
 Zapisz stron jako   .

   #


   
  
Utworzye wszystkie niezbdne strony, a wic pora rozpocz testowanie. Zamy, e
to Ty jeste klientem, ktry korzysta z sekcji eCommerce witryny Nostalgic Radio
Favorites. Bdziesz musia si zatem zalogowa, wybra produkt i wypeni wszystkie
niezbdne formularze. Po zoeniu zamwienia powiniene zobaczy stron potwierdzenia, jak zobacz klienci zaprojektowanego przez Ciebie sklepu internetowego.

-  "   
 Uruchom przegldark. Otwrz stron http://localhost/insideud4/default.asp.
 Kliknij cze Login. Na stronie login.asp wpisz   w polu Username
i   w polu Password. Kliknij przycisk Submit. Powinna wywietli si

strona potwierdzajca, e dane wpisane przez Ciebie odpowiadaj danym konta


uytkownika zarejestrowanego.
 Kliknij przycisk Bargain Bin widoczny z lewej strony. Zostan wywietlone

wszystkie pozycje z bazy danych w cenie mniejszej ni 6$ (zobacz rysunek 12.19).

"'


    



Na stronie Bargain
Bin wy7wietlane s
wszystkie produkty
w cenie mniejszej
ni 6$

 Kliknij cze The Limping Ghost, aby otworzy stron z informacjami

o wskazanym epizodzie.
 Na stronie z informacjami szczegowymi o produkcie kliknij cze Purchase

This Title. Zostanie wywietlona strona (zobacz rysunek 12.20) z danymi


adresowymi uytkownika (ktre w tym momencie mona dowolnie
zmodyfikowa) pobranymi z bazy danych.


Uytkownik witryny
ma moliwo7
zmodyfikowania
danych adresowych
(adres odbiorcy
zamwionych
towarw)

 Kliknij przycisk Next Step.

Na stronie, na ktrej potwierdzasz, e wybrany towar jest tym, ktry rzeczywicie


chcesz otrzyma, wybierasz sposb dostawy przesyki (zobacz rysunek 12.21).

   ! ! 

"



Uytkownik potwierdza
zamwienie wybranego
towaru i wybiera
form przesyki

 Z listy rozwijanej Shipping Type wybierz Overnight Express i kliknij przycisk

Next Step.
 Na stronie wyboru formy patnoci wybierz patno kart kredytow (Credit Card).
 Z listy rozwijanej Credit card Type wybierz Visa.
 W polu Credit Card Number wpisz 888888888 (dziesi zer).
 W polu Credit Card Expiration wpisz 8H8. Strona powinna wyglda jak

na rysunku 12.22.


Wybierz dane
dotyczce sposobu
zapaty tak, jak
pokazano na rysunku

 Kliknij przycisk Final Step.

"


    
 Uytkownik widzi teraz na stronie numer zamwienia (Order Number),

dat zamwienia oraz wybrany rodzaj przesyki zamwionych produktw


(zobacz rysunek 12.23).


Zamwienie zostao
zoone

 Kliknij przycisk, aby sfinalizowa zamwienie.


 Zminimalizuj okno przegldarki.

Wiesz ju, jak konstruowa systemy umoliwiajce dokonywanie prostych, pojedynczych transakcji on-line. Moesz jednak pj krok dalej i rozbudowa te systemy, tak aby
moliwe byo zoenie zamwienia na kilka produktw w jednej sesji zamwienia. Aby
wykona to zadanie, zastosujemy rozszerzenie UltraDeva o nazwie UltraDev Shopping
Cart opracowane przez Ricka Crawforda, prezesa firmy PowerClimb (http://www.powerclimb.com/powerclimb/). Rozszerzenie to byo opracowane najpierw dla UltraDeva 1.
Joseph Scavitto opracowa uaktualnienie dla UltraDeva w wersji 4.
Stosujc wersj UltraDev Shopping Cart dla UltraDeva 4, moesz sprawi, e uytkownicy
witryny bd mogli dodawa rekordy do wirtualnych koszykw (dane o produktach
przechowywane s w zmiennych sesji a do momentu, kiedy uytkownik ostatecznie
potwierdzi zamwienie). Kiedy rozpoczyna si proces finalizowania zamwienia (w wyniku
przekazania zmiennych), uytkownik musi wykona podobne czynnoci jak w przypadku
modelu realizujcego zoenie zamwienia na jeden wybrany produkt. Tak naprawd
najwiksz rnic jest formularz kocowy wysyany przez uytkownika. Kiedy uytkownik klika przycisk, aby wysa formularz, wszystkie produkty umieszczone w koszyku

   ! ! 

""

wstawiane s do tabeli tbLineitem (funkcja ta realizowana jest za pomoc wbudowanego


behawiora rozszerzenia), natomiast numer ID zamwienia przypisywany jest do zamwionych produktw.

$ 
% &' (   )*+
Aby zainstalowa UltraDev Shopping Cart, musisz najpierw pobra plik w odpowiedniej
wersji (1.2) i zainstalowa rozszerzenie za pomoc menedera rozszerze (Extension
Manager). Cao zadania sprowadza si do pobrania na dysk lokalny jednego pliku o rozszerzeniu .mxp i dwukrotnego kliknicia ikony pliku. Reszt wykona Extension Manager,
dodajc do UltraDeva wszystkie niezbdne behawiory serwera i obiekty menu. Po zainstalowaniu rozszerzenia bdziesz mg korzysta z opcji doczania wirtualnego koszyka
(panel Server Behaviors)

.  /  +012$ 
 Zamknij UltraDeva.
 W przegldarce w polu Adres wpisz  GHH H H.

Pobierz rozszerzenie UltraDev Shopping Cart 1.2. (UC_Cart_V12_Beta2).


 W przegldarce w polu Adres wpisz  GHH    H
 !H. Pobierz uaktualnienie rozszerzenia UltraDev Shopping Cart 1.2

dla UltraDeva 4 (UD4CartPatch).


 Zminimalizuj okno przegldarki i odszukaj katalog, w ktrym zapisae pliki.
 Kliknij dwukrotnie plik UC_Cart_V12_Beta2.mxp, aby rozpocz instalacj

rozszerzenia. Przeczytaj warunki korzystania z rozszerzenia (zobacz rysunek 12.24)


i kliknij przycisk Accept.


Warunki korzystania
z rozszerzenia
UltraDev
Shopping Cart

$##


    
 Kliknij OK w okienku pop-up potwierdzajcym pomyln instalacj

rozszerzenia.
 W menederze rozszerze (Extension Manager) zapoznaj si z informacjami

o funkcjach rozszerzenia (zobacz rysunek 12.25) i sprawd, jakie behawiory


zostay dodane do UltraDeva.


Meneder rozszerze?
(Macromedia
Extension Manager)

 Zminimalizuj okno menedera rozszerze i odszukaj na dysku plik

UD4Cartpatch.mxp. Kliknij plik dwukrotnie.


 Kliknij przycisk Accept, aby zaakceptowa warunki stosowania rozszerzenia.

Instalowane pliki zastpi stare pliki rozszerzenia UltraDev Shopping Cart nowymi,
uaktualnionymi plikami (zobacz rysunek 12.26). Pliki rozszerzenia nie zastpi
adnego z plikw aplikacji UltraDev nadpisane zostan jedynie pliki
poprzedniej wersji rozszerzenia. Kliknij przycisk Yes To All.


Instalacja
uaktualnienia
powoduje zastpienie
starszych wersji
plikw plikami
nowszymi
 W okienku pop-up informujcym, e instalacja przebiega pomylnie, kliknij OK.
 Zamknij menedera rozszerze.

   ! ! 

$#

&   , % &' (  


Masz ju zainstalowane rozszerzenie UltraDev Shopping Cart. Musisz teraz skonfigurowa
opcje wirtualnego koszyka, tak by dziaa prawidowo na stronach witryny. Konfiguracja
polega na okreleniu czasu przetrzymywania wybranych pozycji w wirtualnym koszyku
(po opuszczeniu witryny przez uytkownika) oraz rodzaju danych, ktre powinny by
przechowywane w wirtualnym koszyku.

3  4! #
 Uruchom UltraDeva.
 Otwrz stron spotlight_items_details.asp. Jest to strona, ktra jak zapewne

pamitasz wywietla szczegowe informacje o produktach oznaczonych


jako Spotlight Items w bazie danych.
 W panelu Server Behaviors kliknij przycisk oznaczony symbolem + i wybierz

z menu UltraDev Shopping Cart/UltraDev Shopping Cart. Zostanie wywietlone


okno dialogowe UltraDev Shopping Cart (zobacz rysunek 12.27).


Okno dialogowe
UltraDev Shopping
Cart tutaj
definiujesz parametry
wirtualnego koszyka

 W polu Cart Name wpisz =F . W polu Days wpisz 8 (aby wyczy opcj

korzystania z cookies).
Stosowanie cookies do zapamitywania zawartoci koszyka
Domylnie, kiedy uytkownik koczy korzystanie z witryny lub koczy sesj, zawarto
jego koszyka jest kasowana. Jeli jednak chciaby zachowa zawarto koszyka
nawet w momencie zakoczenia sesji, moesz w oknie dialogowym UltraDev Shopping
Cart w polu Days (Client cookie expiration) wpisa warto rn od zera. Wybrana
warto oznacza liczb dni, przez jakie zawarto koszyka bdzie zapamitana w pliku
cookie (nawet po zakoczeniu sesji uytkownika).

$#


    
 Aby koszyk dziaa poprawnie wymagane jest zaznaczenie kolumn ProductID,

Quantity, Name, Price i Total. Wprawdzie koszyk wymaga, aby kolumny te


byy skojarzone z behawiorami, nie jest jednak konieczne stosowanie wszystkich
kolumn do dodawania produktw do koszyka.
 Nie zmieniaj domylnych kolumn koszyka. Kliknij OK, aby zamkn okno

dialogowe. Panel Server Behaviors (zobacz rysunek 12.28) powinien zawiera


behawior UltraDev Shopping Cart.


Behawior UltraDev
Shopping Cart
dodany na stron

 
  
Aby uytkownik mg wstawi wybrany produkt do wirtualnego koszyka, musi znale
na stronie jaki element, ktry to zadanie zrealizuje. W naszym przypadku wykorzystamy
stron z informacjami o produkcie, na ktrej uytkownik (po zapoznaniu si z danymi
na temat produktw) bdzie mg zdecydowa, czy chce wstawi produkt do koszyka,
czy nie.
Aby mona byo dawa produkty do koszyka na stronie z informacjami o produkcie,
wstawimy prosty formularz zawierajcy pole tekstowe i przycisk Add To Cart. W polu
tekstowym uytkownik wpisuje liczb zamawianych produktw, natomiast, klikajc
przycisk Submit, powoduje przesanie danych formularza do koszyka. Informacje
o produkcie i liczba zamwionych produktw umieszczane s w zmiennych sesji koszyka
a do chwili, kiedy zostan odczytane w wyniku sfinalizowania zamwienia.

5   
 #
 Otwrz stron spotlight_items_details.asp. Umie kursor w wierszu pod tabel

z informacjami o produkcie. Wybierz z menu polecenie Insert/Form.


 Nadaj nowemu formularzowi nazw L
F .
 Kliknij w dowolnym miejscu w tabeli. Nacinij prawy przycisk myszy i wybierz

z menu kontekstowego polecenie Table/Select, aby zaznaczy tabel zawierajc


informacje o produkcie.

   ! ! 

$#$

 Kliknij ciemne obramowanie w lewym grnym rogu tabeli i przecignij tabel

do formularza fmAddToCart. Wskanik myszy powinien wyglda jak krzyyk


z ramionami w postaci strzaek.
 W prawej dolnej komrce kliknij tekst {rsResults_Page_Details.Description}

i nacinij klawisz Tab. Nowy rzd zosta wstawiony do tabeli (zobacz


rysunek 12.29).


Tabela znajduje si
wewntrz formularza;
zosta rwnie
wstawiony nowy rzd
w tabeli

 W lewej dolnej komrce wpisz C G. Zaznacz tekst i zmie czcionk

na Arial, Helvetica, sans-serif. Nacinij klawisz Tab.


 Trzymajc kursor cay czas w prawej dolnej komrce, wybierz z menu polecenie

Insert/Form Objects/Text Field. Nadaj nowemu polu tekstowemu nazw


C . W inspektorze Property w polu Char Width wpisz ., natomiast
w polu Max Chars wpisz .. Wpisane wartoci powoduj, e maksymalna liczba
produktw, jakie mona umieci w koszyku, wynosi 99.
 Umie kursor z prawej strony nowego pola tekstowego i wybierz z menu

polecenie Insert/Form Objects/Button.


 Nadaj nowemu przyciskowi nazw   . W inspektorze Property w polu
Label wpisz L
 F .
 W panelu Server Behaviors kliknij przycisk oznaczony symbolem + i wybierz

UltraDev Shopping Cart/Add To Cart Via Form. Zostanie wywietlone okno


dialogowe Add To Cart Via Form (zobacz rysunek 12.30).

$#%


    



Okno dialogowe
Add To Cart Via Form
umoliwia konfiguracj
opcji przesyania
zawarto7ci formularza
bezpo7rednio
do koszyka

 W oknie dialogowym Add To Cart Via Form wybierz fmAddToCart z listy

rozwijanej Form i w oknie Cart Columns kliknij kolumn ProductID. Zaznacz


opcj Recset col i z listy rozwijanej obok wybierz Product_No, aby kolumna
ProductID w koszyku bya uaktualniana danymi z kolumny Product_No
w zestawie rekordw.
 Kliknij kolumn Quantity i wybierz opcj uaktualniania jej zawartoci danymi

z pola tekstowego tfQuantity w formularzu.


 Kliknij kolumn Name i wybierz opcj uaktualniania jej zawartoci danymi

z kolumny Episode_Title w zestawie rekordw.


 Kliknij kolumn Price i wybierz opcj uaktualniania jej zawartoci danymi

z kolumny Price w zestawie rekordw.


 Sprawd, czy z listy rozwijanej Recordset wybrany jest zestaw rekordw

rsResults_Page_Details oraz czy z listy rozwijanej Index column wybrana


jest kolumna Product_No.
 Wpisz !   w polu Go To URL.
 Kliknij OK, aby zamkn okno dialogowe.
 Zapisz stron.

     #


 
Za kadym razem, gdy uytkownik wstawia wybrany produkt do koszyka, chciaby mie
moliwo zobaczenia tego, co si w koszyku znajduje. Na wszystkich stronach z informacjami o produktach umiecie ju cza, ktre umoliwiaj przejcie na stron z zawartoci koszyka. Teraz musisz utworzy stron z zawartoci koszyka.

   ! ! 

$#&

Strona, ktr zamierzamy utworzy, jest bardzo podobna do strony spotlight_items_


details.asp uyjemy tabeli z nagwkami, elementami dynamicznymi i behawiorem
Repeat Region odpowiedzialnym za wywietlanie listy wszystkich produktw w koszyku.
Uytkownik moe na stronie z zawartoci koszyka zmieni liczb zamwionych produktw lub usun wszystkie z koszyka. Ponadto na stronie tej zostanie umieszczone cze
do pierwszej strony skadania zamwienia.

6 " #%!# ' #
 Otwrz stron view_cart.asp.
 Pierwsz rzecz, jak powiniene zrobi, jest sprawdzenie, czy utworzony

koszyk jest dostpny. Aby wykona to zadanie, otwrz stron spotlight_items_


details.asp i prawym przyciskiem myszy kliknij behawior serwera o nazwie
UltraDev Shopping Cart. Z menu kontekstowego wybierz opcj Copy. Przejd
na stron view_cart.asp i prawym przyciskiem myszy kliknij wewntrz panelu
Server Behaviors i wybierz opcj Paste. Koszyk powinien by wstawiony na stron.
 Teraz chciaby, eby uytkownik by przekierowywany na inn stron, w przypadku

gdy jego koszyk jest pusty. Aby wykona to zadanie, kliknij w panelu Server
Behaviors przycisk oznaczony symbolem + i wybierz behawior UltraDev
Shopping Cart/Redirect If Empty. W oknie dialogowym Redirect If Empty
(zobacz rysunek 12.31) wpisz    w polu Go To URL. Kliknij OK.


Okno dialogowe
Redirect If Empty

 W obszarze edytowalnym erMainData zastp biecy tekst nastpujcym

fragmentem tekstu:

           =  ! M K  
                  
        /     ! 
    &      B   8      

("# $% # #,)  #-             = 


! M >  # +*
% # ;)% # -&  # *
# +* #  #%N      #  #-   0+
# '*  # #&  # 8    % # +*)
 Nacinij Enter.
 Wybierz z menu polecenie Insert/Form. Nadaj nowemu formularzowi nazw
(F .
 Wstaw now tabel wewntrz formularza. Wybierz z menu polecenie Insert/Table.
W oknie dialogowym Insert Table wpisz . w polu Rows, : w polu Columns
i ustaw szeroko tabeli (Width) na O89. Wpisz  w polach Border, Cell Spacing

i Cell Padding.

$#'


    
 W selektorze znacznikw umieszczonym na pasku stanu kliknij @ E, aby zaznaczy

jeden rzd tabeli. W inspektorze Property kliknij przycisk Align Center.


 Umie kursor w komrce po lewej stronie i wpisz  . Nacinij

klawisz Tab.
 W drugiej komrce wpisz ?  . Nacinij klawisz Tab.
 W trzeciej komrce wpisz C . Nacinij klawisz Tab.
 W czwartej komrce wpisz  . Nacinij klawisz Tab.
 W pitej komrce wpisz
  . Nacinij klawisz Tab.
 Uaktywnij panel Data Bindings i kliknij ikon oznaczon symbolem +

umieszczon obok koszyka (UltraDev Shopping Cart). Masz teraz dostp


do wszystkich kolumn koszyka (zobacz rysunek 12.32).


Panel Data Bindings
umoliwia dostp
do kolumn
przechowywanych
w koszyku

 W panelu Data Bindings chwy kolumn ProductID i przecignij j do pustej

komrki poniej tekstu Product Number.


 Przecignij kolumn Name do komrki pod Episode Name.
 W komrce pod tekstem Quantity wstaw pole tekstowe wybierz w tym celu

polecenie Insert/Form Objects/Text Field. W inspektorze Property w polu TextField


wpisz C , natomiast w polach Char Width i Max Chars wpisz ..
 W panelu Data Bindings chwy kolumn Quantity koszyka i przecignij j

do pola tekstowego tfQuantity. W polu tym bdzie wywietlana liczba produktw


dodanych do koszyka. Uytkownik moe zmieni t liczb i klikn odpowiedni
przycisk (Update Cart) przesyajcy formularz do koszyka, aby zmodyfikowa
liczb zamwionych produktw.
 Przecignij kolumny Price i Total do odpowiednich komrek w tabeli.

   ! ! 

$#

 Zaznacz dolny rzd tabeli i w inspektorze Property kliknij przycisk Align Center.

Uaktywnij panel Server Behaviors i kliknij przycisk oznaczony symbolem +.


Wybierz z menu UltraDev Shopping Cart/Repeat Cart Region. Ten behawior
serwera powoduje, e wszystkie produkty w koszyku s wywietlane na stronie.
Repeat Region kontra Repeat Cart Region
Do tej pory, kiedy chcielimy powtrzy zawarto tabeli, uywalimy behawiora
serwera o nazwie Repeat Region. Behawior ten aby funkcjonowa poprawnie
wymaga jednak zdefiniowania zestawu rekordw. Poniewa w wirtualnym koszyku
do wywietlania zawartoci wykorzystywane s zmienne sesji (a nie wizki danych
z zestawu rekordw), behawior serwera Repeat Region nie znajduje tutaj zastosowania.
Zamiast niego naley zastosowa wbudowany behawior Repeat Cart Region, ktrego
zadaniem jest powtarzanie zawartoci obszaru a do momentu, gdy wpisy w zmiennych
sesji zostan wywietlone.
 Umie kursor z prawej strony tabeli i nacinij Enter.
 W nowym wierszu wpisz 3 !   12     
    ((# P  #-  # # ,   )

Pamitaj, aby wstawi spacj midzy wyrazami have (masz) i episode


(tytuw) oraz po wyrazie is. Nacinij Enter.
 W panelu Data Bindings chwy kolumn [numItems] i wstaw j midzy sowa

have i items
 Za sowem is wstaw kolumn Total.
 Umie kursor w nastpnym wierszu i wstaw now tabel. Wybierz z menu
polecenie Insert/Table. W oknie dialogowym Insert Table wpisz  w polu Rows,
. w polu Columns i ustaw szeroko tabeli (Width) na :89. Wpisz 8 w polach

Border, Cell Spacing i Cell Padding. Nacinij Enter.


 W lewej komrce nowej tabeli wstaw przycisk i nadaj mu nazw  ; .
W inspektorze Property w polu Label wpisz ;  F .
 W prawej komrce wpisz Q
 F . Zaznacz tekst i kliknij przycisk

oznaczony symbolem +. Wybierz z menu Go To Related Page.


 W oknie dialogowym Go To Related Page wpisz    w polu

Related Page i zaznacz opcj URL Parameters. Kliknij OK.


 Zaznacz przycisk Update Cart i w panelu Server Behaviors kliknij przycisk

oznaczony symbolem +. Wybierz z menu UltraDev Shopping Cart/Update


Cart. W oknie dialogowym Update Cart (zobacz rysunek 12.33) sprawd, czy
z listy rozwijanej Form wybrany jest formularz fmManageCart oraz czy z listy
rozwijanej Form element wybrane jest pole tekstowe tfQuantity.


Okno dialogowe
Update Form pozwala
zdefiniowa, ktre
elementy koszyka
maj by
uaktualniane

$#


    
 W polu Go To URL wpisz !  . Zmiana zawartoci koszyka powoduje

ponowne zaadowanie strony view_cart.asp. Kliknij OK. Koszyk wirtualny


powinien wyglda jak na rysunku 12.34.


Kompletny koszyk
na stronie

 Zapisz stron.

- ,
   
Kiedy uytkownik doda ju wszystkie interesujce go produkty do koszyka, moe rozpocz proces skadania i finalizowania zamwienia klika w tym celu odpowiednie
cze na stronie z zawartoci koszyka. Zasadnicza rnica midzy systemem skadania
zakupw na jeden wybrany produkt (single transaction) a systemem z koszykiem wirtualnym polega na zastosowaniu wbudowanego behawiora rozszerzenia UltraDev
Shopping Cart. Behawior ten ma zadanie cay czas odczytywa zawarto koszyka,
umieszcza j w nowej tabeli oraz przypisywa numer zamwienia do kadego zamwionego produktu, dziki czemu baza danych moe przypisywa jeden numer zamwienia
do rnych produktw.

 "  #$ #
#!
 Otwrz stron purchase_step1.asp. Zapisz j jako   .

Na stronie cart_checkout.asp kliknij dwukrotnie behawior serwera o nazwie


Update Record i w polu After Updating, Go To wpisz   ..
Kliknij OK.
 Zapisz stron.

   ! ! 

$#"

 Otwrz stron purchase_step2.asp i zapisz j jako   ..


 Zaznacz cztery grne rzdy w tabeli zawierajcej informacje o produkcie

i nacinij przycisk Delete.


 Zaznacz tekst u gry strony i nacinij Delete. Wpisz       
  (R #  $   #, ).
 Zaznacz formularz fmOrderInfo umieszczony na stronie i w polu Action wpisz
  4.
 Zapisz stron.
 Otwrz stron purchase_step3.asp utworzon wczeniej i zapisz j jako
  4.

Aby strona dziaaa poprawnie, musisz doczy koszyk (UltraDeev Shopping Cart)
utworzony na stronie. Aby wykona to zadanie, przejd na stron view_cart.asp
i kliknij prawym przyciskiem myszy na UltraDev Shopping Cart widoczny
w panelu Server Behaviors. Z menu kontekstowego wybierz Copy.
 Przejd na stron cart_checkout3.asp i kliknij prawym przyciskiem myszy

w panelu Server Behaviors. Wybierz polecenie Paste. UltraDev Shopping Cart


powinien by widoczny na licie behawiorw serwera przypisanych do biecej
strony.
 W panelu Server Behaviors kliknij dwukrotnie behawior serwera o nazwie

Insert Record.
 W oknie dialogowym Insert Record usu tekst z pola After Inserting, Go To.

Pole to powinno by puste (zobacz rysunek 12.35). Kliknij OK.




Okno dialogowe
Insert Record

Zanim wstawienie cakowitej zawartoci koszyka do tabeli tbLineitem bdzie


moliwe, musisz najpierw zdoby numer zamwienia (wygenerowany dla
konkretnego zamwienia). Aby wykona to zadanie, utwrz zestaw rekordw,
ktry bdzie zawiera tylko zamwienie o najwyszym numerze.
 W panelu Server Behaviors kliknij przycisk oznaczony symbolem + i wybierz

Recordset (Query).
 W oknie dialogowym Recordset kliknij przycisk Advanced (jeli okno nie znajduje

si w trybie Simple).

$#


    
 Utwrz zestaw rekordw identyczny jak na rysunku 12.36. Ten zestaw rekordw

ma zadanie przeszuka tabel tbOrders i znale najwyszy numer zamwienia.


Poniewa w polu Order_No wpisana jest warto (Autonumer), najwyszy
numer zamwienia jest, rzecz jasna, numerem ostatniego zamwienia.


Ten zestaw rekordw
odnajduje najwysz
warto7 w polu
Order_No

 Po utworzeniu zestawu rekordw kliknij przycisk OK, aby zamkn okno

dialogowe Recordset.
Skoro moliwe jest ju okrelenie numeru zamwienia, ktry powinien by
przypisany do produktw w koszyku, musisz teraz wstawi zamwione produkty
do tabeli tbLineitem i skojarzy wszystkie nowe rekordy w tabeli z waciwym
numerem zamwienia. Aby wykona to zadanie, moesz zastosowa wbudowany
behawior serwera rozszerzenia UltraDev Shopping Cart.
 Zaznacz przycisk Final Step. W panelu Server Behaviors kliknij przycisk oznaczony

symbolem + i wybierz z menu UltraDev Shopping Cart/Save Cart To Table.


Musisz uy behawior serwera o nazwie Insert Record lub Update Record
Zanim bdzie moliwe przypisanie behawiora serwera o nazwie Save Cart To Table,
musisz najpierw przypisa behawior serwera o nazwie Insert Record lub Update
Record. Poniewa na naszej stronie behawior serwera Insert Record jest ju
umieszczony, wic nie ma si o co martwi.
 W oknie dialogowym Save Cart To Table (zobacz rysunek 12.37) wybierz

connSales_Database z listy rozwijanej Connection i tbLineitem z listy


rozwijanej Table.
 Zaznacz kolumn ProductID i z listy rozwijanej Destination Column wybierz

Product_No. W rezultacie kolumna Product_No w tabeli tbLineitem zostanie


okrelona jako odbiorca danych przechowywanych w kolumnie Product_No
koszyka.
 Stosujc t sam metod, pocz kolumn Quantity w koszyku z kolumn Qty

w tabeli tbLineitem.

   ! ! 

$



Okno dialogowe
Save Cart To Table
pozwala zdefiniowa,
ktre dane
umieszczone
w koszyku maj
by wstawione
do bazy danych

 Z listy rozwijanej Destination column wybierz Order_No.


 Kliknij przycisk oznaczony symbolem byskawicy (obok pola Unique ID value).

W oknie dialogowym Dynamic Data (zobacz rysunek 12.38) kliknij ikon


oznaczon symbolem + widoczn obok zestawu rekordw rsNewOrder.
Wybierz kolumn Expr1000. Kliknij OK.


Okno dialogowe
Dynamic Data

 W polu Go To URL wpisz     . Okno dialogowe

Save Cart To Table powinno wyglda jak na rysunku 12.39


 Kliknij OK.
 Zapisz stron.
 Utwrz now stron wedug szablonu nrfdefault.

$


    



Okno dialogowe
Save Cart To Table
powinno wyglda
jak na rysunku

 Usu tekst {erMainData} i wpisz:

        3          
    B      

("# $% # #,)  #-   S-   %     #% 


R, #-   - $#   $ #  #  
 )
 Zapisz stron jako     .

$  !   


Musisz jeszcze utworzy prost stron, ktrej zadaniem jest wywietlenie informacji
ostrzegajcej uytkownika o braku produktw w koszyku. Strona ta moe by dowolnie
skomplikowana, ale jej nazwa musi by dokadnie taka, jak podae w trakcie konfigurowania koszyka.


 " # #
&! #
 Utwrz now stron wedug szablonu nrfdefault.
 Usu tekst {erMainData} i wpisz 3        
(
-% # %  )
 Zapisz stron jako   .

   ! ! 

$$

     


Wszystkie strony s ju przygotowane, moesz wic sprawdzi, czy wszystkie funkcje
dziaaj poprawnie. Przetestujemy, czy uytkownik moe dodawa produkt do koszyka,
zmienia jego zawarto, usuwa produkty, a nastpnie finalizowa zamwienie.

(  "  #
 Zminimalizuj UltraDeva i otwrz przegldark.
 W polu Adres wpisz  GHH   H  5.
 Na stronie gwnej witryny kliknij cze Login.
 Na stronie login.asp wpisz   w polu Username i   w polu

Password. Kliknij przycisk Submit. Na stronie zostanie wywietlona informacja,


e zalogowanie powiodo si.
 Kliknij przycisk View Cart. Zostaniesz przekierowany na stron informujc

o braku produktw w koszyku (zobacz rysunek 12.40).




Poniewa koszyk
jest pusty, zostae7
przekierowany
na t stron

 Kliknij przycisk Spotlight Items. Na stronie Spotlight Items kliknij cze

Presidential Election. Moesz doda wybrany produkt do koszyka


(zobacz rysunek 12.41).
 W polu Quantity wpisz .. Kliknij przycisk Add To Cart. W koszyku znajduj si

wybrane produkty (zobacz rysunek 12.42).


 W polu Quantity wpisz . Kliknij przycisk Update Cart. Strona zostanie

automatycznie odwieona, natomiast jeden z produktw zostanie usunity


z koszyka.

$%


    



Przycisk Add To Cart
jest umieszczony
na stronie



Wybrane produkty
zostay umieszczone
w koszyku

 Kliknij przycisk Spotlight Items ponownie, lecz tym razem kliknij cze The
Thing On The Furble Board. Dodaj . sztuki wybranego produktu do koszyka

i kliknij przycisk Add To Cart.


 Na stronie View Cart kliknij cze Go To Checkout. Zostaniesz przekierowany

na pierwsz stron procesu skadania zamwienia, na ktrej potwierdzasz, czy


adres dostarczenia przesyki (przechowywany w tabeli tbCustomers) jest
poprawny.
 Kliknij przycisk Next Step.

   ! ! 

$&

 Jako sposb dostawy przesyki wybierz Overnight Express z listy rozwijanej

Shipping Type. Kliknij przycisk Next Step.


 Wybierz Credit Card jako form zapaty. W polu Credit Card Type wpisz
( F. Wpisz 8888888888 (dziesi zer) jako numer karty kredytowej,
natomiast jako dat wanoci karty wpisz 8H8. Kliknij przycisk Final Step.
 Zamwienie zostao zoone (zobacz rysunek 12.43).


Zamwienie zostao
sfinalizowane

Zoye zamwienie. Otwrz baz danych i sprawd zawarto tabeli tbOrders i tabeli
tbLineitem. W kadej z nich powinny by umieszczone odpowiednie dane. W tym momencie mgby jeszcze doda specjaln sekcj (do sekcji administracyjnej), za pomoc
ktrej moliwe byoby przeszukiwanie wszystkich rekordw bazy danych w tabeli
tbOrders i tbLineitem. Takie rozwizanie umoliwioby Ci monitorowanie zamwie
(zamwionych produktw i dat zoenia zamwie). Alternatywny sposb polega na
skonfigurowaniu systemu powiadamiania o zoeniu zamwienia za pomoc e-maila
dziki czemu wiesz, kiedy zamwienie zostao zoone, ktre produkty zostay wybrane
i do kogo powinny by wysane.

W tym rozdziale miae okazj zapozna si z dwiema metodami implementacji stron


do handlu przez Internet (eCommerce). Stosujc pierwsz metod, utworzye system
umoliwiajcy zoenie zamwienia na jeden wybrany produkt (single transaction system). Stosujc drug, moge rozbudowa pierwszy system o opcj dodawania wirtualnego koszyka (shopping cart) umoliwiajc uytkownikowi witryny dodawanie wielu
produktw do koszyka i zoenie jednego zamwienia na wybrane produkty.
W nastpnym rozdziale zademonstrujemy funkcje UltraDeva umoliwiajce tworzenie
witryn do nauczania interaktywnego przez Internet. Nauczysz si tworzy quizy z systemem wystawiania ocen i zapisywania wynikw w bazie danych.

You might also like