<tr> 태그를 Jquery 데이터 테이블

Question

에서 가져옵니다. 데이터 테이블이있는 테이블을 만들려고합니다. 행을 선택한 후 사용자에게 더 자세한 정보가 포함 된 새 페이지로 이동하는 버튼이 있습니다.

https://datatables.net/examples/api/select_single_row.html

나는 고유 식별자로 <tr id="ID"> 설정을 생각하고, 다음 행을 선택하고 버튼을 누르면에 여기에 튜토리얼을 수행 한 후,이 ID를 함께 전달하고보다 자세한 정보를 얻게됩니다. 나는 어려움이 id 필드를 얻는 데 그러나

, 내가 좋아하는 뭔가를 찾고 있어요

$('#detailButton').click(function(){ 
    window.location = 'detail.php?id=' + table.row('.selected').id; 
    }); 

편집 : 명확히 미안, 난 단지, 페이지 하단에 1 개 버튼을하지 원한다고 하나 버튼을 클릭하고 행을 클릭하지 않아도됩니다. 튜토리얼에서 행을 선택하면 클래스를 'selected'로 설정하여 클래스가 선택된 행의 ID를 가져 오려고합니다.

Answer 1

$(this) jQuery 요소 event을 유발 한 요소가 있습니다. 행을 선택할 때 발생하는 이벤트가있는 경우 요소를 가져 와서 ID를 찾을 수 있습니다.

HTML :

<table style="width:300px"> 
    <tr id="row0"> 
     <td>Jill</td> 
     <td>Smith</td> 
     <td>50</td> 
     <td> 
      <button class="rowButton">select</button> 
     </td> 
    </tr> 
    <tr id="row1"> 
     <td>Eve</td> 
     <td>Jackson</td> 
     <td>94</td> 
     <td> 
      <button class="rowButton">select</button> 
     </td> 
    </tr> 
</table> 

JS :

$('.rowButton').on('click', function(){ 
    window.location = 'detail.php?id=' + $(this).closest('tr').attr('id'); // read id from tr element 
}); 

또는

$('table tr').on('click', 'button', function(){ 
    window.location = 'detail.php?id=' + $(this).parents('tr').attr('id'); // read id from tr element 
}); 

Answer 2

각 행마다 버튼이 있다고 가정합니다.이 경우 버튼마다 고유 한 ID가 있어야하며,이 ID는 어떻게 든 행을 참조해야합니다. 또 다른 옵션은 테이블 내에서 버튼 오프셋을 가져 와서 버튼이있는 행을 결정하는 것입니다. button.parentNode는 버튼이있는 행을 줄 수 있습니다. 그러나 나는 당신의 html이 어떻게 생겼는지 확신하지 못한다.