Atrybuty i funkcje odwzorowania interfejsu użytkownika
Omawiane tematy
Powiązywanie elementu XML z elementem HTML
Formatowanie pól wejściowych i wyjściowych
Włączanie pomocy dotyczącej mapowania interfejsu użytkownika
Wyszukiwanie przy użyciu strefy eksploratora okna podręcznego
Wyzwalanie skryptów JavaScript dla zdarzeń przeglądarki
Wywoływanie usług opartych na schemacie
Odświeżanie renderowanego odwzorowania lub strony portalu
Osadzanie przechodzenia we frameworku
Zamykanie odwzorowania interfejsu użytkownika z powiązanymi wartościami
Uwzględnianie fragmentu odwzorowania
Uwzględnianie składnika internetowego
Wyświetlanie wartości domyślnej schematu podczas dodawania
Ładowanie i pobieranie pliku CSV
Konstruowanie fragmentów odwzorowania strefy portalu
Wymagane biblioteki JavaScript
Powiązywanie elementu XML z elementem HTML
Aby powiązać element XML z elementem HTML odwzorowania interfejsu użytkownika wymagane są tylko dwa różne atrybuty. Oba wymagają dokumentu XML osadzonego w obrębie HTML, gdzie XML jest powiązany przy użyciu węzłów <xml>.
Łączenie pola
| Składnia | Wartości | Opis |
|---|---|---|
|
oraField=" " |
Ścieżka XPath elementu pola | Ten atrybut jest używany do połączenia elementu HTML bezpośrednio z elementem XML, gdy element XML jest zdefiniowany w obrębie schematu XML odwzorowania interfejsu użytkownika. Atrybut ten może zostać użyty z dowolnym elementem HTML renderowania, takim jak <span>, <div> i <input>. |
-
Element HTML na potrzeby elementu wejściowego:
<html> <body> <table> <tr> <td>Address:</td> <td><input type="text" oraField="address"/></td> </tr> <tr> <td>City:</td> <td><input type="text" oraField="city"/></td> </tr> <tr> <td>State:</td> <td><input type="text" oraField="state"/></td> </tr> <tr> <td>Zip:</td> <td><input type="text" oraField="zip"/></td> </tr> </table> </body> <xml> <root> <address>123 Main St</address> <city>Alameda</city> <state>CA</state> <zip>94770</zip> </root> </xml> </html>Renderowany element HTML
-
Element HTML na potrzeby elementów "span" i "div":
<html> <body> <div oraField="address"></div> <span oraField="city"></span> <span>,</span> <span oraField="state"></span> <span oraField="zip"></span> <span oraField="country"></span> </body> <xml> <root> <address>123 Main St</address> <city>Alameda</city> <state>CA</state> <zip>94770</zip> </root> </xml> </html>Renderowany element HTML:
Łączenie listy
Ten atrybut jest używany do połączenia tabeli HTML z listą XML, gdy lista XML jest zdefiniowana w obrębie schematu XML odwzorowania interfejsu użytkownika. Celem tego elementu jest wyzwolenie platformy Framework w celu odtworzenia elementu HTML tabeli dla każdego wystąpienia listy.
| Składnia | Wartości | Opis |
|---|---|---|
|
oraList=" " |
Ścieżka XPath elementu listy | Ten atrybut jest używany do połączenia tabeli HTML z listą XML, gdy lista XML jest zdefiniowana w obrębie schematu XML odwzorowania interfejsu użytkownika. Celem tego elementu jest wyzwolenie platformy Framework w celu odtworzenia elementu HTML tabeli dla każdego wystąpienia listy. |
<html>
<head><title>Bind xml list element</title></head>
<body>
<table oraList="payment">
<thead>
<tr>
<th><span>Pay Date</span></th>
<th><span>Amount</span></th>
</tr>
<tr/>
</thead>
<tr>
<td>
<span oraField="date" oraType="date"></span>
</td>
<td align="right">
<span oraField="amount" oraType="money"></span>
</td>
</tr>
</table>
</body>
<xml>
<root>
<payment>
<date>2008-01-01</date>
<amount>44.28</amount>
</payment>
<payment>
<date>2008-02-01</date>
<amount>32.87</amount>
</payment>
<payment>
<date>2008-03-01</date>
<amount>21.76</amount>
</payment>
</root>
</xml>
</html>Renderowany element HTML:
Tworzenie listy rozwijanej
W celu utworzenia elementu "select" HTML (określanego także jako lista rozwijana) na podstawie różnych źródeł udostępniono poniższe atrybuty.
| Źródło | Składnia | Wartości | Przykłady |
|---|---|---|---|
| wyszukiwanie |
oraSelect="lookup: ;" |
Pole wyszukiwania |
|
| Rozszerzana lista wartości |
oraSelect="lookupBO: ;" |
Kod obiektu biznesowego |
|
| Typ charakterystyki (predefiniowany) |
oraSelect="charType: ;" |
Kod typu charakterystyki |
|
| tabela kontrolna |
oraSelect="table: ;" Uwaga: Atrybut ten działa tylko z tabelami o strukturze zgodnej ze standardową strukturą tabeli kontrolnej, gdy istnieje powiązana tabela języków zawierająca kolumnę DESCR jako kolumnę opisu. W celu określenia tabel spełniających warunki tej funkcji należy użyć słownika danych przeglądarki aplikacji.
Ostrzeżenie: Funkcja oraSelect będzie działać tylko w przypadku wyświetlania mniej niż 500 wartości.
|
Nazwa tabeli |
|
| Usługa strony |
oraSelect="service: ;" |
Nazwa usługi strony |
|
| Lista osadzona | Służy do tworzenia wybranej listy rozwijanej na podstawie listy w obrębie elementu XML odwzorowania. oraSelect="valuePath: ;descPath: " |
Po pozycji valuePath należy określić ścieżkę XPath elementu zawierającego wartości. Po pozycji descPath należy określić ścieżkę XPath elementu zawierającego opisy. |
|
| Skrypt usługi |
oraSelect="ss: ;" |
Kod skryptu usługi | Poniżej podano dodatkową składnię potrzebną podczas korzystania z tej funkcji. |
| Usługa biznesowa |
oraSelect="bs: ;" |
Kod usługi biznesowej | Poniżej podano dodatkową składnię potrzebną podczas korzystania z tej funkcji. |
Podczas określania skryptu usługi lub usługi biznesowej, aby przekazywać dane do/z usługi potrzebne są dodatkowe informacje dotyczące tworzenia odwzorowania.
| Składnia | Wartości | Opis |
|---|---|---|
|
oraSelectIn=" ;" |
serviceXPath:element; | Używane do przekazywania wartości innego elementu do usługi (odwzorowanie do ścieżki XPath usługi). |
| serviceXPath:'Literal'; | Używane do przekazywania stałej lub literału do usługi (odwzorowanie do ścieżki XPath usługi). | |
|
oraSelectOut="valuePath: ; descPath: " |
Przykłady zamieszczono poniżej | Używane do określania, który element w danych wyjściowych usługi zawiera wartości, a który opisy. |
Przykład z użyciem usługi biznesowej:
...
<td>External System: </td>
<td>
<select oraField="externalSystem"
oraSelect="bs:F1-RetrieveExternalSystems"
oraSelectIn="outboundMsgType:boGroup/parameters/outboundMsgType;"
oraSelectOut="valuePath:results/externalSystem;
descPath:results/description">
</select>
</td>
...Ta metoda tworzenia list rozwijanych jest często używana w przypadku, gdy istnieją zależności między elementami, a lista prawidłowych wartości na liście rozwijanej (dla elementu podrzędnego) opiera się na innym elemencie w odwzorowaniu (elemencie nadrzędnym). Po zmianie elementu nadrzędnego może wystąpić konieczność odświeżenia elementu podrzędnego. To zachowanie można wdrożyć przy użyciu funkcji wywoływanej w obrębie zdarzenia onChange w odwzorowaniu. Składnia to oraHandleDependentElements('element zależny');. Można określić nazwy wielu elementów docelowych (elementów zależnych).
Poniższy przykład jest powiązany z powyższym przykładem usługi biznesowej, gdzie lista systemów zewnętrznych dotyczy danego typu komunikatu wychodzącego, przekazywanego jako wartość wejściowa. Poniższy snippet zawiera konfigurację elementu typu komunikatu wychodzącego w celu wyzwolenia odświeżenia listy rozwijanej systemu zewnętrznego.
...
<div>
<label oraLabel="boGroup/parameters/outboundMsgType"></label>
<span>
<select oraSelect="table:F1_OUTMSG_TYPE"
oraField="boGroup/parameters/outboundMsgType"
onChange="oraHandleDependentElements('boGroup/parameters/externalSystem');">
</select>
</span>
</div>
...Formatowanie pól wejściowych i wyjściowych
Poniższe atrybuty umożliwiają zastosowanie formatowania typu danych w polach danych wejściowych i danych wyjściowych.
Formatowanie automatyczne
| Składnia |
|---|
| oraSchemaDataTypes="false" |
Ten atrybut jest używany do wyzwalania automatycznego formatowania w renderowanym dokumencie HTML. Formatowanie automatyczne zostanie zastosowane zgodnie z atrybutami typu danych zdefiniowanymi w schemacie odwzorowania interfejsu użytkownika. Szczegółowe informacje na temat formatowania określonych typów danych można znaleźć w opisach atrybutów oraType zamieszczonych poniżej.
-
Schemat odwzorowania interfejsu użytkownika:
<schema> <schemaDate dataType="date"/> <schemaDateTime dataType="dateTime"/> <schemaFKRef fkRef="CI_USER"/> <schemaLookup dataType="lookup" lookup="ACCESS_MODE"/> <schemaMoney dataType="money"/> <schemaNumber dataType="number"/> <schemaTime dataType="time"/> </schema> -
Element HTML odwzorowania interfejsu użytkownika:
<html> <body oraSchemaDataTypes="true"> <table border="1" cellpadding="1" cellspacing="1"> <tr><th>dataType</th><th>result type</th><th>input result</th><th> display-only result</th></tr> <tr> <td rowspan="2">date (from schema)</td> <td>raw</td> <td><input oraField="schemaDate" oraType="string" /></td> <td><span oraField="schemaDate" oraType="string"></span></td> </tr> <tr> <td>rendered</td> <td><input oraField="schemaDate"></td> <td><span oraField="schemaDate"></span></td> </tr> <tr> <td rowspan="2">dateTime (from schema)</td> <td>raw</td> <td><input oraField="schemaDateTime" oraType="string"></td> <td><span oraField="schemaDateTime" oraType="string"></span></td> </tr> <tr> <td>rendered</td> <td><input oraField="schemaDateTime"></td> <td><span oraField="schemaDateTime"></span></td> </tr> <tr> <td rowspan="2">fkRef (from schema)**</td> <td>raw</td> <td><input oraField="schemaFkRef" oraType="string"></td> <td><span oraField="schemaFkRef" oraType="string"></span></td> </tr> <tr> <td>rendered</td> <td><input oraField="schemaFkRef"></td> <td><span oraField="schemaFkRef"></span></td> </tr> <tr> <td rowspan="2">lookup (from schema)</td> <td>raw</td> <td><input oraField="schemaLookup" oraType="string"></td> <td><span oraField="schemaLookup" oraType="string"></span></td> </tr> <tr> <td>rendered</td> <td><input oraField="schemaLookup"></td> <td><span oraField="schemaLookup"></span></td> </tr> <tr> <td rowspan="2">money (from schema)</td> <td>raw</td> <td><input oraField="schemaMoney" oraType="string"></td> <td><span oraField="schemaMoney" oraType="string"></span></td> </tr> <tr> <td>rendered</td> <td><input oraField="schemaMoney"></td> <td><span oraField="schemaMoney"></span></td> </tr> <tr> <td rowspan="2">number (from schema)</td> <td>raw</td> <td><input oraField="schemaNumber" oraType="string"/></td> <td><span oraField="schemaNumber" oraType="string"></span></td> </tr> <tr> <td>rendered</td> <td><input oraField="schemaNumber"></td> <td><span oraField="schemaNumber"></span></td> </tr> <tr> <td rowspan="2">time (from schema)</td> <td>raw</td> <td><input oraField="schemaTime" oraType="string"></span></td> <td><span oraField="schemaTime" oraType="string"></span></td> </tr> <tr> <td>rendered</td> <td><input oraField="schemaTime"></td> <td><span oraField="schemaTime"></span></td> </tr> </table> </body> <xml> <root> <schemaDate>2007-11-02</schemaDate> <schemaDateTime>2007-11-02-23.45.00</schemaDateTime> <schemaFkRef>USD</schemaFkRef> <schemaLookup>A</schemaLookup> <schemaMoney>1000000</schemaMoney> <schemaNumber>5661976.11548</schemaNumber> <schemaTime>23.45.00</schemaTime> </root> </xml> </html>Renderowany element HTML.
Formatowanie daty
Ta funkcja służy do wyświetlania daty zgodnie z profilem wyświetlania użytkownika. W przypadku pól wejściowych dane są formatowane po przejściu przez użytkownika do innego pola.
| Składnia |
|---|
| oraType="date" |
<html>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Date: </td>
<td><span oraField="date" oraType="date"></span></td>
</tr>
<tr>
<td>Date: </td>
<td><input oraField="date" oraType="date"/></td>
</tr>
</table>
</body>
<xml>
<root>
<date>2008-12-28</date>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie godziny
Ta funkcja służy do wyświetlania godziny zgodnie z profilem wyświetlania użytkownika. W przypadku pól wejściowych dane są formatowane po przejściu przez użytkownika do innego pola.
| Składnia |
|---|
| oraType="time" |
<html>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Time: </td>
<td><span oraField="time" oraType="time"></span></td>
</tr>
<tr>
<td>Time: </td>
<td><input oraField="time" oraType="time"/></td>
</tr>
</table>
</body>
<xml>
<root>
<time>00.28.54.389</time>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie daty i godziny
Ta funkcja służy do wyświetlania datownika zgodnie z profilem wyświetlania użytkownika. Jeśli funkcja ta jest używana na potrzeby elementu wejściowego, zostaje podzielona na dwie części dotyczące daty i godziny. Część elementu datownika odnosząca się do godziny może zostać pominięta przy użyciu wartości atrybutu "time:suppress".
| Składnia |
|---|
| oraType="dateTime; time:suppress" |
<html>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Date time: </td>
<td><span oraField="dateTime" oraType="dateTime"></span></td>
</tr>
<tr>
<td>Date only: </td>
<td><span oraField="dateTime" oraType="dateTime; time:suppress"></span></td>
</tr>
<tr>
<td>Date time: </td>
<td><input oraField="dateTime" oraType="dateTime"/></td>
</tr>
<tr>
<td>Date only: </td>
<td><input oraField="dateTime" oraType="dateTime; time:suppress"/></td>
</tr>
</table>
</body>
<xml>
<root>
<dateTime>2009-11-01-00.28.54</dateTime>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie daty i godziny przy użyciu czasu standardowego
Ta funkcja "true" służy do renderowania elementu daty i godziny zgodnie z harmonogramem czasu letniego/zimowego podstawowej strefy czasowej. Podstawowa ("base") strefa czasowa jest określana w tabeli instalacji i reprezentuje strefę czasową bazy danych. W przypadku elementów wejściowych z tym ustawieniem zakłada się, że wszystkie wprowadzane godziny są zgodne z harmonogramem czasu letniego/zimowego podstawowej strefy czasowej. Jeśli wprowadzonej godziny nie można jednoznacznie przekształcić na czas standardowy, wówczas użytkownik będzie musiał podać etykietę strefy czasowej celem określenia, czy wprowadzono czas letni/zimowy czy standardowy.
| Składnia |
|---|
| oraType="dateTime; stdTime:true;" |
<html>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Date time: </td>
<td><span oraField="dateTime" oraType="dateTime; stdTime:true;"></span></td>
</tr>
<tr>
<td>Date time: </td>
<td><input oraField="dateTime" oraType="dateTime; stdTime:true;"/></td>
</tr>
</table>
</body>
<xml>
<root>
<dateTime>2009-11-01-00.28.54</dateTime>
</root>
</xml>
</html>Renderowany element HTML.
Element HTML renderowany na potrzeby następnego dnia.
Formatowanie daty i godziny z odwołaniem do strefy czasowej
| Składnia | Poprawne wartości | Opis |
|---|---|---|
| oraType="dateTime; stdTimeRef: ;" | Odwołanie do ścieżki XPath należy umieścić po dwukropku. | Ta funkcja służy do renderowania elementu daty i godziny zgodnie z harmonogramem czasu letniego/zimowego strefy czasowej, gdy istnieje odwołanie do jej ścieżki XPath. Zakłada się, że przetworzona godzina jest przechowywana w standardowym czasie strefy czasowej z odwołaniem - przez co wykonywane jest tylko przesunięcie czasu letniego/zimowego, bez przesunięcia strefy czasowej. |
| oraType="dateTime; displayRef: ;" | Odwołanie do ścieżki XPath należy umieścić po dwukropku. | Ta funkcja jest podobna do funkcji stdTimeRef, z tym że w ramach tej ostatniej poza przesunięciem czasu letniego/zimowego wykonywane jest przesunięcie strefy czasowej. W celu prawidłowego użycia funkcji displayRef należy powiązać ją tylko z elementami strefy czasowej przechowywanymi w podstawowej strefie czasowej. |
W przypadku elementów wejściowych zakłada się, że wszystkie wprowadzane godziny są zgodne z harmonogramem czasu letniego/zimowego strefy czasowej z odwołaniem. Jeśli wprowadzonej godziny nie można jednoznacznie przekształcić na czas standardowy, wówczas użytkownik będzie musiał podać etykietę strefy czasowej celem określenia, czy wprowadzono czas letni/zimowy czy standardowy.
<html>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Date time: </td>
<td><span oraField="dateTime" oraType="dateTime; stdTimeRef:timeZone;"></span></td>
</tr>
<tr>
<td>Date time: </td>
<td><input oraField="dateTime" oraType="dateTime; stdTimeRef:timeZone;"/></td>
</tr>
</table>
</body>
<xml>
<root>
<timeZone>US-EAST</timeZone>
<dateTime>2009-11-01-00.28.54</dateTime>
</root>
</xml>
</html>Renderowany element HTML.
Element HTML renderowany na potrzeby następnego dnia.
Formatowanie czasu trwania
| Składnia |
|---|
| oraType="duration" |
Ta funkcja służy do wyświetlania czasu trwania. W przypadku elementu wejściowego wartość wprowadzona przez użytkownika jest odpowiednio przekształcana z minut na godziny i minuty. Na przykład wprowadzona wartość "90" jest przekształcana na "00:01:30", gdy użytkownik przejdzie z pola wejściowego do innego pola.
<html>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Duration: </td>
<td><span oraField="duration" oraType="duration"></span></td>
</tr>
<tr>
<td>Duration: </td>
<td><input oraField="duration" oraType="duration"/></td>
</tr>
</table>
</body>
<xml>
<root>
<duration>90</duration>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie dnia w miesiącu
| Składnia |
|---|
| oraType="dayInMonth" |
Ta funkcja służy do wyświetlania skrótu dnia i miesiąca.
<html>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Day In Month: </td>
<td><span oraField="dayMonth" oraType="dayInMonth"></span></td>
</tr>
<tr>
<td>Day In Month: </td>
<td><input oraField="dayMonth" oraType="dayInMonth"/></td>
</tr>
</table>
</body>
<xml>
<root>
<dayMonth>0228</dayMonth>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie miesiąca w roku
| Składnia |
|---|
| oraType="monthInYear" |
Ta funkcja służy do wyświetlania skrótu miesiąca i roku.
<html>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Month In Year: </td>
<td><span oraField="month" oraType="monthInYear"></span></td>
</tr>
<tr>
<td>Month In Year: </td>
<td><input oraField="month" oraType="monthInYear"/></td>
</tr>
</table>
</body>
<xml>
<root>
<month>200811</month>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie wartości pieniężnej
Ta funkcja służy do wyświetlania liczby jako kwoty pieniędzy. Opcje konfiguracji w odniesieniu do waluty można znaleźć w tabeli. W przypadku elementów wejściowych po wprowadzeniu wartości nienumerycznej wyświetlany jest błąd.
| Składnia | Opis |
|---|---|
| oraType="money: " | Kod waluty należy umieścić bezpośrednio po dwukropku. |
| oraType="money;currencyRef: " | Należy uwzględnić odwołanie do ścieżki XPath (po dwukropku) dotyczącej elementu z odwołaniem do kodu waluty. |
| oraType="money" | Jeśli nie określono waluty lub odwołania do waluty, użyta zostanie waluta instalacji. |
<html>
<head>
<link rel="stylesheet" type="text/css" href="cisDisabled.css"/>
<link rel="stylesheet" type="text/css" href="cisEnabled.css"/>
</head>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>Amount, currency specified:</td>
<td><span oraType="money:EUR" oraField="totalAmt"></span></td>
</tr>
<tr>
<td>Amount, default currency:</td>
<td><span oraType="money" oraField="totalAmt"></span></td>
</tr>
<tr>
<td>Amount, default input:</td>
<td><input oraType="money" oraField="totalAmt"/></td>
</tr>
<tr>
<td>Amount, currency reference:</td>
<td><input oraType="money;currencyRef:cur" oraField="totalAmt"/></td>
</tr>
</table>
</body>
<xml>
<root>
<totalAmt>50500.09</totalAmt>
<cur>EUR</cur>
</root>
</xml>
</html>Renderowany element HTML
Formatowanie liczb
Ta funkcja służy do wyświetlania liczby lub sprawdzania poprawności wartości wejściowej. W przypadku elementów wejściowych po wprowadzeniu wartości nienumerycznej w systemie zwrócony zostanie błąd.
| Składnia |
|---|
| oraType="number" |
<html>
<head>
<link rel="stylesheet" type="text/css" href="cisDisabled.css"/>
<link rel="stylesheet" type="text/css" href="cisEnabled.css"/>
</head>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>Count:</td>
<td><span oraType="number" oraField="count"></span></td>
</tr>
<tr>
<td>Count, input:</td>
<td><input oraType="number" oraField="count"/></td>
</tr>
</table>
</body>
<xml>
<root>
<count>989</count>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie odwołania do klucza obcego
Domyślnie podczas wyświetlania elementu z atrybutem oraType fkRef włączone są ciąg informacji, menu kontekstowe, przechodzenie i wyszukiwanie (jeśli odpowiednio skonfigurowano odwołanie do klucza obcego). Udostępniono składnię umożliwiającą wybiórcze wyłączanie dowolnych z tych funkcji.
Należy pamiętać, że hiperłącze klucza obcego można również włączyć oddzielnie - więcej informacji znajduje się w sekcji Osadzanie przechodzenia na platformie Framework. Do kontrolowania funkcji odwołania do klucza obcego służą następujące atrybuty. Należy pamiętać, że w każdym przypadku wartością domyślną jest true. Aby wyłączyć tę cechę, należy użyć wartości false.
| Składnia |
|---|
| oraType="fkRef:true|false; info:true|false; context:true|false; navigation:true|false; search:true|false" |
- fkRef. Wartość "true" powoduje włączenie wszystkich aspektów przetwarzania odwołania do klucza obcego. Aby wyłączyć automatyczne przetwarzanie odwołania do klucza obcego należy użyć wartości "false".
- info. Wartość "true" powoduje renderowanie ciągu informacji w odwzorowaniu interfejsu użytkownika, jeśli ma to zastosowanie.
- context. Wartość "true" powoduje renderowanie menu kontekstowego, aby było wyświetlane przed elementem odwołania do klucza obcego, jeśli ma to zastosowanie.
- navigation. Wartość "true" powoduje renderowanie ciągu informacji jako hiperłącza, jeśli ma to zastosowanie. Kliknięcie hiperłącza powoduje przejście na odpowiednią stronę.
- search. Wartość "true" powoduje wyświetlenie ikony wyszukiwania do uruchamiania strefy wyszukiwania, jeśli ma to zastosowanie.
-
Schemat odwzorowania interfejsu użytkownika:
<schema> <bo fkRef="F1-BOMO"/> </schema> -
Element HTML odwzorowania interfejsu użytkownika:
<html> <body> <table summary="" border="1" cellpadding="1" cellspacing="1"> <tr> <td>Business Object</td> <td><span oraField="bo" oraType="fkRef:true; info:true; context:true; navigation:true;"></span></td> </tr> </table> </body> <xml> <root> <bo>F1-COUNTRY</bo> </root> </xml> </html> -
Renderowany element HTML.
Formatowanie listy wartości
Ta funkcja służy do wyświetlania opisu wartości wyszukiwania.
| Składnia | Poprawne wartości |
|---|---|
| oraType="lookup: " | Nazwa pola wyszukiwania po dwukropku. |
<html>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>Status:</td>
<td><span oraField="status" oraType="lookup:BATCH_JOB_STAT_FLG"></span></td>
</tr>
</table>
</body>
<xml>
<root>
<status>PD</status>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie rozszerzanej listy wartości
Ta funkcja służy do wyświetlania opisu wartości rozszerzanej listy wartości.
| Składnia | Poprawne wartości |
|---|---|
| oraType="lookupBO: " | Kod obiektu biznesowego po dwukropku. |
<html>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>Value:</td>
<td><span oraField="status" oraType="lookupBO:F1-DeviceDisplayTypes"></span></td>
</tr>
</table>
</body>
<xml>
<root>
<status>oraTablet</status>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie typu charakterystyki
Ta funkcja służy do wyświetlania opisu predefiniowanej wartości charakterystyki.
| Składnia | Poprawne wartości |
|---|---|
| oraType="charType: " | Kod typu charakterystyki po dwukropku. |
<html>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>Skill:</td>
<td><span oraType="charType:CM-SKILL" oraField="skill"></span></td>
</tr>
</table>
</body>
<xml>
<root>
<skill>10</skill>
</root>
</xml>
</html>Renderowany element HTML.
Formatowanie tabeli kontrolnej
Ta funkcja służy do wyświetlania opisu tabeli kontrolnej z powiązaną tabelą języków.
| Składnia | Poprawne wartości |
|---|---|
| oraType="table: " | Kod tabeli po dwukropku. |
<html>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>Currency:</td>
<td><span oraType="table:CI_CURRENCY_CD" oraField="curr"></span></td>
</tr>
</table>
</body>
<xml>
<root>
<curr>USD</curr>
</root>
</xml>
</html>Renderowany element HTML.
Dodawanie/usuwanie formatowania siatki
| Składnia | Opis |
|---|---|
| oraType="addGridRow" |
Funkcja addGridRow jest używana w celu utworzenia okna dialogowego "insert row" w odwzorowaniu interfejsu użytkownika.
|
| oraType="deleteGridRow" |
Funkcja deleteGridRow jest używana w celu utworzenia okna dialogowego "delete row" w odwzorowaniu interfejsu użytkownika.
|
Przykład:
<html>
<head>
<title>Demonstrate Grid Add and Grid Delete OraTypes</title>
<link rel="stylesheet" type="text/css" href="cisDisabled.css"/>
<link rel="stylesheet" type="text/css" href="cisEnabled.css"/>
</head>
<body>
<table oraList="listEntry">
<thead>
<tr>
<th/>
<th/>
<th><span>Date</span></th>
<th><span>Amount</span></th>
</tr>
<tr/>
</thead>
<tr>
<td oraType="addGridRow"></td>
<td oraType="deleteGridRow"></td>
<td>
<input oraField="date" oraType="date"></input>
</td>
<td align="right">
<input oraField="amount" oraType="money"></input>
</td>
</tr>
</table>
</body>
<xml>
<root>
<listEntry>
<date>2008-01-01</date>
<amount>44.28</amount>
</listEntry>
<listEntry>
<date>2008-02-01</date>
<amount>32.87</amount>
</listEntry>
<listEntry>
<date>2008-03-01</date>
<amount>21.76</amount>
</listEntry>
</root>
</xml>
</html>Renderowany element HTML.
Elementy niesformatowane
Ta funkcja służy do wyświetlania zawartości elementu zawierającego nieprzetworzone dane zgodnie z definicją dotyczącą renderowanego elementu schematu.
| Składnia |
|---|
| oraType="raw" |
-
Schemat odwzorowania interfejsu użytkownika:
<schema> <rawStuff type="raw"/> </schema> -
Element HTML odwzorowania interfejsu użytkownika:
<html> <head> <link rel="stylesheet" type="text/css" href="cisDisabled.css"/> <link rel="stylesheet" type="text/css" href="cisEnabled.css"/> </head> <body> <table summary="" border="1" cellpadding="1" cellspacing="1"> <tr> <td>Raw Stuff:</td> <td><span oraType="raw" oraField="rawStuff"></span></td> </tr> </table> </body> <xml> <root> <rawStuff> <ele1>text in element 1</ele1> <group1> <ele2>text inside element 2, group 1</ele2> <ele3>text inside element 3, group 1</ele3> </group1> </rawStuff> </root> </xml> </html>Renderowany element HTML.
Formatowanie ciągu
Ta funkcja służy do wyświetlania zawartości takiego elementu, jak XML PrettyPrint, gdy element zawiera zmodyfikowany element XML.
| Składnia |
|---|
| oraType="xmlString" |
Przykład:
<html>
<head>
<link rel="stylesheet" type="text/css" href="cisDisabled.css"/>
<link rel="stylesheet" type="text/css" href="cisEnabled.css"/>
</head>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>XML Stuff:</td>
<td><span oraType="xmlString" oraField="xmlStuff"></span></td>
</tr>
</table>
</body>
<xml>
<root>
<xmlStuff>
<ele1>text in element 1</ele1>
<group1>
<ele2>text inside element 2, group 1</ele2>
<ele3>text inside element 3, group 1</ele3>
</group1>
</xmlStuff>
</root>
</xml>
</html>Renderowany element HTML.
Element HTML renderowany bez atrybutu oraType="xmlString"
Formatowanie HTML
Ta funkcja służy do wyświetlania zawartości elementu w formacie HTML w przeciwieństwie do zwykłego tekstu. Element zdefiniowany jako oraType="fkref" jest automatycznie renderowany jako HTML.
| Składnia |
|---|
| oraType="html" |
W celu uniknięcia wykonywania złośliwego kodu HTML nie wszystkie znaczniki HTML są obsługiwane. Lista obsługiwanych znaczników jest określona w definicji zawartości zarządzanej "F1-HTMLWhiteList".
W przypadku wykrycia nieobsługiwanego kodu HTML cały element jest modyfikowany i renderowany jako zwykły tekst. Z tego względu zaleca się właściwe zmodyfikowanie każdego ciągu źródłowego mającego wpływ na końcowy element HTML, jeśli istnieje przypuszczenie, że nie zawiera on prawidłowego kodu HTML. Dzięki temu modyfikowany jest tylko niezgodny ciąg, nie cały element.
Jeśli element HTML jest utworzony ze skryptów, należy zapoznać się z funkcją modyfikowania opisaną w sekcji Edytowanie składni danych, aby uzyskać więcej informacji. W celu zmodyfikowania tekstu utworzonego w języku Java należy użyć interfejsu API WebStringUtilities.asHTML java.
<html>
<head>
<link rel="stylesheet" type="text/css" href="cisDisabled.css"/>
<link rel="stylesheet" type="text/css" href="cisEnabled.css"/>
</head>
<body>
<table summary="" border="0" cellpadding="1" cellspacing="1">
<tr>
<td>Info :</td>
<td><span oraType="html" oraField="info"></span></td>
</tr>
</table>
</body>
<xml>
<root>
<info><b>text in bold</b></info>
</root>
</xml>
</html>Renderowany element HTML.
Element HTML renderowany bez atrybutu oraType="html"
Wyświetlanie etykiet
Wyznaczanie etykiety z elementu
Ten atrybut jest używany do uzyskania etykiety z rozróżnianym językiem dla elementu HTML <span>, <td> lub <input>.
| Składnia | Poprawne wartości |
|---|---|
| oraLabel=" " | Ścieżka Xpath elementu w schemacie odwzorowania interfejsu użytkownika. Element musi odwoływać się do atrybutu mapField=, mdField= lub label=. |
-
Schemat odwzorowania interfejsu użytkownika:
<schema> <user mapField="USER_ID"/> <info type="group" mapXML="CLOB"> <city label="Metro Area"/> <age mdField="AGE_LBL"/> </info> </schema> -
HTML:
<html> <head><title oraMdLabel="BUS_LBL"></title></head> <body> <table> <tr> <td oraLabel="user"></td> <td><input oraField="user"/></td> </tr> <tr> <td oraLabel="info/city"></td> <td><input oraField="info/city"/></td> </tr> <tr> <td oraLabel="info/age"></td> <td><input oraField="info/age"/></td> </tr> <tr> <td/> <td><input type="button" oraMdLabel="ACCEPT_LBL"/></td> </tr> </table> </body> <xml> <root> <user>RWINSTON</user> <info> <city>Alameda</city> <age>32</age> </info> </root> </xml> </html>Renderowany element HTML:
Wyznaczanie etykiety z pola
Ten atrybut jest używany do uzyskania etykiety z rozróżnianym językiem dla elementu HTML <span>, <td>, <input> lub <title>. Tekst etykiety jest wyznaczany z pola z odwołaniem.
| Składnia | Poprawne wartości |
|---|---|
| oraMdLabel=" " | Kod Pole metadanych. |
-
HTML:
<html> <head><title oraMdLabel="F1_DETAILS_LBL"></title></head> <body> <table> <tr> <td oraLabel="user"></td> <td><input oraField="user"/></td> </tr> <tr> <td oraLabel="info/city"></td> <td><input oraField="info/city"/></td> </tr> <tr> <td oraLabel="info/age"></td> <td><input oraField="info/age"/></td> </tr> <tr> <td/> <td><input type="button" oraMdLabel="ACCEPT_LBL"/></td> </tr> </table> </body> <xml> <root> <user>RWINSTON</user> <info> <city>Alameda</city> <age>32</age> </info> </root> </xml> </html>Renderowany element HTML:
Włączanie pomocy dotyczącej mapowania interfejsu użytkownika
W sekcji Wyświetlanie etykiet opisano sposoby wyznaczania etykiety dotyczącej elementu przy użyciu powiązanego Pola metadanych. Ponadto, jeśli to samo pole metadanych zawiera tekst pomocy, w systemie automatycznie wygenerowana zostanie podpowiedź obok etykiety elementu. Kliknięcie podpowiedzi umożliwia użytkownikowi wyświetlenie tekstu pomocy.
Można zmienić renderowanie podpowiedzi. Więcej informacji można znaleźć w sekcji Niestandardowe opcje wyglądu i sposobu obsługi
Wyszukiwanie przy użyciu strefy eksploratora okna podręcznego
Opcja wyszukiwania
Ten atrybut jest używany do włączania funkcji strefy wyszukiwania dla elementów wejściowych HTML.
| Składnia | Poprawne wartości |
|---|---|
| oraSearch=" " | Kod strefy. |
-
Przykład definiowania wyszukiwania w elemencie HTML. Schemat odwzorowania interfejsu użytkownika:
<schema> <uiMap/> </schema>Element HTML odwzorowania interfejsu użytkownika
<html> <body> <table summary="" border="1" cellpadding="1" cellspacing="1"> <tr> <td>UI Map with Search </td> <td><input oraField="uiMap" oraSearch="F1-UISRCH"></td> </tr> </table> </body> <xml> <root> <uiMap/> </root> </xml> </html> -
Przykład definiowania wyszukiwania w schemacie. Schemat odwzorowania interfejsu użytkownika:
<schema> <uiMap search="F1-UISRCH"/> </schema>Element HTML odwzorowania interfejsu użytkownika
<html> <body> <table summary="" border="1" cellpadding="1" cellspacing="1"> <tr> <td>UI Map with Search </td> <td><input oraField="uiMap"></td> </tr> </table> </body> <xml> <root> <uiMap/> </root> </xml> </html> -
Przykład definiowania strefy wyszukiwania przy użyciu odwołania do klucza obcego. Schemat odwzorowania interfejsu użytkownika:
<schema> <uiMap fkRef="F1-UISRC"/> </schema>Element HTML odwzorowania interfejsu użytkownika
<html> <body> <table summary="" border="1" cellpadding="1" cellspacing="1"> <tr> <td>UI Map with Search </td> <td><input oraField="uiMap"></td> </tr> </table> </body> <xml> <root> <uiMap/> </root> </xml> </html>
We wszystkich przypadkach renderowany element HTML jest taki sam.
Inicjowanie pól wyszukiwania
Ten atrybut opcjonalny jest używany do inicjalizowania filtrów strefy wyszukiwania. Można inicjalizować wiele filtrów. Ten atrybut może być używany tylko w połączeniu z atrybutem oraSearch.
| Składnia | Poprawne wartości | Opcje wartości pola | Komentarze |
|---|---|---|---|
| oraSearchField=" " |
Co najmniej jedna para składająca się z nazwy pola i wartości pola rozdzielonych dwukropkiem. Każda para jest rozdzielona średnikiem. oraSearchField="fieldName:fieldValue: ..."Nazwa pola służy do określania filtra strefy do inicjalizacji, gdy uruchamiane jest wyszukiwanie. Nazwa pola musi być zgodna z wartością mnemonika searchField określoną w parametrze filtr użytkownika lub filtr ukryty. |
Brak wartości | Jeśli wartość pola nie zostanie określona, wówczas użyta zostanie wartość elementu wejściowego zawierającego atrybut oraSearchField. |
| XPath | Należy określić ścieżkę XPath do elementu schematu zawierającego wartość do użycia. | ||
| "literal" | Należy określić wartość literału do podania. |
Inicjalizowane są dwie wartości filtra, jak to zostało przedstawione w poniższym przykładzie:
<schema>
<bo/>
<uiMap/>
</schema><html>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>UI Map with Search </td>
<td><input oraField="uiMap" oraSearch="F1-UISRCH" oraSearchField="MAP_CD; BUS_OBJ_CD:bo;"></td>
</tr>
</table>
</body>
<xml>
<root>
<bo/>
<uiMap/>
</root>
</xml>
</html>Odwzorowywanie zwróconych pól wyszukiwania
Ten atrybut opcjonalny jest używany do kierowania wartości zwróconych przez strefę wyszukiwania. Można określić wiele pól. Ten atrybut może być używany tylko w połączeniu z atrybutem oraSearch.
| Składnia | Poprawne wartości | Opcje wartości pola | Komentarze |
|---|---|---|---|
| oraSearchOut=" " |
Co najmniej jedna para składająca się z nazwy pola i wartości pola rozdzielonych dwukropkiem. Każda para jest rozdzielona średnikiem. oraSearchOut="field name:xpath target; ..."Nazwa pola służy do określania wyniku wyszukiwania zwróconego ze strefy zapytania. Nazwa pola musi być zgodna z mnemonikiem ELEMENT_NAME zdefiniowanym w parametrze wyników wyszukiwania strefy eksploratora. |
Brak wartości | Jeśli wartość pola nie zostanie określona, wówczas zwrócona wartość zostanie odebrana przez element wejściowy zawierający atrybut oraSearchField. |
| XPath | Należy określić ścieżkę XPath do elementu schematu, który ma odebrać zwróconą wartość. |
W poniższym przykładzie zwrócone są dwie wartości:
<schema>
<bo/>
<mo/>
</schema><html>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>BO Search </td>
<td><input oraField="bo" oraSearch="Z1-BOSRCH" oraSearchOut="BUS_OBJ_CD; MO_CD:mo;"></td>
</tr>
</table>
</body>
<xml>
<root>
<bo/>
<mo/>
</root>
</xml>
</html>Wyświetlanie błędów
Wyświetlanie zmiennych błędu
Wyświetlona zostanie jedna z poniższych zmiennych błędu.
| Składnia |
|---|
| oraErrorVar="ERRMSG-TEXT" |
| oraErrorVar="ERRMSG-LONG" |
| oraErrorVar="ERRMSG-CATEGORY" |
| oraErrorVar="ERRMSG-NUMBER" |
...
<table width="100%" cellpadding="12">
<tr class="oraErrorText">
<td>
<a href="" onclick="oraShowErrorAlert(); return false;">
<span class="oraErrorText" oraErrorVar="ERRMSG-TEXT"></span>
</a>
</td>
</tr>
</table>
...Renderowany element HTML
Wyróżnianie błędnego pola
| Składnia | Komentarze |
|---|---|
| oraError="automate:true|false; prefix: " | Określenie wartości automate:true powoduje automatyczne włączenie wyróżniania błędnego elementu podczas zgłaszania błędu. Należy pamiętać, że true jest wartością domyślną i nie trzeba jej określać. Aby wyłączyć wyróżnianie pól, należy określić wartość automate:false. |
| W systemie wykorzystywane jest dopasowanie między nazwą elementu wymienioną w błędzie a nazwami elementów w odwzorowaniu interfejsu użytkownika. Jeśli elementy w schemacie znajdują się w obrębie ścieżki XPath, która może nie być zgodna z elementami wymienionymi w błędzie, należy określić to przy użyciu wartości prefix:XPath. |
W poniższym przykładzie HTML elementy w odwzorowaniu są zdefiniowane w obrębie grupy o nazwie boGroup. Nazwa elementu zwrócona przez błąd nie będzie zawierać tej grupy, dlatego aby zapewnić prawidłowe działanie wyróżnienia pola, atrybut prefix: musi wskazywać nazwę grupy.
<html>
<head>
<title>User Zone Input</title>
<link rel="stylesheet" type="text/css" href="cisDisabled.css"/>
<link rel="stylesheet" type="text/css" href="cisEnabled.css"/>
</head>
<body oraError="automate:true; prefix:boGroup">
<table width="100%" cellpadding="12">
<tr class="oraErrorText">
<td>
<a href="" onclick="oraShowErrorAlert(); return false;">
<span class="oraErrorText" oraErrorVar="ERRMSG-TEXT"></span>
</a>
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="4">
<tr style="padding-top:30px;">
<td align="right" class="label">User Id</td>
<td>
<span oraField="boGroup/userId" class="normal"/>
</td>
</tr>
<tr>
<td align="right" class="label">First Name</td>
<td>
<input oraField="boGroup/firstName" class="normal"/>
</td>
</tr>
<tr>
<td align="right" class="label">Last Name</td>
<td>
<input oraField="boGroup/lastName" class="normal"/>
</td>
</tr>
</table>
</body>
<xml>
<root>
<boGroup>
<userId>BOND007</userId>
<firstName>James</firstName>
<lastName></lastName>
</boGroup>
</root>
</xml>
</html>Renederowany element HTML, gdzie zgłoszony element błędu jest równy wartości "lastName":
Przesłanianie nazwy błędnego elementu
W rzadkim przypadku, gdy nazwa elementu zwrócona przez błąd nie jest zgodna z nazwą elementu w odwzorowaniu, można dodać jawny atrybut celem wskazania nazwy błędnego elementu.
| Składnia | Poprawne wartości | Komentarze |
|---|---|---|
| oraErrorElement= | "element name" | Nazwa elementu umieszczona w tym odwołaniu musi być dokładnie zgodna z nazwą błędnego elementu przydzieloną podczas zgłaszania błędu. Dana nazwa błędnego elementu może odwoływać się do więcej niż jednego pola HTML. |
Może to dotyczyć scenariusza, gdy nazwa elementu powiązana z błędem różni się od nazwy elementu w odwzorowaniu.
<html>
<head>
<title>User Zone Input</title>
<link rel="stylesheet" type="text/css" href="cisDisabled.css"/>
<link rel="stylesheet" type="text/css" href="cisEnabled.css"/>
</head>
<body>
<table width="100%" cellpadding="12">
<tr class="oraErrorText">
<td>
<a href="" onclick="oraShowErrorAlert(); return false;">
<span class="oraErrorText" oraErrorVar="ERRMSG-TEXT"></span>
</a>
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="4">
<tr style="padding-top:30px;">
<td align="right" class="label">User Id</td>
<td>
<span oraField="userId" class="normal"/>
</td>
</tr>
<tr>
<td align="right" class="label">First Name</td>
<td>
<input oraField="firstName" class="normal" oraErrorElement="firstName"/>
</td>
</tr>
<tr>
<td align="right" class="label">Last Name</td>
<td>
<input oraField="familyName" class="normal" oraErrorElement="lastName"/>
</td>
</tr>
</table>
</body>
<xml>
<root>
<userId>BOND007</userId>
<firstName>James</firstName>
<familyName></familyName>
</root>
</xml>
</html>Renderowany element HTML.
Wyświetlanie okna podręcznego błędu
Podczas wyświetlania tekstu błędu można użyć tej funkcji do wyświetlenia standardowego podręcznego okna dialogowego błędu (zawierającego więcej informacji), gdy użytkownik kliknie komunikat o błędzie.
| Składnia |
|---|
| oraShowErrorAlert(); return false; |
<html>
<head>
<link rel="stylesheet" type="text/css" href="cisDisabled.css"/>
<link rel="stylesheet" type="text/css" href="cisEnabled.css"/>
</head>
<body>
<table width="100%" cellpadding="12">
<tr class="oraErrorText">
<td>
<a href="" onclick="oraShowErrorAlert(); return false;">
<span class="oraErrorText" oraErrorVar="ERRMSG-TEXT"></span>
</a>
</td>
</tr>
</table>
<table>
<tr>
<td >Address:</td>
<td><input type="text" oraField="address"/></td>
</tr>
<tr>
<td>City:</td>
<td><input type="text" oraField="city"/></td>
</tr>
<tr>
<td>State:</td>
<td><input type="text" oraField="state"/></td>
</tr>
<tr>
<td>Zip:</td>
<td><input type="text" oraField="zip"/></td>
</tr>
<tr>
<td/>
<td style="padding-top=15px;">
<oraInclude map="F1-SaveCancelButtons"/>
</td>
</tr>
</table>
</body>
<xml>
<root>
<address>123 Main St</address>
<city>Alameda</city>
<state>CA</state>
<zip>94770</zip>
</root>
</xml>
</html>Renderowany element HTML.
Standardowe podręczne okno dialogowe błędu otwierane po kliknięciu komunikatu o błędzie:
Wyzwalanie skryptów JavaScript dla zdarzeń przeglądarki
Praca na platformie JavaScript Framework
Istnieje wiele zdarzeń JavaScript, których można użyć w środowisku HTML/JavaScript. Należą do nich takie zdarzenia, jak onLoad, onBlur, onChange itp. Są one wykorzystywane także na platformie Framework odwzorowania interfejsu użytkownika. Ważne jest, by każde utworzone odwzorowanie interfejsu użytkownika działało z platformą Framework, co pozwoli uzyskać spójne wyniki (zdarzenia nie zawsze mogą być wykonywane w tej samej kolejności za każdym razem!).
Poniżej opisano zalecaną metodę bezpiecznej obsługi ładowania i przetwarzania aktualizacji pól w odwzorowaniach interfejsu użytkownika.
Jeśli w obrębie mapowania interfejsu użytkownika XHTML lub fragmentu wymagany jest JavaScript, należy powiązać go w ramach znacznika ![CDATA[ ]], aby zapewnić poprawny dokument XML. Należy pamiętać, że może wystąpić konieczność wykomentowania samych znaczników, aby ułatwić zachowanie zgodności ze starszymi przeglądarkami. Na przykład:
<script type="text/javascript">
/* <![CDATA[ */
//
// javascript
//
/* ]]> */
</script>
Zdarzenie zmiany elementu
| Składnia | Poprawne wartości |
|---|---|
| oraChange=" " | Funkcja JavaScript. |
Jeśli podczas ładowania odwzorowania interfejsu użytkownika do elementu HTML jest już dołączony program obsługujący zdarzenie, na platformie Framework jest on usuwany i dołączany jest połączony program obsługujący zdarzenie. Połączony program obsługujący zdarzenie wywołuje najpierw program obsługujący platformę Framework. Następnie wywoływane są inne (niestandardowe) programy obsługujące.
W poniższym przykładzie po kliknięciu przycisku wykonywana jest funkcja oraInvokeBS.
<html>
<head>
<title>oraInvokeBS test</title>
</head>
<body>
<table>
<tr>
<td>User Id:</td>
<td>
<input oraField= "xmlGroup/userId"/>
<input type="button" value="Search" oraChange="oraInvokeBS('UserSearch','xmlGroup');"/>
</td>
</tr>
<tr>
<td/>
<td>Search Results</td>
</tr>
<tr>
<td/>
<td>
<table oraList="xmlGroup/searchList">
<tr>
<td><span oraField="userId"></span>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
<xml>
<root>
<xmlGroup>
<userId/>
<searchList>
<userId></userId>
</searchList>
</xmlGroup>
</root>
</xml>
</html>Zdarzenie ładowania strony
| Składnia | Poprawne wartości |
|---|---|
| oraLoad=" " | Funkcja JavaScript. |
-
W poniższym przykładzie podczas ładowania strony wykonywana jest funkcja oraDisplayNone:
<html> <body> <table summary="" border="1" cellpadding="1" cellspacing="1"> <tr> <td oraLoad="oraDisplayNone(item,'userId','')">User Id: </td> <td><span oraField="userId"></span></td> </tr> </table> </body> <xml> <root> <userId>SPLAXT</userId> </root> </xml> </html> -
Renderowany element HTML
Zdarzenie po załadowaniu strony
| Składnia | Poprawne wartości |
|---|---|
| oraAfterLoad="" | Funkcja JavaScript. |
W poniższym przykładzie po załadowaniu strony wykonywana jest funkcja oraGetValueFromScript.
<div>
<label for="boGroup_parameters_externalSystem" oraLabel="boGroup/parameters/externalSystem">
</label>
<span>
<select oraSelect="bs:F1-RetrieveExternalSystems" class="oraInput"
id="boGroup_parameters_externalSystem" oraField="boGroup/parameters/externalSystem"
oraSelectOut="valuePath:results/externalSystem; descPath:results/description"
oraSelectIn="outboundMsgType:boGroup/parameters/outboundMsgType"
oraAfterLoad
="oraGetValueFromScript(document.getElementById('boGroup_parameters_externalSystem');">
</select>
</span>
</div>
Ukrywanie elementów
Ukrywanie przy użyciu funkcji
W systemie dostępnych jest wiele technik ukrywania elementu HTML.
| Składnia | Poprawne wartości | Komentarze |
|---|---|---|
| oraDisplayNone(item ); | (pozycja, "XPath", "value", "operator") | Używane do ukrywania elementu na podstawie wartości innego elementu (z odwołaniem przy użyciu jego ścieżki XPath). Aby sprawdzać wartość pustą, należy wprowadzić wartość ' '. Domyślnie operator to '='. Można skonfigurować to zamiast innych operatorów, takich jak "!=", ">" lub "<". |
| (pozycja, nazwa funkcji, true | false) | Używane do określania funkcji JavaScript, która musi zwrócić wartość logiczną. | |
| oraIsSuppress="true" | Należy użyć tej opcji do pól, które muszą być zawsze ukryte i niezależne od czegoś innego. Należy ustawić ten atrybut w elemencie HTML (elemencie div). |
-
Przykład, w którym etykieta ID użytkownika jest ukrywana w przypadku braku wartości ID użytkownika.
<html> <body> <table summary="" border="1" cellpadding="1" cellspacing="1"> <tr> <td oraLoad="oraDisplayNone(item,'userId','')">User Id: </td> <td><span oraField="userId"></span></td> </tr> </table> </body> <xml> <root> <userId></userId> </root> </xml> </html> -
Przykład, w którym przycisk Zapisz jest ukryty, gdy użytkownik nie ma dostępu do zabezpieczeń czynności zmiany ("C") dla usługi aplikacyjnej "F1-DFLTS".
<html> <body> <table summary="" border="1" cellpadding="1" cellspacing="1"> <tr> <td oraLoad="oraDisplayNone(item, oraHasSecurity('F1-DFLTS', 'C'), false );"> <input name="Save" type="button" onclick="oraInvokeBO('CM-IndividualTaxpayer', null, 'replace')"/> </td> </tr> </table> </body> <xml> <root> <userId></userId> </root> </xml> </html>
Sprawdzanie dostępu użytkownika do zabezpieczeń
W systemie udostępnione są dwie funkcje sprawdzania dostępu użytkownika do zabezpieczeń danej usługi aplikacyjnej i trybu dostępu. Są one często używane do ukrywania elementów.
| Składnia | Parametry |
|---|---|
| oraHasSecurity( ) | "Kod usługi aplikacyjnej" |
| "Tryb dostępu" | |
| oraHasSecurityPath('x','y') | "Ścieżka XPath usługi aplikacyjnej" |
| "Ścieżka XPath trybu dostępu" |
Przykład funkcji oraHasSecurity można znaleźć w poprzedniej sekcji. Poniżej zamieszczono przykład, w którym przycisk statusu jest ukryty, gdy użytkownik nie ma dostępu do zabezpieczeń trybu dostępu ("ATC") dla usługi aplikacyjnej "FORMTST".
<html>
<body>
<table>
<tr>
<td oraLoad="oraDisplayNone(item, oraHasSecurityPath('appService', 'accessMode'), false );">
<input oraField="statusLabel" type="button" onclick="oraRunScript('UpdateState','status');"/>
</td>
</tr>
</table>
</body>
<xml>
<root>
<status>ACTIVATE</status>
<statusLabel>Activate</statusLabel>
<appService>FORMTST</appService>
<accessMode>ACT</accessMode>
</root>
</xml>
</html>Wywoływanie usług opartych na schemacie
W systemie udostępnione są funkcje dotyczące wywoływania obiektu biznesowego, usługi biznesowej lub skryptu usługi.
Wywoływanie funkcji obiektu biznesowego
Ta funkcja służy do wykonywania interakcji obiektu biznesowego bezpośrednio z elementu HTML odwzorowania interfejsu użytkownika. Zwraca ona wartość "true" lub "false" w zależności od tego, czy wywołanie napotka błąd.
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraInvokeBO( ) | "Nazwa OB" | |
| "XPath" lub null | Służy do określania elementu grupy przy użyciu ścieżki XPath. W przypadku określenia słowa null przekazany zostanie cały osadzony obiekt XML. | |
| "action" | Należy określić czynność do zastosowania. Prawidłowe wartości to add (dodawanie), delete (kasowanie), read (odczytywanie), update (aktualizowanie), replace (zastępowanie), fastAdd (szybkie dodawanie) i fastUpdate (szybkie aktualizowanie). Szybki dostęp: Więcej informacji na temat poszczególnych czynności obiektów biznesowych zawiera sekcja Czynności obiektu biznesowego.
|
Przykład z instrukcją wywołaną przez funkcję JavaScript.
function invokeBO {
if (!oraInvokeBO('F1-User','xmlGroup','read')) {
oraShowErrorAlert();
return;
}
}Przykład z instrukcją wywołaną w obrębie funkcji onClick.
<input type="button" class="oraButton" oraMdLabel="DISPLAY_LBL" onClick="oraInvokeBO('F1-User');"/>Wywoływanie funkcji usługi biznesowej
Ta funkcja służy do wykonywania interakcji usługi biznesowej bezpośrednio z elementu HTML odwzorowania interfejsu użytkownika. Zwraca ona wartość "true" lub "false" w zależności od tego, czy wywołanie napotka błąd.
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraInvokeBS( ) | "BS Name" | |
| "XPath" lub null | Służy do określania elementu grupy przy użyciu ścieżki XPath. W przypadku określenia słowa null przekazany zostanie cały osadzony obiekt XML. |
Przykład z instrukcją kodowaną w obrębie funkcji JavaScript.
function invokeBS {
if (!oraInvokeBS('F1-UserSearch','xmlGroup')) {
oraShowErrorAlert();
return;
}
}Przykład z instrukcją wywołaną przy użyciu funkcji onClick.
<input type="button" class="oraButton" oraMdLabel="DISPLAY_LBL" onClick="oraInvokeBS('F1-RetrieveInfo');"/>Wywoływanie funkcji skryptu usługi
Ta funkcja służy do wykonywania interakcji skryptu usługi bezpośrednio z elementu HTML odwzorowania interfejsu użytkownika. Zwraca ona wartość "true" lub "false" w zależności od tego, czy wywołanie napotka błąd.
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraInvokeSS( ) | "Nazwa skryptu usługi" | |
| "XPath" lub null | Służy do określania elementu grupy przy użyciu ścieżki XPath. W przypadku określenia słowa null przekazany zostanie dokument należący do węzła nadrzędnego. Jeśli węzeł nadrzędny nie wystarcza, zawsze można przekazać cały dokument przy użyciu następującej składni: |
Przykład z instrukcją wywołaną w obrębie funkcji JavaScript:
function invokeSS {
if (!oraInvokeSS('F1-GetUsers','xmlGroup')) {
oraShowErrorAlert();
return;
}
}
Przykład z instrukcją wywołaną w obrębie funkcji onClick.
<input type="button" class="oraButton" oraMdLabel="DISPLAY_LBL" onClick="oraInvokeSS('F1-GetUserInfo');"/>Odświeżanie renderowanego odwzorowania lub strony portalu
Odświeżanie mapowania
Ta funkcja służy do odświeżania tylko strefy mapy, z której wydano polecenie.
| Składnia |
|---|
| oraRefreshMap; |
...
<tr>
<td/>
<td><input type="button" onclick="oraRefreshMap();" value="Refresh"/></td>
</tr>
...Odświeżanie strony
Ta funkcja służy do odświeżania wszystkich stref w portalu.
| Składnia |
|---|
| oraRefreshPage; |
...
<tr>
<td/>
<td><input type="button" onclick="oraRefreshPage();" value="Refresh"/></td>
</tr>
...Osadzanie przechodzenia na platformie Framework
Ta funkcja służy do przechodzenia na inną stronę przy użyciu informacji zdefiniowanych w opcji przechodzenia.
| Składnia | Parametry |
|---|---|
| oraNavigate( ); | "Kod opcji przechodzenia" |
| "Ścieżka XPath klucza" |
W poniższym przykładzie pokazano dwa możliwe przypadku użycia tej funkcji: jako adresu URL i jako przycisku. Należy pamiętać, że schemat odwzorowania interfejsu użytkownika musi zawierać atrybut fkRef. Więcej informacji można znaleźć w sekcji Formatowanie odwołania do klucza obcego.
<schema>
<userId fkRef="CI_USER"/>
</schema><html>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>User Link: </td>
<td><a href="" onclick="oraNavigate('userMaint','userId'); return false;">
<span oraField="userId" oraType="fkRef:CI_USER"></span></a>
</td>
</tr>
<tr>
<td>User Button: </td>
<td><input type="submit" onclick="oraNavigate('userMaint','userId')"
value="Go to User"/></td>
</tr>
</table>
</body>
<xml>
<root>
<userId>SPLAXT</userId>
</root>
</xml>
</html>Renderowany element HTML.
Uruchamianie skryptu APB
Uruchamianie skryptu APB
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraRunScript( ); | "Kod skryptu APB". | |
| "Element ścieżki XPath" | Do APB można przekazać jedną lub kilka wartości elementu. APB może odwoływać się do nich jako do zmiennych tymczasowych. |
W poniższym przykładzie tworzona jest zmienna tymczasowa "personId" o wartości "1234567890" i uruchamiany jest skrypt APB o nazwie "Edycja adresu".
<html>
<body>
<table>
<tr>
<td>
<div oraField="address"></div>
<span oraField="city"></span>
<span>,</span>
<span oraField="state"></span>
<span oraField="zip"></span>
<span oraField="country"></span>
<a href="" onClick="oraRunScript('Edit Address','personId');">edit</a>
</td>
</tr>
</table>
</body>
<xml>
<root>
<personId>1234567890</personId>
<address>123 Main St</address>
<city>Alameda</city>
<state>CA</state>
<zip>94770</zip>
</root>
</xml>
</html>Renderowany element HTML.
Uruchamianie skryptu APB z wartościami
Ta funkcja służy do uruchamiania APB, podając pary nazwa/wartość do przekazania do pamięci tymczasowej. Można przekazać wiele wartości. Następnie skrypt APB może odwołać się do zmiennych tymczasowych według nazwy.
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraRunScriptWithValues( ); | "Kod skryptu APB". | |
| "Nazwa elementu XPath":value | Co najmniej jedna para nazw i wartości elementu. |
W poniższym przykładzie za uruchomienie skryptu APB o nazwie "UserEdit" odpowiedzialna jest funkcja JavaScript o nazwie "editUser()". Utworzona zostanie zmienna tymczasowa o nazwie "userId" z wartością "CMURRAY".
<html>
<head>
<script type="text/javascript">
function editUser() {
var values = {'userId': 'CMURRAY'};
oraRunScriptWithValues('UserEdit', values);
return;
}
</script>
</head>
<body>
...
</body>
</html>Zamykanie odwzorowania interfejsu użytkownika z powiązanymi wartościami
Ta funkcja służy do zamykania odwzorowania interfejsu użytkownika. Po zamknięciu odwzorowania można określić wartość do zwrócenia do skryptu, a ponadto, czy ma być zwracany zaktualizowany element XML.
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraSubmitMap( ); | "Zwrócona wartość" | |
| Wartość logiczna | Służy do określania, czy zwrócony ma być zaktualizowany element XML. Wartość domyślna to true. |
W poniższym przykładzie kliknięcie przycisku Zapisz spowoduje zwrócenie zaktualizowanych informacji, a kliknięcie przycisku Anuluj - nie.
<html>
<body>
<table>
<tr>
<td/>
<td style="padding-bottom:15px;">
<a href="" onclick="oraShowErrorAlert(); return false;">
<span oraErrorVar="ERRMSG-TEXT"></span></a>
</td>
</tr>
<tr>
<td >Address:</td>
<td><input type="text" oraField="address"/></td>
</tr>
<tr>
<td>City:</td>
<td><input type="text" oraField="city"/></td>
</tr>
<tr>
<td>State:</td>
<td><input type="text" oraField="state"/></td>
</tr>
<tr>
<td>Zip:</td>
<td><input type="text" oraField="zip"/></td>
</tr>
<tr>
<td/>
<td style="padding-top=15px;">
<input type="button" value="Save" onClick="oraSubmitMap('SAVE');"/>
<input type="button" value="Cancel" onClick="oraSubmitMap('CANCEL',false);"/>
</td>
</tr>
</table>
</body>
<xml>
<root>
<address>123 Main St</address>
<city>Alameda</city>
<state>CA</state>
<zip>94770</zip>
</root>
</xml>
</html>Renderowane przyciski Zapisz i Anuluj:
Uwzględnianie fragmentu odwzorowania
Ta funkcja służy do osadzenia fragmentu odwzorowania w obrębie innego odwzorowania interfejsu użytkownika. Należy pamiętać, że można użyć uwzględniania węzła w obrębie odwzorowania lub fragmentu odwzorowania.
| Składnia | Parametry | Komentarze |
|---|---|---|
| <oraInclude map=' ' prefixPath=' '/> | map="kod odwzorowania interfejsu użytkownika" | |
| prefixPath="Xpath" | Można także określić prefiks ścieżki XPath, który będzie dołączony do każdej uwzględnionej wartości atrybutów oraField, oraLabel, oraList, oraSelect valuePath i descPath, oraDownloadData oraz oraUploadData zdefiniowanych w obrębie elementu HTML uwzględnionego fragmentu odwzorowania interfejsu użytkownika. Uwaga: Ta funkcja dotyczy tylko wartości atrybutu XPath, jeśli wartości te nie są wyświetlane pod atrybutem oraList. Element prefixPath nie będzie miał wpływu na żadną wartość XPath w obrębie tabeli zawierającej atrybut oraList.
|
-
Przykład fragmentu odwzorowania z dwoma przyciskami o nazwach "F1-SaveCancelButtons".
<input onClick ="oraSubmitMap('SAVE');" oraMdLabel="SAVE_BTN_LBL" class="oraButton" type="button"/> <input onClick ="oraSubmitMap('CANCEL',false);" oraMdLabel="CANCEL_LBL" class="oraButton" type="button"/> -
Przykład odwzorowania zawierającego fragment odwzorowania o nazwie "F1-SaveCancelButtons".
... <tr> <td colspan="2" align="center"> <oraInclude map="F1-SaveCancelButtons"/> </td> </tr> ...
Uwzględnianie składnika internetowego
Składnik internetowy jest niestandardowym elementem HTML, który tworzy określoną cechę interfejsu użytkownika. Każdy obsługiwany składnik internetowy ma zazwyczaj co najmniej jeden zdefiniowany atrybut HTML, który wpływa na sposób działania i wyświetlania składnika internetowego. Bardziej złożone składniki internetowe mogą mieć odpowiadający obiekt konfiguracji systemowej, który definiuje zachowanie i informacje wyświetlane przez wynikowy element interfejsu użytkownika. Na przykład składnik internetowy, który tworzy "drzewo" informacji ma tabelę konfiguracji drzewa definiującą szczegóły sposobu pobierania informacji dotyczących drzewa i sposobu wyświetlania każdego węzła.
Wspólne atrybuty
Oto niektóre wspólne atrybuty, które mogą być używane na potrzeby każdego składnika internetowego:
-
Odwołanie do określonego wystąpienia obiektu konfiguracji, który określa szczegóły do utworzenia.
-
Możliwość przekazywania danych kontekstu jako par nazw i wartości.
-
"Tryb", który obsługuje wyświetlanie podglądu cechy
-
Wartość literału. Do wartości można się odwoływać bezpośrednio. Przykład:
treename="F1-Tree" -
Odwołanie XPath. Odwołania XPath muszą używać jawnej składni x[value]. Przykład:
treename="x[migrationTree]" -
Odwołanie do kontekstu globalnego lub portalu. Odwołania te muszą używać jawnej składni c[value].
treename="c[TREE_NAME]" -
Odwołanie do etykiety pola. Odwołania te muszą używać jawnej składni md[value] .
text=md[F1_ADD_LBL]" -
Odwołanie do tekstu pomocy pola. Odwołania te muszą używać jawnej składni mdh[value] .
text=mdh[F1_OPERATIONS_LBL]"
W przypadku złożonych atrybutów, które obsługują jedną lub więcej par nazw/wartości, składnia do definiowania nazw i wartości jest zgodna z tymi samymi regułami, co powyżej, w odniesieniu do wartości literału, odwołań XPath i kontekstu. Należy używać dwukropków (":") do oddzielenia nazwy od wartości i średników (";"), aby oddzielić każdą parę.
context="FIELD_NAME1:x[value1];FIELD_NAME2:F1AB;x[fieldName3]:c[FIELD_NAME3];"Dany składnik internetowy może mieć dodatkowe atrybuty HTML specyficzne dla jego funkcjonalności.
<body>
<oraInclude map="F1-OJETLIBSR"/>
..
</body>W poniższych sekcjach opisano poszczególne obsługiwane składniki internetowe.
Drzewa
Więcej informacji o konfiguracji drzewa znaleźć można w sekcji Drzewa.
| Składnia | Parametry | Komentarze |
|---|---|---|
| <ou-tree...></ou-tree> | treename="singleValue" | Należy podać odwołanie do nazwy obiektu drzewa, który definiuje konfigurację drzewa do wyświetlenia. Ten atrybut oczekuje pojedynczej wartości, która występuje po składni opisanej w sekcji pojedynczej wartości powyżej. |
| context="..." | Opcjonalnie można przekazać jedną lub więcej par nazw/wartości. Składnia jest zgodna z przykładem przedstawionym w powyższych informacjach o atrybutach złożonych. |
W poniższym przykładzie użyto jawnego odwołania do drzewa i nie ma przekazania żadnego kontekstu. Określone drzewo opiera się na kontekście globalnym, do którego dostęp ma algorytm węzła drzewa.
<ou-tree treename="C1-PremiseTree"></ou-tree>Obserwacja do kontekstu
Informacje o konfiguracji dotyczącej definiowania obserwacji do kontekstu znaleźć można w sekcji Obserwacje do kontekstu.
| Składnia | Parametry | Komentarze |
|---|---|---|
| <ou-insights ...></ou-insights> | insightType="singleValue" | Ten atrybut służy do określania typu obserwacji do wyświetlenia. Należy podać ten atrybut lub atrybut klasy obserwacji. Ten atrybut oczekuje pojedynczej wartości, która występuje po składni opisanej w sekcji pojedynczej wartości powyżej. |
| insightClass="singleValue" | Klasa obserwacji służy do wyświetlania wszystkich typów obserwacji dotyczących grupy obserwacji związanych z tą klasą. Ten atrybut oczekuje pojedynczej wartości, która występuje po składni opisanej w sekcji pojedynczej wartości powyżej. | |
| context="..." | Opcjonalnie można przekazać jedną lub więcej par nazw/wartości. Składnia jest zgodna z przykładem przedstawionym w powyższych informacjach o atrybutach złożonych. | |
| mode="preview" | Opcjonalnie można przekazać tryb podglądu, aby wskazać podstawowemu algorytmowi obserwacji przygotowującemu dane, że obserwacja jest wywoływana w trybie podglądu, bez dostępnego kontekstu. W idealnym przypadku algorytm zwraca przykładowe informacje. | |
| class=" " | Opcjonalnie można podać klasę pomocniczą CSS w celu kontrolowania aspektów renderowanej obserwacji. Obsługiwane wartości: class="card-full-width" - ma zastosowanie do obserwacji dotyczących kart. Za pomocą tej klasy opcji można się upewnić, że szerokość obserwacji dotyczącej karty jest dostosowywana do szerokości strefy, która ją zawiera. Obserwacje dotyczące kart, w których nie ustawiono tego parametru, używają stałej szerokości. |
Poniższy przykład pochodzi z odwzorowania podglądu obserwacji, gdzie typem obserwacji jest ten w kontekście. Dane kontekstu nie są potrzebne, a tryb to "podgląd".
<ou-insights insightType="x[insightType]" mode="preview"></ou-insights>W poniższym przykładzie użyto klasy obserwacji i przekazano wartości kontekstu z elementów XPath z jawnie zdefiniowanymi nazwami kontekstu.
<ou-insights insightClass="C1CI" context="PER_ID:x[personId];ACCT_ID:x[accountId];PREM_ID:x[premiseId];"></ou-insights>Przycisk
Składnik internetowy przycisku umożliwia obsługę standardowego zestawu formatów przycisków używanych w systemie.
| Składnia | Parametry | Komentarze |
|---|---|---|
| <ou-button...></ou-button> | type=”singleValue” | Należy zdefiniować typ przycisku do wyświetlenia. Ten atrybut oczekuje pojedynczej wartości, która występuje po składni opisanej w sekcji pojedynczej wartości powyżej. Poprawne wartości typu to:
Jeśli nie podano atrybutu "type", zostanie wyświetlony obraz "uszkodzony przycisk". |
| img=”singleValue” | Należy zdefiniować ścieżkę wyświetlanego obrazu. Konieczne jest podanie tego atrybutu lub atrybutu odwołania do obrazu dla typu przycisku zawierającego obraz. Ten atrybut oczekuje pojedynczej wartości, która występuje po składni opisanej w sekcji pojedynczej wartości powyżej. Należy pamiętać, że w przypadku obrazów SVG, jeśli odwołanie zawiera tylko nazwę pliku SVG bez ścieżki, przyjmuje się, że ścieżką jest repozytorium SVG frameworku. |
|
| imgRef=”singleValue” | Należy zdefiniować odwołanie do ikony wyświetlania obrazu, który ma zostać użyty. Konieczne jest podanie tego atrybutu lub atrybutu obrazu dla typu przycisku zawierającego obraz. Ten atrybut oczekuje pojedynczej wartości, która występuje po składni opisanej w sekcji pojedynczej wartości powyżej. | |
| text="..." | Należy zdefiniować różne elementy tekstowe wymagane przez przycisk. Składnia jest zgodna z przykładem przedstawionym w powyższych informacjach o atrybutach złożonych. Poprawne wartości nazw elementów tekstowych to:
|
|
| menu=”singleValue” | Należy zdefiniować menu, które będzie używane z przyciskiem. Ten atrybut należy podać dla typu przycisku zawierającego kontrolkę menu. Ten atrybut oczekuje pojedynczej wartości, która występuje po składni opisanej w sekcji pojedynczej wartości powyżej. | |
| disabled=”singleValue” | Jest to standardowy atrybut HTML. Wartość "Prawda" lub po prostu obecność tekstu "wyłączony" spowoduje, że przycisk początkowo będzie wyłączony. | |
| security="..." | Opcjonalnie można zdefiniować ustawienia zabezpieczeń przycisku. Przycisk zostanie ukryty, jeśli użytkownik nie ma odpowiedniego dostępu zabezpieczonego. Składnia jest zgodna z przykładem przedstawionym w powyższych informacjach o atrybutach złożonych. Poprawne wartości nazw elementów zabezpieczeń to:
|
|
| clickAction="..." | Opcjonalnie można zdefiniować czynność, która ma zostać wykonana po kliknięciu przycisku. Składnia jest zgodna z przykładem przedstawionym w powyższych informacjach o atrybutach złożonych. Istnieją następujące wartości "nazwy" atrybutu:
Atrybut może również zawierać inne pary nazwa/wartość, które definiują informacje przekazywane do skryptu lub używane jako pola kontekstowe nawigacji. Oprócz ustawień atrybutów zabezpieczeń przed wykonaniem czynności system sprawdzi, czy użytkownik ma dostęp do skryptu lub ścieżki nawigacji. Można nadal używać standardowego atrybutu HTML "onClick". Jeśli HTML zawiera atrybut "onClick" oraz atrybut "clickAction", to atrybut "onClick" będzie miał pierwszeństwo. |
Poniżej znajduje się przykład prostego przycisku z tekstem.
<ou-button type="text" text="label:md[F1_BOOKMARK_LBL];"></ou-button>Poniżej przedstawiono przykład przycisku ikony wykorzystującego odwołanie do ikony wyświetlania.
<ou-button type="image" imgRef="F1CMNT"></ou-button>Poniżej znajduje się przykład przycisku menu obrazu.
<ou-button type="imageMenu" imgRef="F1STTGS" menu="CI_CONTEXTSCRIPT" text="tooltip:md[F1INSTY_VIS_LBL];></ou-button>Poniżej znajduje się przykład przycisku tekstowego powodującego przejście do innej strony.
<ou-button type="text" text="label:md[ALG_CD];tooltip:md[GOTO_ALG]" clickAction="action:NAVIGATE; navopt:f1algqTabMenu; ALG_CD:x[algorithm];></ou-button>Wyświetlanie wartości domyślnej schematu podczas dodawania
Wartości domyślne w schemacie odwzorowania interfejsu użytkownika zostaną wyświetlone w polach wejściowych odwzorowania interfejsu użytkownika, jeśli osadzony węzeł <action> zawiera wartość "ADD" lub jest pusty.
| Składnia |
|---|
| <action>ADD</action> |
| <action> </action> |
Wyświetlona zostanie wartość domyślna schematu dla elementu <description>:
<schema>
<action/>
<boGroup type="group">
<key/>
<description default="enter description here"/>
</boGroup>
</schema><html>
<body>
<table summary="" border="1" cellpadding="1" cellspacing="1">
<tr>
<td>Description </td>
<td><input oraField="boGroup/description"></td>
</tr>
</table>
</body>
<xml>
<root>
<action>ADD</action>
<boGroup>
<key/>
<description/>
</boGroup>
</root>
</xml>
</html>Renderowany element HTML.
Konfigurowanie wykresu
Oprócz integrowania wykresów ze strefami system obsługuje używanie tych samych atrybutów w elemencie HTML odwzorowania interfejsu użytkownika, aby skonfigurować graficzną reprezentację listy XML. Programista może kontrolować typ, rozmiar, położenie i zawartość wykresu przy użyciu tych atrybutów. Szczegóły dotyczące atrybutów i składni można znaleźć w sekcji Konfiguracja wykresu przeglądu danych.
Przykłady wykresów
-
Przykład konfiguracji wykresu kołowego:
<html> <head> <title>Pie Chart</title> </head> <body> <div style="width:100%; height:290px;" oraChart="type:pie;" oraChartSeries1="list:set; labelPath:date; amount:amount; " oraChartBroadcast="BILL_ID:billId;"> </div> </body> <xml> <root> <set> <date>05-02-2003</date> <amount>163.24</amount> <billId>592211649441</billId> </set> <set> <date>06-02-2003</date> <amount>97.29</amount> <billId>592211649442</billId> </set> <set> <date>07-02-2003</date> <amount>54.38</amount> <billId>592211649443</billId> </set> </root> </xml> </html> -
Wykres kołowy renderowany na potrzeby jednej serii:
-
Przykład konfiguracji wykresu liniowego, klastrowego lub skumulowanego - każdy z dwiema seriami:
<html> <head> <title>Stacked Chart</title> </head> <body> <div style="width:100%; height=300px;" oraChart="type:line;" oraChartSeries1="list:set; xaxis:date; label:Charge; amount:amount; " oraChartSeries2="list:set; xaxis:date; label:Balance; amount:balance; " oraChartBroadcast="BILL_ID:billId;"> </div> <div style="width:100%; height=300px;" oraChart="type:cluster;" oraChartSeries1="list:set; xaxis:date; label:Charge; amount:amount; " oraChartSeries2="list:set; xaxis:date; label:Balance; amount:balance; " oraChartBroadcast="BILL_ID:billId;"> </div> <div style="width:100%; height=300px;" oraChart="type:stacked;" oraChartSeries1="list:set; xaxis:date; label:Charge; amount:amount; " oraChartSeries2="list:set; xaxis:date; label:Balance; amount:balance; " oraChartBroadcast="BILL_ID:billId;"> </div> </body> <xml> <root> <set> <date>05-02-2003</date> <amount>163.24</amount> <balance>163.24</balance> <billId>592211649441</billId> </set> <set> <date>06-02-2003</date> <amount>97.29</amount> <balance>260.53</balance> <billId>592211649442</billId> </set> <set> <date>07-02-2003</date> <amount>54.38</amount> <balance>314.91</balance> <billId>592211649443</billId> </set> </root> </xml> </html> -
Trzy typy wykresów, każdy renderowany dla dwóch serii: liniowy, klastrowy i skumulowany.
Ładowanie i pobieranie pliku CSV
Poniższe atrybuty HTML mogą być użyte do zarządzania zarówno ładowaniem, jak i pobieraniem między listą zdefiniowaną w obrębie schematu odwzorowania a plikiem CSV (rozdzielonym przecinkami). Należy pamiętać, że technika ta jest zalecana tylko w przypadku małej i średniej ilości danych, na przykład nie więcej niż kilkaset wierszy. W przypadku większych ilości zaleca się korzystanie z funkcji ładowania/pobierania zadań.
Składnia to oraUploadData="type:embed;path:list xpath;useLabels:true;showCount:true"
W konfiguracji ładowania należy określić nazwę pliku CSV do załadowania, a następnie listy XML jako elementu docelowego. Zgodnie z konwencją każdy wiersz CSV spowoduje utworzenie oddzielnego wystąpienia listy. Każde pole rozdzielone przecinkami w pliku zostanie załadowane jako oddzielny element na liście. Aby w obrębie odwzorowania osadzić okno dialogowe ładowania, należy powiązać atrybut oraUploadData z elementem kontenera, takim jak div, td lub span.
Opcjonalna wartość useLabels:true wskazuje, że podczas analizy składniowej pliku CSV ładowania nagłówkami powinny być etykiety
Określenie opcjonalnej wartości showCount:true spowoduje wyświetlenie liczby załadowanych rekordów.
Przykład oraUploadData="embed" w obrębie elementu div.
<html>
<head>
<title>File Upload</title>
</head>
<body>
<div oraUploadData="type:embed;path:myList"> </div>
</body>
<xml>
<root>
<myList>
<id>838383930</id>
<name>Janice Smith</name>
</myList>
<myList>
<id>737773730</id>
<name>Bill McCollum</name>
</myList>
</root>
</xml>
</html>To okno dialogowe ładowania pliku zostanie osadzone w treści strony, na której zdefiniowano atrybut oraUploadData.
oraUploadData="type:popup;path:list xpath;useLabels:true;showOk:true;showCount:true"
W konfiguracji ładowania należy określić nazwę pliku CSV do załadowania, a następnie listy XML jako elementu docelowego. Zgodnie z konwencją każdy wiersz CSV spowoduje utworzenie oddzielnego wystąpienia listy. Każde pole rozdzielone przecinkami w pliku zostanie załadowane jako oddzielny element na liście. Aby załadować plik CSV przy użyciu podręcznego okna dialogowego, należy powiązać atrybut oraUploadData z elementem wejściowym, takim jak przycisk, łącze tekstowe lub obraz.
Opcjonalna wartość useLabels:true służy do określania, że podczas analizy składniowej pliku CSV ładowania nagłówkami powinny być etykiety
Określenie opcjonalnej wartości showOk:true spowoduje wyświetlenie przycisku "OK" po zakończeniu ładowania. Okno podręczne pozostanie otwarte do momentu naciśnięcia przycisku. Ponadto określenie wartości showCount:true spowoduje wyświetlenie liczby załadowanych rekordów.
Przykład atrybutu oraUploadData="popup" powiązanego z przyciskiem:
<html>
<head>
<title>File Upload</title>
</head>
<body>
<input type="button" name="submitButton" oraUploadData="type:popup;path:myList;" value='Get Data'>
<table oraList="myList">
<tr/>
<tr>
<td><span oraField="id"/></td>
<td><span oraField="name"/></td>
</tr>
</table>
</body>
<xml>
<root>
<myList>
<id>838383930</id>
<name>Janice Smith</name>
</myList>
<myList>
<id>737773730</id>
<name>Bill McCollum</name>
</myList>
</root>
</xml>
</html>Renderowany element HTML:
Naciśnięcie przycisku "Pobierz dane" spowoduje wyświetlenie standardowego okna dialogowego ładowania pliku (dostarczonego przez platformę Framework), jak pokazano poniżej.
oraDownloadData="list xpath"
W konfiguracji pobierania należy określić nazwę listy CSV do pobrania. Zgodnie z konwencją każde wystąpienie listy będzie reprezentować oddzielny wiersz w utworzonym pliku. Domyślnie każdy element listy będzie w pliku rozdzielony przecinkami.
Przykład atrybutu oraDownloadData.
<html>
<head>
<title>File Download</title></head>
<body>
<input type="button" name="downloadButton" oraDownloadData="myList" value="Download"/>
</body>
<xml>
<root>
<myList>
<id>881-990987</id>
<name>John Mayweather</name>
</myList>
<myList>
<id>229-765467</id>
<name>Anna Mayweather</name>
</myList>
<myList>
<id>943-890432</id>
<name>Andrew Brewster</name>
</myList>
</root>
</xml>
</html>Renderowany element HTML:
Naciśnięcie przycisku "Pobierz" spowoduje wyświetlenie standardowego okna dialogowego pobierania pliku (dostarczonego przez platformę Framework), jak pokazano poniżej.
Wynikiem pomyślnego pobieranie będzie plik CSV:
Aby pobrać dane z listy podrzędnej, należy użyć atrybutu oraDownloadDataInList, nie oraDownloadData. Atrybut oraDownloadDataInList będzie zawierać nazwę listy podrzędnej. Ścieżka XPath listy podrzędnej jest używana do pobierania danych określonego wiersza z listy nadrzędnej. A zatem pobierana jest tylko określona lista podrzędna.
oraDownloadDataUseLabels="true"
Atrybut oraDownloadDataUseLabels może być używany tylko w połączeniu z atrybutem oraDownloadData opisanym powyżej. Aby w wygenerowanym pliku CSV były używane etykiety elementów dla nagłówków kolumn, nie nazw elementów, należy określić wartość oraDownloadDataUseLabels.
Konstruowanie fragmentów odwzorowania strefy portalu
Strefy portalu mogą zawierać odwołania do odwzorowania interfejsu użytkownika dotyczącego nagłówka strefy i obszaru filtra. To odwzorowanie interfejsu użytkownika nie stanowi kompletnego dokumentu HTML, ale jest konfigurowane jako "fragment" odwzorowania interfejsu użytkownika. Podczas konstruowania fragmentu odwzorowania strefy można umieścić odwołanie do następujących zmiennych zastąpienia. Należy pamiętać, że te zmienne będą automatycznie wypełniane podczas uruchamiania z informacjami dotyczącymi strefy odwzorowania w obrębie portalu:
| Zmienna | Logika zastąpienia |
|---|---|
| [$ZONEDESCRIPTION] | Tekst opisu strefy. |
| [$SEQUENCEID] | ID sekwencji strefy. |
| [$ZONENAME] | Nazwa strefy. |
| [$HELPTEXT] | Tekst pomocy strefy. |
| [$ZONEPARAMNAME] | Wartość parametru strefy (lub puste, jeśli nie określono). |
-
Przykłady odwzorowań: F1-UIMapHeader i F1-ExplorerHeader.
-
Zastosowany w tych odwzorowaniach znacznik oraInclude służy do włączania fragmentów HTML dotyczących menu nagłówka i czynności platformy Framework. Informacje na temat fragmentów odwzorowania interfejsu użytkownika, które należy uwzględnić w elemencie HTML, można znaleźć w parametrach typu strefy.
-
Aby obok opisu strefy wyświetlana była ikona "tekst pomocy", należy na <td> z opisem umieścić id="title_[$SEQUENCEID]".
-
Jeśli w obrębie fragmentu mapowania interfejsu użytkownika należy umieścić JavaScript, konieczne będzie powiązanie JavaScript w ramach znacznika
![CDATA[ ]], aby zapewnić poprawny dokument XML. Należy pamiętać, że może wystąpić konieczność wykomentowania samych znaczników, aby ułatwić zachowanie zgodności ze starszymi przeglądarkami. Na przykład:<script type="text/javascript"> /*<![CDATA[ */ // //javascript // /*]]> */ </script>
-
oraGetZoneSequence(zoneName). Służy do pobierania numeru kolejnego strefy na podstawie jej kodu.
-
oraIsZoneCollapsed(sequenceId). Służy do określania, czy strefa jest zwinięta, na podstawie jej numeru kolejnego.
-
oraHandleCollapse(seq). Zwijanie strefy.
-
oraHandleExpand(seq,refresh). Rozwijanie i/lub odświeżanie strefy.
Przykład użycia atrybutu oraLoad[$SEQUENCEID] w obrębie funkcji:
<script type="text/javascript">
function oraLoad[$SEQUENCEID]() {
checkRebateClaimStatus();
}
function checkRebateClaimStatus() {
var work = id(''analyticsFilterText[$SEQUENCEID]'',
document).cells[0].innerText.split('' '');
var rebateClaimId = work[work.length - 3];
id(''rebateClaimId'', document).value = rebateClaimId;
oraInvokeSS(''C1-CheckRCSt'',''checkRebateClaimStatus'', false);
var statusIndicator = id(''statusInd'', document).value;
if (statusIndicator == ''C1PE'' || statusIndicator == ''C1ID'') {
id(''addRebateClaimLine'', document).style.display = '''';
} else {
id(''addRebateClaimLine'', document).style.display = ''none'';
}
}
</script>Renderowany element F1-ExplorerHeader:
Wywoływanie obiektu biznesowego
Funkcja oraInvokeBO może być użyta w obrębie nagłówka strefy portalu lub odwzorowania filtra strefy. Jest ona podobna do polecenia opisanego w sekcji Wywoływanie funkcji obiektu biznesowego umożliwiającej wywołanie obiektu biznesowego w obrębie elementu HTML odwzorowania interfejsu użytkownika. W sekcji tej można znaleźć opis pierwszych trzech parametrów.
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraInvokeBO( ) | "Nazwa OB" | |
| "XPath" lub null | ||
| "action" | ||
| null | Należy określić jako czwarty argument. | |
| [$SEQUENCEID] | Należy określić jako piąty argument. | |
| true | false | Należy określić wartość true, jeśli fragment jest używany w obrębie nagłówka strefy portalu. Należy określić wartość false, jeśli fragment jest używany z odwzorowaniem filtra strefy. |
Przykład w nagłówku strefy portalu:
oraInvokeBO('CM-User','xmlGroup','read', null, [$SEQUENCEID], true)Wywoływanie usługi biznesowej
Funkcja oraInvokeBS może być użyta w obrębie nagłówka strefy portalu lub odwzorowania filtra strefy. Jest ona podobna do polecenia opisanego w sekcji Wywoływanie funkcji usługi biznesowej umożliwiającej wywołanie usługi biznesowej w obrębie elementu HTML odwzorowania interfejsu użytkownika. W sekcji tej można znaleźć opis pierwszych dwóch parametrów.
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraInvokeBS( ) | "Nazwa OB" | |
| "XPath" lub null | ||
| null | Należy określić jako czwarty argument. | |
| [$SEQUENCEID] | Należy określić jako piąty argument. | |
| true | false | Należy określić wartość true, jeśli fragment jest używany w obrębie nagłówka strefy portalu. Należy określić wartość false, jeśli fragment jest używany z odwzorowaniem filtra strefy. |
Przykład w nagłówku strefy portalu:
oraInvokeBS('CM-UserSearch','xmlGroup', null, [$SEQUENCEID], true)Wywoływanie skryptu usługi
Funkcja oraInvokeSS może być użyta w obrębie nagłówka strefy portalu lub odwzorowania filtra strefy. Jest ona podobna do polecenia opisanego w sekcji Wywoływanie funkcji usługi biznesowej umożliwiającej wywołanie skryptu usługi w obrębie elementu HTML odwzorowania interfejsu użytkownika. W sekcji tej można znaleźć opis pierwszych dwóch parametrów.
| Składnia | Parametry | Komentarze |
|---|---|---|
| oraInvokeSS( ) | "Nazwa skryptu usługi" | |
| "XPath" lub null | ||
| null | Należy określić jako czwarty argument. | |
| [$SEQUENCEID] | Należy określić jako piąty argument. | |
| true | false | Należy określić wartość true, jeśli fragment jest używany w obrębie nagłówka strefy portalu. Należy określić wartość false, jeśli fragment jest używany z odwzorowaniem filtra strefy. |
Przykład w nagłówku strefy portalu:
oraInvokeSS('UserSearch','xmlGroup', null, [$SEQUENCEID], true)Wykrywanie niezapisanych zmian
Ta funkcja umożliwia zwrócenie wartości logicznej "true", jeśli istnieją niezapisane zmiany. System wyśle zapytanie do funkcji, gdy użytkownik podejmie próbę przejścia, i wyda odpowiednie ostrzeżenie. Ta funkcja jest potrzebna tylko wówczas, jeśli w odwzorowaniu interfejsu użytkownika jest używany niestandardowy skrypt JavaScript do zarządzania elementami w taki sposób, że system nie jest w stanie wykryć, czy wprowadzono zmiany. Należy także zauważyć, że to skrypt JavaScript jest odpowiedzialny za zarządzanie wartościami logicznymi używanymi na potrzeby tej funkcji.
function hasUnsavedChanges(){
return isDirtyFlag;
}Ukrywanie kart portalu
Produkt udostępnia możliwość korzystania z JavaScript, aby ukryć kartę w bieżącym portalu na podstawie określonych warunków przy użyciu interfejsu API JavaScript oraAuthorizeTab. W tym interfejsie API akceptowana jest funkcja jako parametr i wyłączany jest wskazany indeks karty.
Na przykład w odwzorowaniu interfejsu użytkownika może być zawarta funkcja umożliwiająca wyłączanie jednego lub kilku indeksów kart.
function overrideTabIndex(index){
if (index == 2) return false;
if (index == 3) return false;
}Odwołanie do JavaScript pojawia się "podczas ładowania":
<body class="oraZoneMap"
onLoad="oraAuthorizeTabs(overrideTabIndex);">Wymagane biblioteki JavaScript
Całość funkcji opisanej w tym dokumencie zależy od pary bibliotek JavaScript. W przypadku zapisywania i wykonywania odwzorowań wyłącznie w obrębie platformy Framework renderowania odwzorowania interfejsu użytkownika nie ma konieczności ręcznego wstawiania następujących bibliotek - zostaną one wstawione przez platformę Framework podczas renderowania odwzorowania interfejsu użytkownika.
src="privateUserMapSupport.js"
Dokument HTML musi zawierać odwołanie do tej biblioteki w celu wykonania powiązania autonomicznego środowiska.
<script type="text/javascript" src="privateUserMapSupport.js"></script>src="userMapSupport.js"
Aby skorzystać z opcjonalnych funkcji zestawu narzędzi, należy odwołać się do tej biblioteki.
<script type="text/javascript" src="userMapSupport.js"></script>onload="oraInitializeUserMap();"
Aby wykonać powiązanie w środowisku autonomicznym, należy osadzić w węźle <body> następującą funkcję ładowania.
<body onload="oraInitializeUserMap();">