【问题标题】:MouseOver in JSF datatableJSF 数据表中的 MouseOver
【发布时间】:2012-07-19 14:27:42
【问题描述】:

我需要一些帮助来为 JSF 中的数据表列添加鼠标悬停事件。您能否让我知道如何在鼠标悬停在 jsf 列上包含弹出列表。下面是与我的 JSF 专栏对应的代码。

<p:column style="text-align: left;"  styleClass="foo" rendered="#{demandBean.screeRenderVo.adjustedRenderer}"  >
<f:facet name="header">
<h:outputText id="AdjustedID"  value="#{demandBean.dmdScreenLabelVO.adjustedValue}"/>
</f:facet>
<h:inputText id="AdjustedValueID" value="#{car.adjustedValue}" style="height: 20px;width:    50px;"></h:inputText>
</p:column>

不确定如何为上述列添加鼠标悬停事件。请帮忙。

【问题讨论】:

    标签: jsf-2 primefaces


    【解决方案1】:

    你可以这样做:

    <script>
    jQuery(document).ready(function(){
        jQuery('td').mouseover(function(){
            var th = jQuery(this).closest('table').find('th').eq( this.cellIndex );
            if (th.attr('id') == "datatable:column3"){
                dlg1.show();
            }
            else{
                dlg1.hide();
            }
        });
    
    });
    
    </script>
    <h:form prependId="false">
        <p:dataTable id="datatable" var="car" value="#{tableBean.carsSmall}">
            <p:column id="column3" style="text-align: left;"  styleClass="foo" rendered="#{demandBean.screeRenderVo.adjustedRenderer}"  >
               <f:facet name="header">
                  <h:outputText id="AdjustedID"  value="#{demandBean.dmdScreenLabelVO.adjustedValue}"/>
                </f:facet>
                  <h:inputText id="AdjustedValueID" value="#{car.adjustedValue}" style="height: 20px;width:    50px;"></h:inputText>
            </p:column>
        </p:dataTable>
        <p:dialog id="basicDialog" header="Basic Dialog" widgetVar="dlg1">
        <h:outputText value="Resistance to PrimeFaces is futile!" />
        </p:dialog>
    </h:form>
    

    【讨论】:

    • 感谢您的回复。我想知道是否有一种方法可以在不使用 Primefaces 和 Jquery 的情况下在纯 jsf 中实现工具提示功能。谢谢
    • 在纯 JSF 中没有作为对话框的组件,如果您想编写一个纯 JavaScript 解决方案而不是 jQuery,您可以创建一个自定义组件。
    猜你喜欢
    • 1970-01-01
    • 2011-11-06
    • 2011-05-29
    • 2023-03-28
    • 2013-02-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-07-11
    相关资源
    最近更新 更多