Tabela

Powiązanie danych

Na karcie właściwości Ogólne można ustawiać i modyfikować powiązanie danych widoku. Widok Tabela jest powiązany z listą obiektów, które zapełniają wiersze.

Właściwości konfiguracyjne

W obszarze Konfiguracja można ustawić lub zmodyfikować właściwości konfiguracyjne widoku.

Właściwości konfiguracyjne wyglądu elementu Tabela znajdują się w poniższej tabeli:

Tabela 1. Właściwości konfiguracyjne wyglądu elementu Tabela

Właściwość konfiguracyjna wyglądu	Opis	Typ danych
Styl tabeli	Styl tabeli. Dostępne są następujące opcje: Domyślny (bez krawędzi, jasnoszare tło) Elegancki (poziome krawędzie, białe tło) Krawędziowy (krawędzie wokół komórek) Pasiasty (wiersze naprzemiennie z białym i jasnoszarym tłem) Wiersz – wskazany myszą (wyróżnianie wierszy szarym kolorem po zatrzymaniu nad nimi wskaźnika) Ścieśniony (zmniejszone odstępy między komórkami)	TableStyle
Styl koloru	Styl koloru tabeli. Kolory odpowiadają zmiennym w podanej kompozycji. Dostępne są następujące opcje: Brak Jasny (jasnoszary) Podstawowy (ciemnoniebieski) Informacja (jasnoniebieski) Powodzenie (zielony) Ostrzeżenie (pomarańczowy) Niebezpieczeństwo (czerwony)	TableColorStyle
Wyróżnij wybór	Służy do zacieniania wybranych wierszy. Ta opcja nie działa, jeśli nie jest podany styl koloru.	Boolean
Szerokość	Służy do podawania szerokości tabeli. Szerokość jest wyrażana w pikselach (px), jako wartość procentowa (%) lub w firetach (em). Na przykład: 50px, 20%lub 0.4em. Jeśli nie jest podany typ jednostki, domyślnie używana jest jednostka px (piksele).	String
Wysokość	Służy do podawania wysokości widoku, która jest wyrażana w pikselach (px) lub w firetach (em). Jeśli nie jest podany typ jednostki, domyślnie używana jest jednostka px (piksele). Wysokość nie uwzględnia nagłówka ani stopki. Jeśli podano wysokość, a wiersze nie mieszczą się w pionie w miejscu dostępnym dla treści tabeli, treść tabeli można przewijać w pionie.	String
Zawijaj nagłówki kolumn	Zawija nagłówki kolumn w zależności od dostępnej w tabeli ilości miejsca.	Boolean
Pokaż elementy wywoływane	Wywoływane menu i widoki są wyświetlane nad tabelą, jeśli nie została podana wysokość. Jeśli na przykład ta opcja jest zaznaczona, widok Okno wyboru daty i godziny jest wyświetlane nad tabelą. W przeciwnym razie element sterujący Okno wyboru daty i godziny jest osadzany w komórce tabeli.	Boolean
Styl nagłówka i stopki	Umożliwia zastosowanie innego stylu nagłówka i stopki. Na przykład styl Nowoczesny usprawnia stronicowanie w nagłówku i stopce.	TableHFStyle

Właściwości konfiguracyjne zachowania elementu Tabela znajdują się w poniższej tabeli:

Tabela 2. Właściwości konfiguracyjne zachowania elementu Tabela

