Question

我正在使用以下代码并尝试使每一行都可以点击并设置一些顶级事件。

<table width="100%" class="TableSpace">

<ui:repeat var="damageinfo"
                            value="#{DamageDetails2.damageInfoAll}" varStatus="status">
    <h:commandLink>
        <tr class="row1 lineBorder" onclick="alert('Hello')">
            <td height="40">
                <h:outputText
                        value="#{damageinfo.damageID}" styleClass="LabelClass">
                </h:outputText>
            </td>
            <td height="40">
                <h:outputText
                        value="#{damageinfo.damageName}" styleClass="valueClass">
                </h:outputText>
            </td>
        </tr>
        <f:setPropertyActionListener target="#{carDetails.rootImage}"
                                    value="#{carDetails.carUrl2}" />
        <f:setPropertyActionListener target="#{carDetails.view}"
                                    value="#{carDetails.viewDetails['carUrl2']}" />
        <f:ajax event="action" render="ViewId" />
    </h:commandLink>
</ui:repeat>

</table>

但它不起作用。这是怎么造成的，我该如何解决？

Answer 1

这会生成invalid HTML。 <a>周围有一个<tr>元素是违法的。浏览器行为未指定。根据所使用的webbrowser make / version的宽容度，它可能有效，或者可能无效，或者它可能无法按照您的意图运行。由于JSF最终只是生成HTML，因此它无法使其按照您的意图运行。

要么在onclick元素中放置一个JS <tr>处理程序，要么将<h:commandLink>放在<td>内，或者使用像PrimeFaces这样允许行选择的第三方组件库，另见this showcase example。

另见：

HTML beginner tutorial

如何添加从<ui：repeat> </ui：repeat>生成的命令链接

1 个答案:

另见：