Lekcja 2.2: Korzystanie z komponentu przesyłania plików

W ramach tej lekcji użytkownik dowie się, w jaki sposób umożliwić użytkownikom końcowym ładowanie obrazów dla ogłoszeń drobnych. Ta funkcja jest szczególnie ważna na stronach new_record.jsp i update_record.jsp. Komponent przesyłania pliku umożliwia użytkownikom przeglądanie systemu plików, przesłanie pliku do bazy danych i natychmiastowe pokazanie tego pliku w bazie danych.

Ponieważ procedura korzystania z komponentu przesyłania pliku jest podobna zarówno dla przypadku tworzenia, jak i aktualizacji, to ćwiczenie umożliwi zmianę bieżącego obrazu na stronie aktualizacji. W razie potrzeby można wprowadzić te same zmiany na stronie nowego rekordu po zakończeniu pracy nad stroną aktualizacji.

Dodawanie aktualnej fotografii do strony

Można zauważyć, że formularz aktualizacji nie jest niczym więcej, jak tabelą HTML ze statycznym tekstem i komponentami wejściowymi powiązanymi z kolumnami w rekordzie relacyjnym update_record. Wiedząc o tym, można dodać wiersze i kolumny w celu zmodyfikowania formularza w taki sam sposób, jak podczas modyfikacji dowolnej tabeli HTML. W ramach poniższych kroków użytkownik doda nowy wiersz w celu wyświetlenia aktualnego zdjęcia.

Dodawanie wierszy i kolumn jest bardziej złożone w przypadku tabeli danych wyświetlającej listę rekordów relacyjnych. Informacje dotyczące dodawania kolumn do danych tabeli zawiera sekcja Lekcja 1.2: Łączenie się z bazą danych i wyświetlanie danych na stronie WWW.

Kliknij dwukrotnie stronę update_record.jsp w widoku Eksplorator projektów.
Umieść kursor w pierwszej (lewej górnej) komórce tabeli. Ta komórka nosi nazwę ID.
W menu głównym kliknij kolejno opcje: Tabela > Określ i dodaj. Zostanie otwarte okno dialogowe Dodaj wiersze lub kolumny. Kliknij opcję Wiersze, a następnie Powyżej zaznaczonej komórki. Spowoduje to utworzenie u góry tabeli nowego wiersza, który będzie zawierał aktualne zdjęcie dla rekordu. Kliknij przycisk OK.
W lewej komórce tego wiersza wpisz tekst Aktualne zdjęcie:, który będzie pełnił rolę etykiety.
Przeciągnij komponent Obraz z szuflady Komponenty Faces w widoku Paleta do skrajnej prawej komórki w nowym wierszu. W odróżnieniu od poprzedniego ćwiczenia użytkownik będzie mógł zobaczyć pełny obraz bez ograniczeń wielkości, więc nie należy zmieniać szerokości i wysokości w widoku Właściwości.
Powiąż komponent obrazu z kolumną Fotografia rekordu update_record, przeciągając kolumnę Fotografia z widoku Dane strony na nowy komponent obrazu. Komponent obrazu jest teraz powiązany z kolumną Fotografia bazy danych.
Mając cały czas zaznaczony obraz, przejdź do widoku Właściwości i kliknij przycisk Wybierz obiekt danych strony obok pola Typ. Zostanie otwarte okno Wybierz obiekt danych strony.
Kliknij kolejno opcje: update_record (Service Data Object) > update_record (ADS) > IMAGETYPE (String).
Kliknij przycisk OK. Teraz na stronie jest wyświetlane aktualne zdjęcie dla ogłoszenia drobnego, o ile takie istnieje. Strona powinna wyglądać następująco:

Dodawanie komponentu przesyłania pliku do strony

Następnie zostanie dodany u dołu tabeli nowy wiersz na komponent przesyłania plików.

Umieść kursor w ostatnim wierszu, klikając go.
Z menu wybierz opcje: Tabela > Dodaj wiersz poniżej.
W pierwszej komórce nowego wiersza wpisz jako etykietę tekst New Photo:.
Przeciągnij komponent Przesyłanie pliku z szuflady Rozszerzone komponenty składnika Faces w widoku Paleta do ostatniej komórki nowego wiersza.
W taki sam sposób, w jaki został powiązany komponent obrazu, powiąż komponent przesyłania plików z kolumną Fotografia rekordu relacyjnego update_record. W polu tekstowym jest wyświetlany tekst {Fotografia} w celu wskazania, że ten komponent jest powiązany z kolumną Fotografia oraz że przesyłany plik zostanie umieszczony w tej kolumnie. Strona powinna wyglądać następująco:
Zapisz stronę i przetestuj ją, jeśli chcesz.

Punkt kontrolny lekcji

Lekcja 2.2 została zakończona. W ramach tej lekcji użytkownik nauczył się, w jaki sposób manipulować tabelą na stronie aktualizacji, dodawać aktualną fotografię do tabeli oraz dodawać do tabeli komponent przesyłania pliku.

< Wstecz | Dalej >