如何在不使用複選框或單選按鈕的情況下獲得jsf數據錶行索引

Question

我已經使用JSF hx：datatableEx datatable組件來顯示文檔列表。從數據庫中獲取的表的值。

現在，我想在任何行，我必須顯示上下文菜單針對特定行添加事件，這樣當用戶執行「正確用鼠標單擊」。

我的問題是如何獲得點擊行的索引？。

請幫我找到解決辦法。謝謝。

代碼寫入到文件顯示列表，我只列出了幾列：

<hx:dataTableEx headerClass="headerClass" footerClass="footerClass" columnClasses="columnClass1, columnClass2" rowClasses="rowClass1,rowClass2" scrollSize="175px" styleClass="dataTableEx" value="#{pc_DocumentSearch.allDocumentsList}" var="varallDocumentsList" binding="#{pc_DocumentSearch.allDocList}" rows="25"> 
<hx:columnEx id="column1" align="left" width="10%"> 
    <h:outputText id="text6" styleClass="outputText" value={pc_DocumentSearch.allDocList.rowIndex+1}"></h:outputText> 
    <f:facet name="header"> 
     <h:outputText id="text2" styleClass="outputText" value="#{prop.SL_No}" </h:outputText> 
    </f:facet> 
</hx:columnEx> 

<hx:columnEx id="column2" width="38%" align="left"> 
    <f:facet name="header"> 
    <h:outputText id="text5" styleClass="outputText" value="#{prop.Document_Name}"> </h:outputText> 
    </f:facet> 
<hx:outputLinkEx id="link1" styleClass="a" onmouseover="popup('ViewAttribute documentId=#{varallDocumentsList.DOCUMENT_ID}','#{sessionScope.attrCtrlOption}');" onmouseout="popupClose()" onmousedown="view_document(' {varallDocumentsList.DOCUMENT_ID}');"> 
<h:outputText id="text9" styleClass="outputText" value="# {varallDocumentsList.DOCUMENT_NAME}"></h:outputText> 
</hx:outputLinkEx> 
</hx:columnEx> 

<hx:columnEx id="column3" width="12%" align="left"> 
<h:outputText id="text49" styleClass="outputText" value=" {varallDocumentsList.VERSION_NO}"></h:outputText> 
<f:facet name="header"> 
    <h:outputText id="text48" styleClass="outputText" value="#{prop.Version_No}"> </h:outputText> 
</f:facet> 
</hx:columnEx> 

<hx:columnEx id="column4" align="left" width="20%"> 
<h:outputText id="text8" styleClass="outputText" value="#{varallDocumentsList.CREATION_DATE}"> 
<hx:convertDateTime /> 
</h:outputText> 
<f:facet name="header"> 
    <h:outputText id="text4" styleClass="outputText" value="#{prop.Date}"></h:outputText> 
</f:facet> 
</hx:columnEx> 

<hx:columnEx id="column5" width="10%"> 
<hx:outputLinkEx id="viewCommentLink" styleClass="a" onmousedown="view_doccomment('#{varallDocumentsList.DOCUMENT_ID}','#{varallDocumentsList.FOLDER_ID}');"> 
<h:outputText id="viewComment" styleClass="outputText" value="#{prop.View}"> </h:outputText> 
</hx:outputLinkEx> 
<f:facet name="header"> 
<h:outputText id="text43" styleClass="outputText" value="#{prop.Comments}"> </h:outputText> 
</f:facet> 

Answer 1

發佈解決方案我用來解決這個問題：

首先創建所需的選項上下文菜單如下：

<div id="cntnr"> 
<ul id="items"> 
    <li><a onclick="load()">Indexes</a></li> 
    <li onclick="load()"><a>Delete</a></li> 
    <li onclick="load()"><a>Forward</a></li> 
    <li onclick="load()"><a>Share</a></li> 
    <li onclick="load()"><a>Comments</a></li> 
</ul> 
</div> 

要獲得點擊的行ID寫入以下代碼： 有關此主題的，你應該是指它的更多信息Link：

$(document).ready(function() { 
    var trs = document.getElementById('tableId').getElementsByTagName('tbody')[0].getElementsByTagName('tr'); 
    for (var i = 0; i < trs.length; i++) { 
     trs[i].oncontextmenu = new Function("highlightAndSelectRow(this)"); 
    } 
}); 
var docId=0; 
var trAttri=0; 
var Id=0; 
function highlightAndSelectRow(tr) { 
    var trs = document.getElementById('tableId').getElementsByTagName('tbody')[0].getElementsByTagName('tr'); 
    for (var i = 0; i < trs.length; i++) { 
     if (trs[i] == tr) { 
      Id=tr.getAttribute('class'); 
      } else { 
      trs[i].style.bgColor = '#ffffff'; 
      } 
    } 
} 

要清理的上下文菜單：

function startFocusOut() { 
    $jq(document).on("click", function() { 
     $jq("#cntnr").hide(5); 
     $jq(document).off("click");   
    }); 
} 

綁定上下文菜單：

$jq(document).ready(function() { 
    $jq("#tableIdDiv").bind("contextmenu", function (e) { 
     if(Id) { 
      e.preventDefault(); 
      $jq("#cntnr").css("left", e.pageX); 
      $jq("#cntnr").css("top", e.pageY); 
      $jq("#cntnr").fadeIn(5, startFocusOut()); 
      Id=null; 
     } 
    }); 
});