Piotr Sobczyk

Piotr Sobczyk Student,
Politechnika
Wrocławska

Temat: [JSF] Java Server Faces i CSSy

Mam pytanie do ludzi, którzy wyrobili już sobie jakieś Dobre Praktyki w korzystaniu z JSF ;).

Jasną sprawą jest, że warto izolować prezentację w osobnych plikach .css. Pytanie tylko, w jaki sposób wybierać elementy po identyfikatorze? JSF tworzy sobie przestrzenie nazw, i generuje identyfikatory komponentów używając znaku ":". Przez co jeśli mamy fragment strony:

<h:form id="form1">
<h:inputText id="input1"/>
</h:form>

To prawdziwy identyfikator pola tekstowego będzie wyglądał: "form1:input1", a nie "input1". Z tego co wyczytałem na innych forach (np. tutaj: http://forums.sun.com/thread.jspa?threadID=5310179 ) można w css'ie odpowiedni selektor zapisać, escapując znak ":". Pytanie, czy ma sens podawanie takich koślawych ścieżek w każdym miejscu, gdzie w CSSie chcemy wybrać element po id i czy nie jest to podatne na błędy? I nie pogarsza czytelności arkuszy styli?

W jaki sposób obchodzicie ten problem? Korzystacie z wybieraniu elementów po id i escapujecie ":" czy nie wybieracie w ogóle po id tylko tworzycie osobne klasy dla elementów, które normalnie byłyby wybrane przez id? Z góry dzięki za pomoc.Piotr Sobczyk edytował(a) ten post dnia 02.10.10 o godzinie 19:08
Aleksandra Kuchna

Aleksandra Kuchna Główny Architekt IT

Temat: [JSF] Java Server Faces i CSSy

Korzystamy z styleClass

<h:inputText id="input1" styleClass="input1"/>

a w css:

.input1{
width: 600px;
}

konto usunięte

Temat: [JSF] Java Server Faces i CSSy

Przede wszystkich zapoznaj się z argumentem prependId taga h:form i ustawiaj go na false, jeżeli nie chcesz mieć dodawanych prefixów z id form'a w identyfikatorach elementów danego formularza.
Piotr Sobczyk

Piotr Sobczyk Student,
Politechnika
Wrocławska

Temat: [JSF] Java Server Faces i CSSy

Aleksandra: tak też myślałem, żeby korzystać tylko z klas i nie używać wybierania po id. Problem w tym, że wydaje się trochę sztuczne, żeby tworzyć nową klasę tylko dla jednego konkretnego elementu. O wiele wygodniejsze i chyba zalecane jest żeby wybierać taki element po id, jeśli chcemy dany styl przypisać tylko temu elementowi.

Marek: nie wiedziałem o takim argumencie, dzięki za informację. Muszę się jeszcze upewnić, czy nie korzystam z innych NamingContainer-ów niż h:form (np. z biblioteki Rich Faces) i czy one również posiadają podobny argument, ale wydaje się całkiem niezłym rozwiązaniem.

A mogę się zapytać, czy Wy właśnie z takiego rozwiązania korzystacie? I czy nie macie przez to jakichś problemów? Bo po wygooglowaniu "prependId" znalazło mi mnóstwo wątków dotyczących problemów związanych z ustawianiem prependId na false.

konto usunięte

Temat: [JSF] Java Server Faces i CSSy

To tylko wycięcie przedrostka z nazwy indentyfikatora, także jeżeli stosowane świadomie, nie sprawia żadnych problemów - przynajmniej żaden mi teraz nie przychodzi do głowy :)
Piotr Sobczyk

Piotr Sobczyk Student,
Politechnika
Wrocławska

Temat: [JSF] Java Server Faces i CSSy

Ok, dzięki serdeczne za pomoc :).
Aleksandra Kuchna

Aleksandra Kuchna Główny Architekt IT

Temat: [JSF] Java Server Faces i CSSy

Piotr Sobczyk:
Aleksandra: tak też myślałem, żeby korzystać tylko z klas i nie używać wybierania po id. Problem w tym, że wydaje się trochę sztuczne, żeby tworzyć nową klasę tylko dla jednego konkretnego elementu. O wiele wygodniejsze i chyba zalecane jest żeby wybierać taki element po id, jeśli chcemy dany styl przypisać tylko temu elementowi.

A mogę się zapytać, czy Wy właśnie z takiego rozwiązania korzystacie? I czy nie macie przez to jakichś problemów? Bo po wygooglowaniu "prependId" znalazło mi mnóstwo wątków dotyczących problemów związanych z ustawianiem prependId na false.

