JSF 在 f:ajax 之后执行 javascript
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19495468/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JSF execute javascript after f:ajax
提问by Mr.Radar
In my JSF 2 web application, I use the following code to display and switch the contents of a rich:dataTable according to the selectedStatus:
在我的 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>
The dataTable contains a4j:commandLink s, which unintentionally need to be double clicked in some IE versions after changing table content - I found out, that executing the following Javascript code (on IE's debugging console, after table contents have changed) solves the issue:
dataTable 包含 a4j:commandLink s，在更改表内容后无意中需要在某些 IE 版本中双击 - 我发现，执行以下 Javascript 代码（在 IE 的调试控制台上，在表内容更改后）解决了这个问题：
document.getElementById(<dataTableClientId>).focus()
My question is: How can I achieve automatic execution of the javascript code after the table contents have changed?
我的问题是：如何在表格内容改变后实现javascript代码的自动执行？
回答by Daniel
In order to execute JS code after the <f:ajax>is successfully completed, the following inline solution will do:
为了在<f:ajax>成功完成后执行 JS 代码，以下内联解决方案将执行：
<f:ajax
render="itemsDataTable"
onevent="function(data) { if (data.status === 'success') {
// Put your JS code here.
document.getElementById('dataTableClientId').focus();
}}" />
Or the following external function solution (note: do not put parentheses in onevent, only the function name):
或者下面的外部函数解决方案（注意：不要把括号放在里面onevent，只有函数名）：
<f:ajax
render="itemsDataTable"
onevent="scriptFunctionName" />
function scriptFunctionName(data) {
if (data.status === 'success') {
// Put your JS code here.
document.getElementById('dataTableClientId').focus();
}
}
Also take a look at this answer: JSF and Jquery AJAX - How can I make them work together?
也看看这个答案：JSF and Jquery AJAX - How can I make them work together?
Also, double check the need of the event="click"in your f:ajax, because the default event in <h:selectOneRadio>is changewhich I think you better use... See also What values can I pass to the event attribute of the f:ajax tag?
此外，仔细检查的需要event="click"你f:ajax，因为在默认情况下<h:selectOneRadio>就是change我想你最好使用......又见我可以传递给f的事件属性什么样的价值观：AJAX标签？
