JSF 在 f:ajax 之后执行 javascript

Question

在我的 JSF 2 web 应用程序中，我使用以下代码根据 selectedStatus 显示和切换rich:dataTable 的内容：

<h:selectOneRadio id="statusSelection" value="#{backingBean.selectedStatus}" style="width:auto; float:left;">
  <f:selectItem itemValue="AVAILABLE" itemLabel="Available" />
  <f:selectItem itemValue="INACTIVE" itemLabel="Inactive" />
  <f:ajax render="itemsDataTable" execute="#{backingBean.sortByTitel('ascending')}" />
  <f:ajax render="itemsDataTable" event="click" />
</h:selectOneRadio>

dataTable 包含 a4j:commandLink s，在更改表内容后无意中需要在某些 IE 版本中双击 - 我发现，执行以下 Javascript 代码（在 IE 的调试控制台上，在表内容更改后）解决了这个问题：

document.getElementById(<dataTableClientId>).focus()

我的问题是：如何在表格内容改变后实现javascript代码的自动执行？

Answer 1

为了在<f:ajax>成功完成后执行 JS 代码，下面的内联解决方案会做：

<f:ajax
    render="itemsDataTable" 
    onevent="function(data) { if (data.status === 'success') { 
        // Put your JS code here.
        document.getElementById('dataTableClientId').focus();
    }}" />

或者下面的外部函数解决方案（注意：不要把括号放在onevent ，只有函数名）：

<f:ajax
    render="itemsDataTable" 
    onevent="scriptFunctionName" />

function scriptFunctionName(data) {
    if (data.status === 'success') { 
        // Put your JS code here.
        document.getElementById('dataTableClientId').focus();
    }
}

还可以看看这个答案： JSF 和 Jquery AJAX - 如何让它们一起工作？

另外，请仔细检查f:ajax event="click"的需求，因为<h:selectOneRadio>的默认事件是change ，我认为您最好使用它...另请参阅我可以将哪些值传递给事件f:ajax 标签的属性？