Reguły formularza – warunkowe kolorowanie atrybutu

Facebooktwitterpinterestlinkedinmail
Dotyczy wersji 2017.1.x; Autor: Tomasz Pytlak

Wstęp:

Tworząc obieg biznesowy niejednokrotnie chcemy zwrócić uwagę użytkownika na uzupełnione przez niego wartości. Przekroczenie pewnej kwoty, czy wybranie przeszłej daty mogą być działaniami, których użytkownik w kontekście danego procesu nie powinien podejmować. Jeżeli jednak chcemy dopuścić taką możliwość, ale jednocześnie zwrócić uwagę na przekroczenie zakresu lub już na etapie wypełniania formularza wyeksponować popełnione błędy, to warto wykorzystać reguły formularza do zmiany formatowania fontu oraz tła.

Proces i założenia:

Dla potrzeb niniejszego artykułu stworzono obieg „Zamówienia” zawierający pola:

  • Autor (Osoba lub grupa)
  • Data (Data i godzina)
  • Wartość zamówienia (Liczba zmiennoprzecinkowa)
  • Zamówienie (Lista pozycji)
    • Przedmiot zamówienia (Pojedynczy wiersz tekstu)
    • Wartość (Liczba zmiennoprzecinkowa)

Podsumowanie wartości z listy przenoszone jest do pola Wartość zamówienia.

Rys 1. Obieg Zamówienia

 

Jeżeli użytkownik przekroczy limit 10 000 PLN, wielkość czcionki w polu Wartość zamówienia zostanie 3-krotnie powiększona, a tło zamienione na czerwone.

 

Konfiguracja:

Wykonanie takiej konfiguracji wymaga trzech czynności:

  1. Ustawienia kontrolki Wartości zamówienia w matrycy atrybutów jako „Tylko do odczytu (możliwość zmiany przez JavaScript)”.

Rys 2. Matryca atrybutów

 

2. Stworzenia reguły formularza w zakładce Konfiguracja -> Reguły formularza.

Reguła formularza budową przypomina matrioszkę, a jej tworzenie polega na przeciąganiu lub wpisywaniu kolejnych funkcji wewnątrz poprzednich. Wszystkie metody pozwalające na zmianę formatowania, znajdują się w zakładce „Wygląd”. Oprócz nich niezbędny będzie wybór warunkowy (IF THEN), prosta nierówność oraz Wartość zamówienia z atrybutów formularza.

Rys 3. Edycja reguły

 

 

Rys 4. Gotowa reguła formularza „Przekroczenie wartości zamówienia”

 

Utworzoną regułę można przetłumaczyć w następujący sposób:

  • Jeżeli Wartość zamówienia > 10000 to wykonaj:
    • Ustaw kolor tła atrybutu Wartość zamówienia jako czerwony
    • Ustaw kolor pola tekstowego atrybutu Wartość zamówienia jako czerwony
    • Powiększ czcionkę atrybutu do 300%
  • W pozostałych przypadkach (czyli wartość <=10000 lub pusta):
    • Wyczyść formatowanie tła atrybutu Wartość zamówienia
    • Zmień kolor pola tekstowego atrybutu Wartość zamówienia na żółty
    • Wyczyść formatowanie czcionki atrybutu Wartość zamówienia

Określenie pole tekstowe dotyczy pola, w którym wpisywana jest wartość. W trybie edycji jest ono białe, a w „Tylko do odczytu (możliwość zmiany przez JavaScript)” żółte i w obu przypadkach przesłania właściwe tło. Określanie koloru pola tekstowego wygląda nieco inaczej niż tła czy czcionki, ponieważ wymaga zastosowania języka CSS, dzięki czemu oprócz samego koloru można ustawić np. wyśrodkowanie. Wadą jest natomiast brak możliwości wyczyszczenia formatowań za pomocą funkcji EMPTY, w związku z czym ręcznie ustawiono pierwotny kolor.

 

3. Wywołanie reguły formularza.

Odwołanie się do reguły formularza może być wykorzystana w wielu miejscach np. przy uruchomieniu strony, postbackach czy zmianie wartości atrybutu. Dla osiągnięcia celu najlepszym wyjściem jest ustawienie reguły właśnie na zmianę Wartości zamówienia.

Rys 5. Reguła formularza na zmianę wartości

 

Wynik:

Po wykonaniu opisanych czynności i przekroczeniu kwoty granicznej, osiągniemy poniższy wygląd formularza.

Rys 6. Formularz po przekroczeniu wartości

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *