我正在使用带有primefaces的jsf 2.0。在我的应用程序中我有登录页面,我已经包含此登录所有页面,它显示在primefaces灯箱(内联方法)...它在所有浏览器中工作正常除了歌剧...但在歌剧中,当我点击登录按钮没有得到验证,表格也没有提交...
我的index.xhtml
<h:body style="background:url(images/index_bg.jpg) repeat-x;">
<!--Header-->
<ui:include src="/webheader.xhtml"></ui:include>
<!--End Header-->
<!--Menu-->
<ui:include src="/webmenu.xhtml"></ui:include>
.............
</h:body>
webheader.xhtml
..............
<p:lightBox style="display:inline;" width="1010px"> <h:outputLink
value="Registration.xhtml">Register</h:outputLink> </p:lightBox>|
<p:lightBox style="display:inline;" width="810px" group="false">
<h:outputLink value="#">
<h:outputText value="Login"/>
</h:outputLink>
<f:facet name="inline">
<ui:include src="login.xhtml"></ui:include>
</f:facet>
</p:lightBox>
...........................
我的login.xhtml
<!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"
xmlns:p="http://primefaces.prime.com.tr/ui">
<h:head>
<script type="text/javascript">
function resetval() {
document.getElementById("loginid:log_pass_input").value = null;
document.getElementById("loginid:log_pass_input").focus();
}
</script>
</h:head>
<h:body>
<f:view>
<!-- Login -->
<div class="login">
<h:form id="ajxstaform">
<p:ajaxStatus style="width:16px;height:16px;"
id="ajaxStatusPanel">
<f:facet name="start">
<h:graphicImage value="../images/ajax-
loader.gif" />
</f:facet>
<f:facet name="complete">
<h:outputText value="" />
</f:facet>
</p:ajaxStatus>
</h:form>
<div class="loginInner">
<table width="90%" border="0" cellspacing="0" \
cellpadding="0">
<tr>
<td><h1>Login</h1>
</td>
</tr>
<tr>
<td>
<div class="loginTEXT">
<table width="80%"
border="0" align="center" cellpadding="0"
cellspacing="0"
id="loginPanel">
<tr>
<td>
</td>
<td>
</td>
</tr>
<h:form id="loginid"> <tr>
<td width="34%" align="center"><p>Email Id</p>
</td>
<td width="66%" align="center"><h:inputText
value="#{loginBean.email_id}" id="log_email"
binding="#{login}" required="true"
requiredMessage="Enter the Email ID" immediate="true"
validatorMessage="Invalid Email ID">
<p:ajax event="blur" update="msg1" />
<f:validateRegex
pattern="[\w\.-]*[a-zA-Z0-9_]@[\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]" />
</h:inputText></td>
<td width="100%" align="center"><h:message
for="log_email" id="msg1" styleClass="alert" />
</td>
</tr>
<tr>
<td align="center"><p>Password</p>
</td>
<td align="center"><p:password
value="#{emailBean.password}" id="log_pass"
feedback="false" required="true"
requiredMessage="Enter the Password" immediate="true">
<p:ajax event="blur" update="msg2" />
<f:validator validatorId="loginValidator" />
<f:attribute name="login" value="#{login.value}" />
</p:password></td>
<td align="center"><h:message for="log_pass" id="msg2"
styleClass="alert" /></td>
</tr>
<tr>
<td colspan="2" align="center">
<div>
<p:commandButton value="Login"
action="#{commonControl.loginCtrl}"
update="ajxstaform:ajaxStatusPanel,loginid,msg1,msg2"
oncomplete="resetval()">
</p:commandButton>
</div></td>
</tr>
</h:form>
<tr>
<td colspan="2" align="center"><p:spacer height="20px"
width="27px"></p:spacer> <h:form>
<h:commandLink
action="#{registrationControl.forgotpasswordredirect}">
<b>Forgot Password</b>
</h:commandLink>
</h:form> <!-- <a href="PasswordReset.xhtml" title="Forgot password">Forgot Password</a> -->
</td>
</tr>
</table>
</div></td>
</tr>
</table>
</div>
</div>
</f:view>
<!--End Login -->
</h:body>
</html>
提前致谢。
答案 0 :(得分:1)
你有invalid HTML语法。 <table>
元素不能作为直接子项<form>
,而只能<thead>
,<tbody>
,<tfoot>
和/或<tr>
。在HTML无效的情况下,未指定浏览器行为。虽然大多数浏览器对此类开发人员的错误以及尝试对其进行自动更正都是宽容和疏忽的,但众所周知,Opera浏览器对此非常严格。
相应地重新排列JSF <h:form id="loginid">
组件,以便您的代码最终生成有效的HTML。您可以将<h:form>
放在<table>
或<td>
内,但肯定不在它们之间。您可以通过将整个表格放在一个表单中来实现这一点,并通过使其成为正常的<h:form>
,或者通过以下方式删除嵌套的<h:link>
“忘记密码”链接。通过immediate="true"
或<f:ajax>
添加<p:commandLink>
或ajax操作。