Ajax4jsf
onbegin和
oncomplete属性只是
oneventJSF2标准
<f:ajax>标记的现有属性的额外抽象。您只需要引入一些额外的Javascript代码即可实现相同的功能。
这是一个启动示例：
<h:form> <h:panelGrid columns="3"> <h:outputLabel for="input1" value="Input 1" /> <h:inputText id="input1" value="#{bean.input1}" required="true"> <f:ajax event="blur" render="input1_message" onevent="showProgress" /> </h:inputText> <h:message id="input1_message" for="input1" /> <h:outputLabel for="input2" value="Input 2" /> <h:inputText id="input2" value="#{bean.input2}" required="true"> <f:ajax event="blur" render="input2_message" onevent="showProgress" /> </h:inputText> <h:message id="input2_message" for="input2" /> <h:panelGroup /> <h:commandButton value="Submit" action="#{bean.submit}"> <f:ajax execute="@form" render="@form" /> </h:commandButton> <h:messages globalonly="true" layout="table" /> </h:panelGrid></h:form>这是该
showProgress功能的基本启动示例。该
data参数是一个JS对象，其属性已在JSF规范的表14-4和14-3中进行了描述。
function showProgress(data) { var inputElement = data.source; // The HTML DOM input element. var ajaxStatus = data.status; // Can be "begin", "success" and "complete" var messageForInputElement = document.getElementById(inputElement.id + "_message"); switch (ajaxStatus) { case "begin": // This is called right before ajax request is been sent. messageForInputElement.innerHTML = "validating..."; break; case "complete": // This is called right after ajax response is received. messageForInputElement.innerHTML = ""; break; case "success": // This is called when ajax response is successfully processed. if (messageForInputElement.innerHTML.length == 0) { // So, no message has been set. messageForInputElement.innerHTML = "valid!"; } break; }}您可以用
innerHTML图像代替此启动示例的示例，或者在使用CSS背景图像的message元素上添加/删除CSS样式类，等等。这对于保持跨浏览器的兼容性并不是很简单。我建议在其中扔一些jQuery。
基本上，Ajax4jsf的
onbegin和
oncomplete属性消除了您必须编写带有的整个JS函数
switch以实现所需功能的需要。你可以只直接涉及一些Javascript函数里面做一样的线
内 的
case的语句
switch。这只是一个额外的抽象。您可能要考虑使用它，以使样板代码的数量最小化。
