Мы используем JSF 2.0 в нашем проекте. Помимо Mojara, мы используем Primefaces 3.3 для некоторых компонентов. у нас есть Требование в нашем проекте, что мы ДОЛЖНЫ выполнять проверки Javascript (как часть проверки на стороне клиента), а затем должна произойти только отправка формы. Проверка, выполненная JSF, в любом случае произойдет (на стороне сервера). Но проверки Javascript также должны быть там.
По этой причине я задал это вопрос, но не получил комментариев.
Поэтому я реализую проверки JavaScript, и это подводит меня к реальной проблеме, с которой я сталкиваюсь. У меня есть функции JS для выполнения основных проверок, таких как «Обязательные» поля, проверка длины и т. д., и их вызов в подходящее время (например, onblur). Но если пользователь просто оставляет все поля пустыми или вообще не заходит в некоторые поля (тем самым не вызывая события, такие как onblur) и нажимает кнопку отправки, эти поля пропускаются для проверки JS. Итак, как мне условно отправить форму после того, как все проверки JS выполнены? Обратите внимание, что мы должны использовать f:ajax для отправки формы.
Я попробовал функцию onsubmit формы. Он работает на FF, но не на IE9. Я попробовал функцию onclick командной кнопки. Он вызывает js, но также отправляет форму.
Немного кода, если это поможет
Функции JavaScript, которые я использую
var validationErrorFound = false;
function validateRequired(element,form){
if(null == element.value || "" == element.value){
var existingClass = element.getAttribute("class");
var newClass = existingClass + " inputError";
element.setAttribute("class", newClass);
var label = document.getElementById(element.getAttribute("id") + "Lbl");
var labelArray = new Array();
var temp = label.innerText;
labelArray = temp.split(":");
element.setAttribute("title", labelArray[0] + " is Required");
validationErrorFound = true;
}else{
element.className = element.className.replace( /(?:^|\s)inputError(?!\S)/ , '' );
element.setAttribute("title", null);
element.removeAttribute("title");
validationErrorFound = false;
}
}
function validateAllRequired(form){
var all = document.getElementsByTagName("input");
var max=all.length;
for (var i=0; i < max; i++) {
if(null != all[i].onblur ){
validateRequired(all[i],form);
}
}
return validationErrorFound;
}
JSF-страница
<h:form id="addUserDetailsForm">
<h:messages/>
<h:panelGrid columns="2">
<p:outputLabel id="userNameLbl" for="userName" value="Username:" />
<p:inputText id="userName" required="true" onblur="validateRequired(this,this.form);"
value="#{userList.addUser.userName}">
<f:param name="req" value="true"/>
</p:inputText>
<p:outputPanel value="" />
<p:outputLabel id="firstNameLbl" for="firstName" value="First Name:" />
<p:inputText id="firstName" required="true" onblur="validateRequired(this,this.form);"
value="#{userList.addUser.firstName}"/>
<p:outputLabel id="lastNameLbl" for="lastName" value="Last Name:" />
<p:inputText id="lastName" required="true" onblur="validateRequired(this,this.form);"
value="#{userList.addUser.lastName}"/>
<h:commandButton styleClass="button" value="Add" onclick="validateAllRequired(this.form);"
action="#{userList.dummyAdd}" >
<f:ajax execute="@form" render=":mainArea :propertiesArea" update=":mainArea :propertiesArea"/>
</h:commandButton>
</h:panelGrid>
Есть ли способ это сделать?
Спасибо