W rozdziale tym postaram się zaprezentować działanie kolejnych kilku popularnych kontrolek, które będziemy mogli wykorzystywać w swoich projektach.
Często spotykana jest sytuacja, w której użytkownik musi zapisać jakiś plik na serwerze za pośrednictwem formularza. Przykładowo może być to zdjęcie, dołączone do swoich danych lub też awatar na forum internetowym. W ASP.NET funkcjonalność tą łatwo możemy zrealizować używając do tego kontrolki FileUpload.
Pierwszym krokiem, który musimy uczynić jest dodanie nowej formatki, lub utworzenie nowego projektu w Visual Studio. Następnie musimy wybrać lokalizację, w której będzie zapisywany plik na serwerze. Proponuje utworzyć nowy katalog w ramach naszego projektu. W tym celu w oknie Solution Explorera klikamy prawym przyciskiem myszy na ścieżkę dostępu do naszego projektu i wybieramy opcje: Add Folder -> Regular Folder. Utworzony folder nazwijmy „UploadedFiles" (lub inaczej, wedle własnego uznania, będziemy musieli wówczas jednak zmienić ścieżkę dostępu w kodzie strony, odpowiedzialnym za zapisywanie plików na serwerze). Następnie na otwartą formatkę przeciągnijmy elementy typu: FileUpload, Button oraz Label. Po zmianie właściwości Text przycisku oraz pola Label moja formatka wygląda następująco:
Kliknijmy teraz dwukrotnie na zamieszczonym na formatce przycisku, co spowoduje dodanie funkcji wywoływanej w momencie jego naciśnięcia. Zmodyfikujmy ją w następujący sposób:
protected
void Button1_Click(object
sender, EventArgs e)
{
HttpPostedFile file1 =
this.FileUpload1.PostedFile;
if ((file1 !=
null)
&& (file1.ContentLength > 0))
{
fileName =
System.IO.Path.GetFileName(file1.FileName);
string saveLocation =
Server.MapPath("UploadedFiles\\" + fileName);
try
{
file1.SaveAs(saveLocation);
this.Label1.Text
= "Plik został zapisany na serwerze";
}
catch(Exception ex)
{
this.Label1.Text
= "Wystąpił błąd: " +ex.Message;
}
}
else
{
this.Label1.Text = "Nie podałeś lokalizacji
pliku na dysku, lub plik ten jest nieprawidłowy";
}
}
Na początku następuje utworzenie obiektu, typu HttpPostedFile (nasza formatka FileUpload, nosi w tym przypadku domyślną nazwę FileUpload1). Następnie sprawdzamy, czy zadany plik istnieje, w przeciwnym wypadku użytkownik otrzyma na stronie stosowną informację. W przypadku poprawnego pliku, kolejnym krokiem jest pobranie jego nazwy oraz utworzenie łańcucha znakowego, zawierającego przyszłą lokalizację pliku na serwerze (uwaga – katalog „UploadedFiles" musi istnieć w systemie przed pierwszym uruchomieniem aplikacji, w przeciwnym razie w momencie próby zapisania pliku otrzymamy komunikat o błędzie). Następnie plik jest zapisywany na w odpowiednim miejscu na serwerze, za pomocą metody „SaveAs" obiektu typu HttpPostedFile. Użytkownik zobaczy również w oknie przeglądarki tekst, informujący o poprawnym przebiegu operacji.
@STRONA@Wyobraźmy sobie teraz sytuację, w której chcemy wyświetlić na stronie wszystkie obrazy, zawarte w naszym katalogu (oczywiście na serwerze możemy umieszczać nie tylko pliki zawierające obrazy, na potrzeby tego artykułu przyjąłem jednak uproszczenie, że tylko takie obiekty będą się w nim znajdować). Wykorzystamy do tego kontrolkę „Image". Tym razem, nie będziemy jednak umieszczać jej na stronie, przeciągając kontrolkę na naszą formatkę z pasku narzędzi. Ponieważ nie wiemy ile obrazów znajdować się będzie we wskazanym przez nas katalogu, kolejne obiekty klasy Image będą dodawane na stronę w sposób dynamiczny, tzn. za pomocą kodu w języku C#. Dodajmy nową formatkę do naszego projektu, a następnie zmodyfikujmy jej kod w następujący sposób:
protected
void Page_Load(object
sender, EventArgs e)
{
string
dir = @"C:\Documents and Settings\Gash\Moje dokumenty\Visual Studio
2005\WebSites\WebSite1\UploadedFiles";
string[]
files = System.IO.Directory.GetFiles(dir);
for(int
i =0; i < files.Length; i++)
{
Image im =
new Image();
im.ImageUrl =
@"UploadedFiles\" + GetFileName(files[i]);
im.Height =
200;
im.Width = 300;
Label lbl =
new Label();
lbl.Text =
GetFileName(" " + files[i]) +
"<br>";
this.form1.Controls.Add(im);
this.form1.Controls.Add(lbl);
}
}
private
string GetFileName(string
filePath)
{
string[]
temp = filePath.Split(System.Char.Parse(@"\"));
return
temp[temp.Length - 1];
}
Pierwszą czynnością, którą musimy wykonać, jest dodanie nowej metody, o nazwie GetFileName, do pliku zawierający kod źródłowy formatki. Metoda ta, pobierać będzie napis, zawierający pełną ścieżkę źródłową, określającą położenie pliku na serwerze, natomiast zwracać będzie wyodrębnioną z tej ścieżki nazwę pliku. W metodzie Page_Load na początku podajemy ścieżkę do katalogu, w którym znajdować się mają pliki graficzne. Następnie, za pomocą metody GetFiles, klasy Directory, tworzymy tablicę zawierającą ścieżki dostępu do poszczególnych plików, zawartych z katalogu. Następnie tworzymy obiekt klasy Image i ustawiamy jego właściwości (kolejno: względną ścieżkę do pliku, który ma być wyświetlany na stronie, wysokość oraz szerokość prezentowanego obrazu). Tworzymy również obiekt klasy Label, wyświetlający nazwę pliku na stronie. Następnie, za pomocą metody Add, dodajemy stworzone obiekty do formatki. Podane czynność wykonujemy w pętli, dla wszystkich plików zawartych w katalogu. Efekt działania powyższego kodu przedstawiać się może następująco:
Niektórzy z Was, zastanawiają się pewnie, co oznacza symbol „@", umieszczany przed zawartymi w kodzie napisami. Otóż, umożliwia on traktowanie znaków specjalnych (w naszym przypadku będzie to „\"), jak zwykłych symboli. Wiecie zapewnie, że ciągi typu: „\n" lub „\t" nie są wyświetlane „dosłownie", reprezentują natomiast odpowiednio: sybol nowego wiersza oraz tabulatora. Jeżeli chcemy, aby nasz napis zawierał symbol „\" musimy zastosować jedną z następujących konstrukcji:
string napis =
"\\";
string napis = @"\";
Ostatnią kontrolką, którą chciałbym umówić z tym rozdziale, jest obiekt, reprezentujący kalendarz. Wyobraźmy sobie sytuację, w której użytkownik musi podać w formularzu datę swojego urodzenia. Do tej czynności wystarczy zwykła formatka TextBox – w tym przypadku skazani jesteśmy jednak na żmudne sprawdzanie poprawności danych, wprowadzonych przez użytkownika. Osoba, wypełniająca formularz, może popełnić wiele błędów, na przykład podać datę w rodzaju: „2005-13-30", czy też: „32-00-2003". Dzięki zastosowaniu kontrolki Calendar, możemy łatwo uniknąć tego typu błędów. Do naszego projektu w Visual Studio dodajmy nową formatkę, następnie z pasku narzędzi przeciągnijmy na nią obiekty: ToolBox oraz Calendar. Na początku ustawmy właściwość kontroli textBox1: ReadOnly = True. Uniemożliwimy w ten sposób użytkownikowi aplikacji własnoręczną edycję wspomnianego pola. Następnie kliknijmy dwukrotnie lewym przyciskiem myszy na znajdującej się na edytowanej stronie kontrolce Calendar1. Spowoduje to wygenerowanie metody: Calendar_Selection_Changed, obsługującej zdarzenie zmiany daty kalendarza. Uzupełnijmy kod tej metody z następujący sposób:
protected
void Calendar1_SelectionChanged(object
sender, EventArgs e)
{
this.TextBox1.Text
= this.Calendar1.SelectedDate.ToShortDateString();
}
Po uruchomieniu projektu, edytowana przez nas strona, wyglądać będzie następująco:
Wybierając datę w wyświetlonym kalendarzu (za pomocą lewego przycisku myszy) uzyskamy następujący efekt:
Platforma .NET udostępnia dziesiątki innych gotowych do użycia kontrolek. Część z nich zostanie omówiona w kolejnych rozdziałach kursu. Ponadto wiele rozmaitych obiektów tego typu, często o bardzo rozbudowanej funkcjonalności, możemy znaleźć w Internecie. Udostępniane są one przez swoich twórców za darmo, bądź po wniesieniu odpowiedniej opłaty.
341f31d.png)