Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Hello,
i have a zhtml layout derived from a customers HTML/CSS corporate design.
When i add ZK-components directly to the zhtml the page is rendered fine. Meta-tags and CSS links are in head and head contains the ZK CSS/JS stuff as expected:
<head> <title>Event Planner</title> <link rel="shortcut icon" href="resources/images/images_admin/favicon.ico"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7"> <meta name="META_SEARCH" content="1"> <meta name="robots" content="noodp"> <link rel="stylesheet" type="text/css" href="resources/css/basic.css"> <link href="eventplanner/zkau/web/ac292a86/zul/css/zk.wcs" type="text/css" rel="stylesheet"> <link href="eventplanner/zkau/web/ac292a86/silvergray/img.css.dsp" type="text/css" rel="stylesheet"> <link href="eventplanner/zkau/web/ac292a86/silvergray/color.css.dsp" type="text/css" rel="stylesheet"> <script charset="UTF-8" src="/eventplanner/zkau/web/ac292a86/js/zk.wpd" type="text/javascript"> <script charset="UTF-8" src="/eventplanner/zkau/web/ac292a86/js/zul.lang.wpd" type="text/javascript"> <script type="text/javascript"> <script type="text/javascript" charset="UTF-8" src="/eventplanner/zkau/web/_zv2011102015/js/zul.wnd.wpd"> <script type="text/javascript" charset="UTF-8" src="eventplanner/zkau/web/_zv2011102015/js/zul.box.wpd"> <script type="text/javascript" charset="UTF-8" src="/eventplanner/zkau/web/_zv2011102015/js/zul.inp.wpd"> <script type="text/javascript" charset="UTF-8" src="/eventplanner/zkau/web/_zv2011102015/js/zul.sel.wpd"> <script type="text/javascript" charset="UTF-8" src="eventplanner/zkau/web/_zv2011102015/js/zk.fmt.wpd"> <script type="text/javascript" charset="UTF-8" src="eventplanner/zkau/web/_zv2011102015/js/zul.mesh.wpd"> </head>
When i use the same zhtml as template and add the zk components by
<h:div id=" box_navTop " self="@{insert(topnav)}"></h:div>all meta-tags and links of the ZHTML-template are rendered not in head but in the first div of the body:
... <body class="gecko gecko8"> <div id="aJzP5" style="width:100%;height:100%;"> <title>Event Planner</title> <link rel="shortcut icon" href="resources/images/images_admin/favicon.ico"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7"> <meta name="META_SEARCH" content="1"> <meta name="robots" content="noodp"> <link rel="stylesheet" type="text/css" href="resources/css/basic.css"> <a shape="rect" name="top"></a>
The css is recogniced but renders different in firefox and shows for a short time the plain HTML without CSS.
How is it possible to leave the original template head in the head of the rendered page? Is this a bug or is there some kind of workaround?
template code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.zkoss.org/2005/zk/native"
xmlns:h="http://www.w3.org/1999/xhtml"
xmlns:zk="http://www.zkoss.org/2005/zul">
<head>
<title>Event Planner</title>
<link href="resources/images/images_admin/favicon.ico" rel="shortcut icon"/>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
<meta content="IE=7" http-equiv="X-UA-Compatible"/>
<meta content="1" name="META_SEARCH"/>
<meta content="noodp" name="robots"/>
<link href="resources/css/basic.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<!-- START Header -->
<a name="top"></a>
<div id="frame_header">
<div class="logo">
</div>
<div class="box_meta">
<div class="clr"></div>
</div>
<div class="clr"></div>
</div>
<!-- START TopNav -->
<h:div id=" box_navTop " self="@{insert(topnav)}"></h:div>
...
ZUL-code
<?init class="org.zkoss.zk.ui.util.Composition" arg0="resources/layout/template.zhtml"?>
<zk:zk xmlns="http://www.zkoss.org/2005/zk/native"
xmlns:h="http://www.w3.org/1999/xhtml"
xmlns:zk="http://www.zkoss.org/2005/zul">
<!-- TOP NAV -->
<h:ul class="navTop" self="@{define(topnav)}">
<li class="top">
<a class="top_link active" href="overview.zhtml">
<span>Overview</span>
</a>
</li>
<li class="top">
<a href="eventlist.zhtml" class="top_link">
<span>Eventlist</span>
</a>
</li>
<li class="top">
<a href="detailview.zhtml" class="top_link">
<span>Detailview</span>
</a>
</li>
</h:ul>
<zk:div self="@{define(content)}">
<zk:window
apply="
de.empego.eventplanner.web.eventlist.EventListFilterComposer ">
<fieldset style="padding:15px 30px">
<zk:label>Title</zk:label>
<zk:combobox id="eventTitle" autodrop="true"
buttonVisible="true" ></zk:combobox>
<zk:label>Event type</zk:label>
<zk:listbox id="eventType" rows="1" mold="select">
<zk:listitem label="All" value="" ></zk:listitem>
<zk:listitem label="New product"
value="NEW_PRODUCT" ></zk:listitem>
<zk:listitem label="Product modification"
value="PRODUCT_MODIFICATION" ></zk:listitem>
<zk:listitem label="Product optimization"
value="PRODUCT_OPTIMIZATION" ></zk:listitem>
<zk:listitem label="Service Tool"
value="SERVICE_TOOL" ></zk:listitem>
</zk:listbox>
<zk:label>Period</zk:label>
<zk:combobox id="eventPeriod" autodrop="true"
buttonVisible="true" ></zk:combobox>
<zk:button id="applyButton">Apply</zk:button>
</fieldset>
</zk:window>
</zk:div>
</zk:zk>
Asked: 2012-01-14 09:10:12 +0800
Seen: 588 times
Last updated: Jan 17 '12