Właściwość konfiguracyjna zachowania	Opis	Typ danych
Tryb wyboru	Służy do podawania liczby wierszy, które może wybrać użytkownik: Brak Pojedyncze wieloma W przypadku tabeli w trybie wyboru Wielokrotny użycie opcji Wybierz wszystko powoduje wybranie wszystkich danych, które są powiązane z tą tabelą.	TableSelectionMode
Pokaż przycisk Usuń	Służy do pokazywania lub ukrywania przycisku usuwania wiersza.	Boolean
Pokaż stopkę	Służy do pokazywania lub ukrywania stopki. Stopka jest także wyświetlana, jeśli są włączone jakiekolwiek widoki stopki, na przykład Pokaż przycisk Dodaj.	Boolean
Pokaż przycisk Dodaj	Służy do pokazywania lub ukrywania przycisku dodawania wiersza. Jeśli tabela jest posortowana lub przefiltrowana, nowo dodany wiersz może nie zostać wyświetlony jako ostatni wiersz w tabeli lub może nie zostać w ogóle wyświetlony aż do momentu anulowania sortowania lub filtrowania. Należy zwrócić uwagę, że jeśli zostanie wybrany styl nagłówka i stopki Nowoczesny i ma zostać wyświetlony przycisk Dodaj , należy również wybrać opcję Pokaż stopkę .	Boolean
Pokaż statystyki tabeli	Służy do wyświetlania w stopce statystyki dotyczącej tabeli. Na przykład: Showing 1 to 5 of 59 entries. Uwaga: Należy także wybrać opcję Pokaż stopkę.	Boolean
Pokaż pager	Służy do pokazywania lub ukrywania liczby stron. Paginator wyświetla tylko 5 stron i dlatego, w zależności od początkowej wielkości strony i liczby rekordów, strony mogą nie być kolejne (1, 2, 3...). Na przykład: Tabela ma 50 pozycji, a początkowa wielkość strony jest ustawiona na 5. Wyświetlane numery stron to 1, 3, 5, 7 i 10. Użytkownik może klikać przycisk Dalej, aby przejść kolejno przez strony, lub może użyć przycisków numerów stron, aby szybko przechodzić między stronami. Uwaga: Należy także wybrać opcję Pokaż stopkę.	Boolean
Pokaż sizer strony	Służy do pokazywania lub ukrywania elementu sterującego wielkością strony, który wyświetla liczbę wierszy na stronie.	Boolean
Początkowa wielkość strony	Liczba wierszy wyświetlanych na stronie.	Integer
Zmień wielkość kolumn	Zezwalaj użytkownikom na zmianę wielkości kolumn poprzez przeciąganie ich separatorów.	Boolean
Dowolny typ	Specyfikacja typu definicji obiektu biznesowego, gdy widok jest powiązany z listą typów ANY.	TableANYType

var div = document.createElement("div");
div.innerHTML = cell.row.data["firstName"];
cell.setSortValue(cell.row.data["firstName"]);
return div;

Przykład

var autoObject = [];
autoObject[0] = {};
autoObject[0].name = "Dylan";
autoObject[0].favoriteSport = "Tennis";
autoObject[0].favoritePlayer = "Federer";
autoObject[1] = {};
autoObject[1].name = "Max";
autoObject[1].favoriteSport = "Soccer";
autoObject[1].favoritePlayer = "Messi";
autoObject

Usługa personelu po stronie klienta ma zmienną prywatną profile typu Profile[].

W usłudze personelu po stronie klienta należy utworzyć kopię strony i połączyć ją z pierwszą stroną. W drugiej stronie należy zmienić etykietę elementu sterującego Tabela na Profile – formatka 2.

Typy wyświetlania

Zdarzenia

We właściwościach Zdarzenia można ustawiać i modyfikować procedury obsługi zdarzeń widoku. Zdarzenia mogą być uruchamiane w sposób programowy lub w wyniku interakcji użytkownika z widokiem. Informacje na temat definiowania zdarzeń i kodu zdarzeń zawiera sekcja Zdarzenia zdefiniowane przez użytkownika.

Element Tabela ma następujące typy procedur obsługi zdarzeń:

• : Aktywowany podczas ładowania tabeli. Na przykład:

  me.setPageIndex(0);
  

• : Aktywowane, gdy jest ładowana komórka, która ma niestandardowe opcje wyświetlania (ustawione w konfiguracji Kolumny). Aby użyć tego zdarzenia, należy ustawić wartość konfiguracyjna Renderuj jako wartość w konfiguracji Kolumny. Tego zdarzenia można również użyć do ustawienia dla typów złożonych. Na przykład:

  var div = document.createElement("div"); 
  div.innerHTML = cell.row.data[cell.varName]; 
  return div;

