私は非常に失望しています。ページのテンプレート レイアウトを変更した後に発生したバグの理由をまだ探しています。Tomcat 7.0.32 および JSF 2.1.13 ライブラリで Primefaces 3.4.2 を使用しています。
このバグは何ですか?:
Opera、FF、および Chrome の場合:
すべての要素が完全に読み込まれ、表示されます。
ただし、メニュー項目 (非 ajax で定義) を選択または呼び出すと、期待どおりにページがリロードされます。しかし、何も起こりません。ボタンをもう一度呼び出すと、ボタンが呼び出されます。また、コンテンツ セクションが変更されます。
データテーブルなどを選択して行を作成すると、ページは非常にスムーズに動作します。また、コンテンツ セクションを変更する必要はありません。
IE6+、特に IE9:
ページが読み込まれ、ほとんどの場合、すべての要素が IE9 に表示されます。ただし、呼び出すことができるホバーや ajax イベントはありません。ページが凍結されているようです。
ページをリロードすると、期待どおりに動作します。高速かつスムーズ。
デバッグのために私がしたこと
私はその理由を見つけ始めました。各ブラウザのコンソールを見てみました。IE 以外のブラウザーでは、何らかの理由でヒントが表示されません。ほとんどの場合、この方向にエラーはありません。
新しいセッションを開始し、初めてページをロードすると、IE は次のエラーを表示します。
リロード後、エラーは消えます。
tomcat も例外ではありません。
レイアウトに対して行ったこと:
JQuery ThemeRoller でカスタム テーマを作成し、リンクとして実装しました。注: デフォルトのテーマを使用している場合、バグはまだ存在します
<p:menu>左側のa を削除してヘッダーに移動することにしました。注: すべてをデフォルトに変更しましたが、バグはまだ残っています。
すべての要素を削除し<p:panelgrid>、単純な s に切り替えました<table>注: しかし、これがバグの原因ではないと思います。
IE ブラウザーの z-index に関する既知の問題を追加して修正する必要があります。のスクリプト セクションでそれを見ることができますlayout.xhtml- それなしでは、メニューバーはコンテンツ セクションの要素の背景にあります。注: 削除しましたが、何も起こりません。バグはまだ残っています。
そして、すべてのキャッシュを削除しました。しかし、何もありません。誰かが私を助けてくれるか、私がした間違いを見つけてくれることを願っています。
[ソースファイル]
私のテンプレート レイアウト ファイル =layout.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<f:view contentType="text/html">
<h:head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<meta http-equiv="refresh" content="#{session.maxInactiveInterval};url=#{request.contextPath}" />
<f:event listener="#{loginController.verifyUseLogin()}" type="preRenderView" />
<link type="text/css" rel="stylesheet" href="#{request.contextPath}/faces/resources/primefaces-fes/theme.css"/>
<link type="text/css" rel="stylesheet" href="#{request.contextPath}/faces/resources/css/app.css"/>
<title>Willkommen im FLOW / Fast Lean Overhead Workflow - Dies ist ein PROTOTYP</title>
<script type="text/javascript">
PrimeFaces.locales['de'] = {
closeText: 'Schließen',
prevText: 'Zurück',
nextText: 'Weiter',
monthNames: ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'],
monthNamesShort: ['Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez'],
dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'],
dayNamesShort: ['Son', 'Mon', 'Die', 'Mit', 'Don', 'Fre', 'Sam'],
dayNamesMin: ['S', 'M', 'D', 'M ', 'D', 'F ', 'S'],
weekHeader: 'Woche',
firstDay: 1,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: '',
timeOnlyTitle: 'Nur Zeit',
timeText: 'Zeit',
hourText: 'Stunde',
minuteText: 'Minute',
secondText: 'Sekunde',
currentText: 'Aktuelles Datum',
ampm: false,
month: 'Monat',
week: 'Woche',
day: 'Tag',
allDayText: 'Ganzer Tag'
};
//needed to get the Submenu in menubar to the front (z-index bug)
$(function() {
var zIndexNumber = 1000;
// Put your target element(s) in the selector below!
$("div").each(function() {
$(this).css('zIndex', zIndexNumber);
zIndexNumber -= 10;
});
});
</script>
</h:head>
<h:body>
<div id="outerWrapper">
<table id="contentWrapper">
<tr>
<td id ="header">
<ui:insert name="header"/>
</td>
</tr>
<tr>
<td id="content">
<ui:insert name="content"/>
</td>
</tr>
</table>
</div>
</h:body>
</f:view>
</html>
のapp.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<ui:composition template="./layout/layout.xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets">
<ui:define name="header">
<ui:include src="./misc/menuheader.xhtml"/>
</ui:define>
<ui:define name="content">
<ui:include src="#{appController.content}.xhtml" />
</ui:define>
</ui:composition>
@ManagedBean - @SessionScopedBeanからのナビゲーション メソッド:
public void doNav(){
FacesContext context = FacesContext.getCurrentInstance();
String selectedPageViewId =
context.getExternalContext().getRequestParameterMap().get("pageViewID");
if (selectedPageViewId.equalsIgnoreCase("page1"))
{
content = "/app/includes/hldyplanning";
message = "Urlaub eintragen";
ELContext elContext = FacesContext.getCurrentInstance().getELContext();
hplC = (HldyPlanningController) FacesContext.getCurrentInstance().getApplication()
.getELResolver().getValue(elContext, null, "hldyPlanningController");
hplC.init();
}
else if (selectedPageViewId.equalsIgnoreCase("page2"))
{
message = "persönliche Übersicht";
content = "/app/includes/persview";
} [...]
else { context.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Seite nicht gefunden.", "Wie sind Sie hier hingekommen?")); }
}
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:form id="frm_plan">
<p:messages id="messages" autoUpdate="false" closable="true"/>
[...]
</h:form>
</html>
ヘッダー:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:form id="frm_menu">
<table class="steamlessBody" style="width:100%;">
<tr>
<td class="header_boxes" style="width: 200px;">
#{appController.message}
</td>
<td class="header_boxes" style="width: 650px;">
<p:menubar autoDisplay="true" style="font-size: 14px; border: none; background: none;">
<p:submenu id="sub1" icon="ui-icon-calendar" label="Urlaubsplanung">
<p:menuitem id="btn_page1" ajax="false" icon="ui-icon-plusthick" value="Urlaub eintragen" action="#{appController.doNav()}">
<f:param id="pageHLDYPLANNING" name="pageViewID" value="page1"/>
</p:menuitem>
[...]
</p:submenu>
[...]
<p:menuitem id="btn_logout" ajax="false" icon="ui-icon-circle-close" value="Ausloggen" action="#{appController.logout()}"/>
</p:menubar>
</td>
<td class="head_text">
Eingeloggt als #{loginController.sessionData.user_name}
</td>
</tr>
</table>
<p:dialog widgetVar="help" id="dlg_help" closable="true" header="Hilfe" modal="true" showEffect="clip" hideEffect="clip">
</p:dialog>
</h:form>
</html>