< Wstecz | Dalej >

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.
O tym zadaniu

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

O tym zadaniu

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.

  1. Kliknij dwukrotnie stronę update_record.jsp w widoku Eksplorator korporacyjny.
  2. Umieść kursor w pierwszej (lewej górnej) komórce tabeli. Ta komórka nosi nazwę Id.
  3. 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.
  4. W lewej komórce tego wiersza wpisz tekst Aktualne zdjęcie:, który będzie pełnił rolę etykiety.
  5. 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.
  6. 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.
  7. 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.
  8. Kliknij kolejno opcje: update_record (Service Data Object) > update_record (ADS) > IMAGETYPE (String).
  9. 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:
    Aktualny wygląd strony.

Dodawanie komponentu przesyłania pliku do strony

O tym zadaniu
Następnie zostanie dodany u dołu tabeli nowy wiersz na komponent przesyłania plików.
  1. Umieść kursor w ostatnim wierszu, klikając go.
  2. Z menu wybierz opcje: Tabela > Dodaj wiersz poniżej.
  3. W pierwszej komórce nowego wiersza wpisz jako etykietę tekst New Photo:.
  4. Przeciągnij komponent Przesyłanie pliku z szuflady Rozszerzone komponenty składnika Faces w widoku Paleta do ostatniej komórki nowego wiersza.
  5. 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:
    Aktualny wygląd strony.
  6. 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 >
Opinie