• : Aktywowane po wyświetleniu wierszy. To zdarzenie ma zastosowanie tylko w przypadku tabel z podziałem na strony. Na przykład:

  alert("All rows have " + (all ? "" : "NOT") + " been loaded");

• : To zdarzenie jest wyzwalane po załadowaniu wierszy z możliwością przyspieszania. Aby można było użyć tego zdarzenia, należy włączyć opcję konfiguracji zezwalającą na rozwijane wiersze. Na przykład, gdy wiersz jest renderowany jako:

  row.views.forEach(function(view) { switch(view.context.viewid) { case "Text1": view.setData(row.data[varName]); break; case "Text2": view.setData(row.data[varName]); break; } });

  Przykład, gdy wiersz jest wyświetlany jako:

  var div = document.createElement("div"); div.innerHTML = row.data[varName] + " " + row.data[varName]; return div;

• : Wyzwalacze, gdy wiersz zostanie rozwinięty. Na przykład:

  ${Service_Call1}.execute();

• : Wyzwalacze, gdy wiersz zostanie zwijany. Na przykład:

  alert("Collapsed row has index " + row.recordIndex);

• : Aktywowane po wybraniu przez użytkownika wiersza. Na przykład:

  alert("Selected row has index " + row.recordIndex);

• : Aktywowane, gdy użytkownik korzysta z opcji Wybierz wszystko w celu wybrania wszystkich wierszy w tabeli, która znajduje się w trybie wyboru Wielokrotny lub w celu wyczyszczenia wyboru we wszystkich wierszach tabeli. Udostępnia zmienną kontekstową o nazwie all, która wskazuje, że wszystkie lub żadne wiersze nie są zaznaczone. Na przykład:

  alert("All rows selected: " + all);

• : To zdarzenie jest wywoływane po dodaniu wiersza przez użytkownika za pomocą przycisku. Jeśli zwraca obiekt JavaScript, obiekt ten jest dodawany, w przeciwnym razie dodawany jest pusty obiekt. Na przykład:

  alert("New row will be added");

• : Aktywowane, gdy użytkownik prosi o usunięcie rekordu. Jeśli zdarzenie zwróci wartość, rekord nie zostanie usunięty. Tego zdarzenia można użyć do żądania od użytkownika potwierdzenia przed usunięciem rekordu. Na przykład:

  return confirm("Are you sure you want to delete item " + item.str1);

• : Aktywowane, gdy użytkownik kliknie ikonę sortowania w nagłówku kolumny tabeli. Funkcja ta wraca do sortowania niestandardowego i pomija domyślne sortowanie tabeli. Tego zdarzenia można użyć do ustawienia na liście sortowanej niestandardowych. Na przykład:

  alert("Sorting " + col + " column in " + order + " order"); 
  me.context.binding.set("value", myCustomSortedList); 
  return false;

• : Aktywowane, gdy użytkownik zmieni wartość dla pola wprowadzania danych na stronie. Na przykład:

  me.showPager(true); 

• 21.0.2 : Aktywowano, gdy użytkownik zmienia wielkość kolumny. Na przykład:

  alert("Column resized");

• : Aktywowane, gdy użytkownik przeciągnie i upuszcza kolumnę.

  alert("Column dropped");

metody

Szczegółowe informacje na temat dostępnych metod dla tabeli można znaleźć w sekcji Interfejs API języka JavaScript tabeli.

Zasoby dodatkowe

Więcej informacji na temat sposobu tworzenia formatki lub strony zawiera sekcja Budowanie formatek.
Informacje na temat standardowych właściwości (Ogólne, Konfiguracja, Pozycjonowanie, Widocznośći Atrybuty HTML) można znaleźć w sekcji Właściwości widoku.