JQuery在jsf中进行ajax更新后无法正常工作

Question

我有个问题.我在我的jsf和primefaces应用程序中使用jquery来简化一些操作.Jquery工作正常onload页面,但当我更新一些组件jquery不工作.例如:

<h:form>

<p:selectOneMenu value="#{contractBean.workType}" >
<f:selectItem itemLabel="" itemValue="" />
<f:selectItem itemLabel="product" itemValue="1"   />
<f:selectItem itemLabel="service" itemValue="2"   />
<f:selectItem itemLabel="product and service" itemValue="3" />
<p:ajax update="outPan" event="change" /> 
</p:selectOneMenu>

<p:outputPanel id="outPan">
<p:inpuText value="#{contractBean.workType}" id="wType"/>
<p:commandButton value="Submit" id="sButton"/>
</p:outputPanel>

</h:form>



<script type="text/javascript">
$(document).ready(function(){

$('#sButton').prop('disabled',true);
$('#wType').css({'border':'red'})

})
</script>

请帮助您解决方案.谢谢.

Answer 1

将您的js代码放到一个function并把它在oncomplete你的p:ajax

像这样

<p:ajax update="outPan" event="change" oncomplete="myFunc()" /> 

js代码:

<script type="text/javascript">
$(document).ready(function(){
    myFunc();
});
function myFunc() {
    $('#sButton').prop('disabled',true);
    $('#wType').css({'border':'red'})
}
</script>

说明:

在primefaces ajax之后没有就绪事件(毕竟它是ajax而不是整页重新加载)

如果你想在之后挂钩一些js代码p:ajax,你可以使用它的onsuccess属性