0

このようなフォーム内にjsfデータテーブルがあります。

<h:form id="personId">
     <h:dataTable id="hdatatable" value="#{Person.personList}" 
            border="0" cellpadding="10" cellspacing="5"
            var="per" styleClass="order-table"
            headerClass="order-table-header"
            rowClass="order-table-odd-row,order-table-even-row"
            syle="width: 950px" >


      <h:column id="tcoulm">
        <f:facet name="header">Action</f:facet>
        <h:commandLink id="editLink" value="Edit" action="#{person.editAction(per)}"/>
        <h:commandLink id="cancelLink" value="Undo" action="#{person.undoAction()}"/>
 </h:column>

</h:datatable>
</h:form>

上記の表では、javascriptを使用して編集アクションと元に戻るアクションにアクセスしようとしています。そのため、IDを割り当てましたが、htmlソースにこれらの要素のIDが表示されると、次のようになります。つまり、表の3行目だと思います。ソースで列IDを確認できます。

personId:hdatatable:3:editLink

コマンドリンクにIDのみを指定し、フォームに'prependId = "false"を指定した場合でも、commdndLinkのIDは次のように表示されます。

j_id1267631877_14a2c285:editLink

フォームIDとコマンドリンクIDのみを使用する場合

formId:j_id1267631877_14a2c285:editLink

datatatble列内の要素に正確にアクセスするにはどうすればよいですか?

4

1 に答える 1

1

使用するだけ

var editLink = document.getElementById("personId:hdatatable:3:editLink");

それらに個別にアクセスしたくないが、それらすべてにアクセスしたい場合は、スタイルクラスを与える方がはるかに簡単です。

<h:commandLink ... styleClass="editLink" />

代わりにクラス名で選択できるようにします(jQueryを想定)

var $editLinks = $(".editLink");
于 2012-10-10T18:34:03.243 に答える