JSF로 만든 테이블의 셀을 jQuery로 변경

JSF로 만든 xhtml 페이지 내에서 JavaScript 셀/jQuery를 사용하여 테이블의 셀 내용을 변경해야합니다. 테이블을 포함하는 div 및 고유 번호를 tbody에 할당하는 방법을 알고 있습니다. 또한 고유 한 클래스 이름을 div 자체와 대상 열에 할당 할 수 있습니다. 대상 행은 data-rk 속성으로 식별됩니다.JSF로 만든 테이블의 셀을 jQuery로 변경

<div id="tabForm:centerTabView:personsTable" class="ui-datatable ui-widget personsTable"> 
    <table role="grid"> 
     <tbody id="tabForm:centerTabView:personsTable_data" > 
      <tr data-rk="2" > 
       <td ... /> 
       <td class="lastNameCol" role="gridcell"> 
        <div> To Be Edited </div> 
       </td> 
       <td ... /> 
      </tr> 
      <tr ... /> 
     </tbody> 
    </table> 
</div>

다른 jQuery 선택기를 여러 조합으로 시도했지만 실제로 손실되었습니다. xhtml 페이지에 다른 고유 ID (실수로 같은 행 및 열 ID가있는)가 포함될 수 있으므로 해당 특정 div 또는 해당 특정 테이블 내에서 대상 행과 대상 열을 검색해야합니다.

출처

2012-06-08 perissf

뭔가를이 바이올린을 확인하시기 바랍니다?

$("#tabForm\\:centerTabView\\:personsTable tr[data-rk=2] td.lastNameCol div").text("edited");

또는 personsTable 경우

은 현재보기 나는 바이올린과 솔루션을 준

$("[id$=personsTable] tr[data-rk=2] td.lastNameCol div").text("edited");

출처

2012-06-09 01:23:46 BalusC

이 기술을 잘 알고 있습니다. 나는 로터리 방식으로했다. +1 !! – raddykrish

감사합니다. BalusC. 이 두 줄은 선택자에 대한 거의 완전한 자습서입니다. Btw, 두 번째 줄에있는 이드 뒤에 달러 기호가 나온 이유는 무엇입니까? – perissf

"Attribute-Ends-With"선택자입니다 : http://api.jquery.com/attribute-ends-with-selector/ – BalusC

새 HTML 코드에 대한이 같은

Fiddle without colon

Fiddle with Colon

출처

2012-06-08 21:17:40 raddykrish

충분히 유일하다. 그것을 확인할 수 있습니까? – raddykrish

번호 행은 data-rk 속성으로 식별됩니다. 또한 행 ID와 열 ID만으로는 충분하지 않습니다. 고유 식별자로 식별되기 때문에 외부 ID 또는 적어도 tbody 태그 내부를 검색해야합니다. – perissf

은 귀하의 경우 고유 한 tbody ID입니까? – raddykrish

JSF로 만든 테이블의 셀을 jQuery로 변경

답변

관련 문제