代码显示我有几个嵌套表。当用户单击复选框时，会将ajax调用发送到服务器，然后再发送回客户端。如果服务器中的进程正常工作，则在获得回调时，使用jquery从html代码中删除单击的操作行。然后，当用户尝试删除相同操作表中的另一行时，发送到服务器的值 NOT 正确。 调用会发送下一行值：＃{trade.murexId}，＃{operation.id}和＃{operation.operation}，但不正确的值。 Javascript和jquery回调函数正常工作。我正在使用Mojarra的最新版本。为什么会这样？我该如何解决？
HTML：
<table id="trades">
<th class="image_cell"></th>
<th>Murex Id</th>
<th>Type</th>
<th>Portfolio</th>
<th>Log</th>
<ui:repeat var="trade" value="#{controller.errorTrades}">
<h:form>
<tr class="trade error">
<td class="image_cell error"><h:graphicImage styleClass="expandable" url="resources/images/plus.png"></h:graphicImage></td>
<td id="murex_id" class="error">#{trade.murexId}</td>
<td id="type" class="error">#{trade.type}</td>
<td class="error">#{trade.portfolio}</td>
<td class="error">
<h:commandButton image="resources/images/log_big.jpg" action="#{controller.onLogTrade(trade.murexId)}">
<f:ajax render="log_big" />
</h:commandButton>
<h:panelGroup id="log_big">
<h:outputScript rendered="#{not empty controller.result}">
onLogProcess("#{controller.result}");
</h:outputScript>
</h:panelGroup>
</td>
</tr>
<tr class="operations">
<td id="#{trade.murexId}" class="operation_row" colspan="5">
<table id="operations">
<tr class="header">
<th class="empty_cell"></th>
<th class="operation_cell">Operation</th>
<th>Murex Status</th>
<th>GBO Status</th>
<th>GBO Id</th>
<th>OPICS Id</th>
<th>Time Transaction</th>
<th>Comment</th>
<th id="delete">Delete</th>
<th>Log</th>
</tr>
<ui:repeat var="operation" value="#{trade.operationsSortDescList}" varStatus="status">
<tr class="operation">
<th class="empty_cell"></th>
<td id="operation" class="operation_cell color">#{operation.operation}</td>
<td class="color">#{operation.statusMurex}</td>
<td id="status_gbo" class="color">#{operation.statusGbo}</td>
<td id="gbo_id" class="color">#{operation.gboId}</td>
<td id="opics_id" class="color">#{operation.opicsId}</td>
<td class="color">#{operation.datetimeToString}</td>
<td class="color">#{operation.coment}</td>
<td class="color checkbox">
<h:selectBooleanCheckbox>
<f:ajax execute="@form" event="click" listener="#{controller.onDelete}" onevent="onDeleteProcess" />
<f:attribute name="murexId" value="#{trade.murexId}" />
<f:attribute name="operationId" value="#{operation.id}" />
<f:attribute name="operation" value="#{operation.operation}" />
</h:selectBooleanCheckbox>
</td>
<td class="color log">
<h:commandButton image="resources/images/log_small.jpg" action="#{controller.onLogOperation(operation)}">
<f:ajax execute="@form" render="small_log" />
</h:commandButton>
<h:panelGroup id="small_log">
<h:outputScript rendered="#{not empty controller.result}">
onLogProcess("#{controller.result}");
</h:outputScript>
</h:panelGroup>
</td>
</tr>
</ui:repeat>
</table>
</td>
</tr>
</h:form>
</ui:repeat>
</table>
提前致谢！
重新编辑：
我将h：selectBooleanCheckbox改为h：commandButton。
查看：
<table id="operations">
<tr class="header">
<th class="empty_cell"></th>
<th class="operation_cell">Operation</th>
<th>Murex Status</th>
<th>GBO Status</th>
<th>GBO Id</th>
<th>OPICS Id</th>
<th>Time Transaction</th>
<th>Comment</th>
<th id="delete">Delete</th>
<th>Log</th>
</tr>
<ui:repeat var="operation" value="#{trade.operationsSortDescList}" varStatus="status">
<tr class="operation">
<th class="empty_cell"></th>
<td id="operation" class="operation_cell color">#{operation.operation}</td>
<td class="color">#{operation.statusMurex}</td>
<td id="status_gbo" class="color">#{operation.statusGbo}</td>
<td id="gbo_id" class="color">#{operation.gboId}</td>
<td id="opics_id" class="color">#{operation.opicsId}</td>
<td class="color">#{operation.datetimeToString}</td>
<td class="color">#{operation.coment}</td>
<td class="color checkbox">
<h:commandButton image="resources/images/log_small.jpg" action="#{controller.onDelete(operation)}">
<f:ajax execute="@form" render="small_log" onevent="onDeleteProcess" />
</h:commandButton>
</td>
<td class="color log">
<h:commandButton image="resources/images/log_small.jpg" action="#{controller.onLogOperation(operation)}">
<f:ajax execute="@form" render="small_log" />
</h:commandButton>
<h:panelGroup id="small_log">
<h:outputScript rendered="#{not empty controller.result}">
onLogProcess("#{controller.result}");
</h:outputScript>
</h:panelGroup>
</td>
</tr>
</ui:repeat>
</table>
控制器：
public void onDelete(Operation operation)
{
Trade trade = operation.getTrade();
Boolean result = false;
try {
if (trade.getOperations().size() == 1) {
result = Modelo.deleteTrade(trade);
if (result)
this.trades.remove(trade);
} else {
result = Modelo.deleteOperation(operation);
if (result)
trade.getOperations().remove(operation);
}
} catch(Exception ex) {
ConfigUtil.LOGGER.error(ex);
}
}
当我删除操作时，就是问题所在。不，因为jquery。我很确定，因为我测试了它。当我删除操作并单击下一个操作时，它会向服务器发送错误的操作。知道为什么会这样吗？
谢谢！
答案 0 :(得分：2)
首先，我建议使用datatable而不是原始的html表。 Datatable会以任何方式生成类似的html，但好处是你可以访问服务器组件树。
你真的不需要使用jQuery，但我会留下这个，因为你必须使用它，但在这种情况下使用改变
<table id="trades">
到
<table id="trades" jsfc="h:dataTable binding="#{controller.dataTable}">
假设h是JSF html标记lib的命名空间参考。
在托管bean中声明private javax.faces.component.html.HtmlDataTable dataTable ;，其接缝为controller。
现在在listener="#{controller.onDelete}"的代码中，您必须在返回之前从服务器端删除它。
虽然这会实现它确实看起来很糟糕，你最好不要使用jQuery而只是重新渲染数据表而不是比其他选项更昂贵..
您可能会发现this link有帮助。
答案 1 :(得分：0)
这可能是因为您正在更改视图中的元素而服务器端不知道它。
尽量不要直接使用JQuery来更改DOM，而是使用JSF2 Ajax功能，使用render和rerender属性。