Bir XHTML sayfasına başka bir XHTML sayfası eklemenin en doğru yolu nedir? Farklı yollar deniyorum, hiçbiri çalışmıyor.
Bir XHTML sayfasına başka bir XHTML sayfası eklemenin en doğru yolu nedir? Farklı yollar deniyorum, hiçbiri çalışmıyor.
Yanıtlar:
<ui:include>
En temel yol <ui:include>
. Birlikte verilen içerik içine yerleştirilmelidir <ui:composition>
.
Kalıp sayfanın başlangıç örneği /page.xhtml
:
<!DOCTYPE html>
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<h:head>
<title>Include demo</title>
</h:head>
<h:body>
<h1>Master page</h1>
<p>Master page blah blah lorem ipsum</p>
<ui:include src="/WEB-INF/include.xhtml" />
</h:body>
</html>
Dahil etme sayfası /WEB-INF/include.xhtml
(evet, bu dosyanın tamamıdır, dışındaki tüm etiketler <ui:composition>
zaten Facelets tarafından göz ardı edildiğinden gereksizdir):
<ui:composition
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<h2>Include page</h2>
<p>Include page blah blah lorem ipsum</p>
</ui:composition>
Bunun tarafından açılması gerekiyor /page.xhtml
. Eğer tekrar gerekmez o notu yapın <html>
, <h:head>
ve <h:body>
bu dosyayı dahil içeride aksi sonuçlanacak geçersiz HTML .
İçinde dinamik EL ifadesi kullanabilirsiniz <ui:include src>
. Ayrıca bkz . Gezinme menüsüne göre dinamik içerik ekleme ajax nasıl yenilenir? (JSF SPA) .
<ui:define>
/<ui:insert>
Eklemenin daha gelişmiş bir yolu şablonlaştırmaktır . Bu temelde diğer yönde de içerir. Kalıp şablon sayfası, <ui:insert>
tanımlanmış şablon içeriği eklemek üzere yerler bildirmek için kullanılmalıdır . Ana şablon sayfasını kullanan şablon istemci sayfası, <ui:define>
eklenecek şablon içeriğini tanımlamak için kullanmalıdır .
Ana şablon sayfası /WEB-INF/template.xhtml
(tasarım ipucu olarak: üstbilgi, menü ve altbilgi de <ui:include>
dosya olabilir):
<!DOCTYPE html>
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<h:head>
<title><ui:insert name="title">Default title</ui:insert></title>
</h:head>
<h:body>
<div id="header">Header</div>
<div id="menu">Menu</div>
<div id="content"><ui:insert name="content">Default content</ui:insert></div>
<div id="footer">Footer</div>
</h:body>
</html>
Şablon istemci sayfası /page.xhtml
( template
özniteliğe dikkat edin ; ayrıca burada, bu dosyanın tamamıdır):
<ui:composition template="/WEB-INF/template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<ui:define name="title">
New page title here
</ui:define>
<ui:define name="content">
<h1>New content here</h1>
<p>Blah blah</p>
</ui:define>
</ui:composition>
Bunun tarafından açılması gerekiyor /page.xhtml
. Hayır ise <ui:define>
, varsa içindeki varsayılan içerik <ui:insert>
görüntülenecektir.
<ui:param>
Sen parametreler iletebilirsiniz <ui:include>
ya <ui:composition template>
tarafından <ui:param>
.
<ui:include ...>
<ui:param name="foo" value="#{bean.foo}" />
</ui:include>
<ui:composition template="...">
<ui:param name="foo" value="#{bean.foo}" />
...
</ui:composition >
İçerme / şablon dosyasının içinde, olarak kullanılabilir #{foo}
. "Birçok" parametreyi <ui:include>
iletmeniz gerekiyorsa, içerme dosyasını bir tagfile olarak kaydetmeyi düşünmelisiniz, böylece sonunda bu şekilde kullanabilirsiniz <my:tagname foo="#{bean.foo}">
. Ayrıca bkz. <Ui: include>, etiket dosyaları, bileşik bileşenler ve / veya özel bileşenler ne zaman kullanılır?
Tüm fasulyeleri, yöntemleri ve parametreleri bile geçebilirsiniz <ui:param>
. Ayrıca bkz. JSF 2: Facelets alt görünümüne çağrılacak bir argüman içeren bir eylem nasıl iletilir (ui: include ve ui: param kullanılarak)?
Sadece URL'sini girerek / tahmin ederek herkesin erişebileceği düşünülmeyen /WEB-INF
dosyaların, yukarıdaki örnekte içerme dosyası ve şablon dosyası gibi bir klasöre yerleştirilmesi gerekir . Ayrıca bkz. Hangi WEHTML dosyalarını / WEB-INF içine koymam gerekiyor, hangileri değil?
<ui:composition>
Ve dışında herhangi bir işaretleme (HTML kodu) olması gerekmez <ui:define>
. Herhangi birini koyabilirsiniz, ancak Facelets tarafından göz ardı edilecektir. Orada işaretleme koymak sadece web tasarımcıları için yararlıdır. Ayrıca bkz . Tüm projeyi oluşturmadan bir JSF sayfası çalıştırmanın bir yolu var mı?
HTML5 doktipi, bugünlerde XHTML dosyası olmasına rağmen "önerilen doktrop. XHTML'yi XML tabanlı bir araç kullanarak HTML çıktısı oluşturmanıza izin veren bir dil olarak görmelisiniz. Ayrıca bkz. HTML 4/5 ile JSF + Facelets kullanmak mümkün mü? ve JavaServer Faces 2.2 ve HTML5 desteği, XHTML neden hala kullanılıyor .
CSS / JS / resim dosyaları dinamik olarak yeniden yerleştirilebilir / yerelleştirilmiş / sürümlendirilmiş kaynaklar olarak eklenebilir. Ayrıca , Facelets şablonunda CSS / JS / resim kaynağına nasıl başvurulur?
Facelets dosyalarını yeniden kullanılabilir bir JAR dosyasına koyabilirsiniz. Ayrıca , paylaşılan kod içeren birden çok JSF projesi için Yapı'ya bakın .
Gelişmiş Facelets şablonunun gerçek dünyadaki örnekleri için Java EE Başlangıç Uygulaması kaynak kodu ve OmniFaces vitrin sitesi kaynak kodusrc/main/webapp
klasörünü kontrol edin .
<ui:composition ...>
facelet içinde ilan ederseniz, doktipi de bildirmeniz gerekir <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
, aksi takdirde entity referenced but not declared
HTML varlıklarını kullanırken bir hata alırsınız .
Eklenen sayfa:
<!-- opening and closing tags of included page -->
<ui:composition ...>
</ui:composition>
Sayfa dahil:
<!--the inclusion line in the including page with the content-->
<ui:include src="yourFile.xhtml"/>
ui:composition
yukarıda gösterildiği gibi başlatırsınız .ui:include
yukarıda da gösterildiği gibi, dahil xhtml dosyasına dahil edersiniz .<ui:include src="/yourFile.xhtml"/>
ya da<ui:include src="/WEB-INF/yourFile.xhtml"/>