Zależy od tego jak traktujesz pliki css. Dla mnie to szablon, który nakładam na wiele naszych aplikacji dzięki czemu wszystkie wyglądają tak samo. Dlaczego chcesz zmieniać wygląd jednego tylko komponentu? Być może masz małą, testową aplikację i dany typ komponentu występuje tylko raz, wtedy owszem nie ma co fundować sobie przerostu formy nad treścią. Jednak w dużych systemach gdzie są dziesiątki formularzy i setki inputów nie znalazło by to zastosowania. Jeśli już muszę zmienić wygląd jakiegoś wyjątkowego komponentu to nie izoluję wyglądu tylko koduje go bezpośrednio w style komponentu.

Generalnie uzależnianie reszty aplikacji od id komponentu, podobnie jak wyłączanie prependId jest ryzykowne w dużych aplikacjach. Może być wiele formularzy na stronie, bez id forma nie dojdziesz co jest co. Są problemy z unikalnością id komponentów w przypadku stron złożonych, komunikaty o błędach będą nieprecyzyjne, itp.
Piotr Sobczyk

Piotr Sobczyk Student,
Politechnika
Wrocławska

Temat: [JSF] Java Server Faces i CSSy

Dzięki za wyczerpującą i naprawdę wartościową dla mnie odpowiedź, Aleksandra.
Dlaczego chcesz zmieniać wygląd jednego tylko komponentu? Być może masz małą, testową aplikację i dany typ komponentu występuje tylko raz, wtedy owszem nie ma co fundować sobie przerostu formy nad treścią.

Tak, tworzę niewielką aplikację (sklep internetowy), składającą się z zaledwie kilku stron, a każda z nich jest na swój sposób unikalna. Dlatego czasem mam potrzebę korzystać z id. W takiej sytuacji korzystanie z prependId wydaje się bezpiecznym rozwiązaniem, w razie potrzeby można tworzyć sobie własne sztuczne "przestrzenie nazw" w identyfikatorach dla każdego modułu czy nawet pojedynczych stron.

Jednak całkowicie rozumiem Twój punkt widzenia dla większych aplikacji. Wtedy faktycznie korzystanie z id byłoby proszeniem się o kłopoty w przyszłości z modyfikowaniem i utrzymaniem aplikacji. I zapewne byłoby po prostu niepraktyczne.
Jeśli już muszę zmienić wygląd jakiegoś wyjątkowego komponentu to nie izoluję wyglądu tylko koduje go bezpośrednio w style komponentu.

Może takie podejście rzeczywiście ma sens. Przecież nie to jest głównym powodem izolowania stylów CSS, żeby nadawać style pojedynczym elementom, tylko żeby nadać spójny wygląd całej witrynie. Jednak moim zdaniem podawanie styli inline pogarsza nieco czytelność kodu. Analizując kod strony przeważnie chcemy się skupić na treści i strukturze, nie chcemy jej zaciemniać dodatkowymi elementami.

>Generalnie uzależnianie reszty aplikacji od id komponentu, podobnie jak
>wyłączanie prependId jest ryzykowne w dużych aplikacjach.

Ale jednak być może czasami potrzebujecie manipulować zawartością strony z poziomu Javy czy JS, żeby uzyskać ciekawsze, dynamiczne zachowanie interfejsu? Wtedy trudno uniknąć uzależniania reszty aplikacji od id komponentów.

>Dla mnie to szablon, który nakładam na wiele naszych aplikacji dzięki czemu >wszystkie wyglądają tak samo.

To robi wrażenie. A tak z ciekawości, czy layout stron opieracie wtedy również na tych plikach-szablonach CSS? Potrzeby odnośnie rozmieszczenia komponentów mogą się różnić pomiędzy aplikacjami czy nawet stronami. Trudno mi sobie wyobrazić, żeby layout można było uczynić tak uniwersalnym i reusable jak np. wygląd pewnych powtarzających się komponentów.
Krzysztof O.

Krzysztof O. typowy facet

Temat: [JSF] Java Server Faces i CSSy

Piotr Sobczyk:
Tak, tworzę niewielką aplikację (sklep internetowy), składającą się z zaledwie kilku stron, a każda z nich jest na swój sposób unikalna.

Klasy css mają tę przewagę nad id, że można ich przypisać kilka do elementu. I tak np. element do wprowadzania tekstu o klasach gray required textual będzie mógł nieco inaczej prezentować się niż element do wprowadzania ceny o klasach gray optional price, pomimo zastosowania w obu przypadkach htmlowego input type="text". W omawianym przykładzie klasa gray odpowiada za (przykładowo) kolorystykę i typografię, required/optional za oznaczenie komponentu w sposób widoczny dla użytkownika jako wymagany i opcjonalny, a textual/price może odpowiadać za np. wyrównywanie tekstu do lewej/prawej, albo podpięciu walidacji klienckich w JS.
Dlatego czasem mam potrzebę korzystać z id.

Wydaje ci się, nie masz takiej potrzeby. To że może się to wydawać łatwiejsze nie oznacza, że jest to prawidłowe.

Następna dyskusja:

Idelane srodowisko do pracy...




Wyślij zaproszenie do