2013-09-03 2 views
0

이 스레드는 내 previous issue에서 다음 두 번째 문제입니다. 클릭 이벤트를 내 쇼 차트 기능에 바인딩 한 후에도 정확한 차트 데이터를 가져 오는 데 사용되는 직원 ID 값을 알아야합니다.jQuery로 표 셀의 값을 가져 오는 방법은 무엇입니까?

showChartByEmpId (i)에 직원 ID를 전달할 수 있습니까?

HTML

<table id="empTable" class="tablesorter"> 
    <thead> 
     <tr> 
      <th> Employee ID </th> 
      <th> Name </th> 
      <th> Department </th> 
      <th> Title </th> 
      <th> Show Chart </th> 
     </tr> 
    </thead> 


    <tbody> 
     <tr> 
      <td> 101 </td> 
      <td> John </td> 
      <td> R&D </td> 
      <td> Engineer </td> 
      <td> <button class="doPieChart"> Pie Chart </button> </td> 
     </tr> 
     <tr> 
      <td> 102 </td> 
      <td> David </td> 
      <td> R&D </td> 
      <td> Engineer </td> 
      <td> <button class="doPieChart"> Pie Chart </button> </td> 
     </tr> 
    </tbody> 
</table> 
<div class="secondary"> </div> 

JS 여기

function drawPieChart(i) { 
    $('.secondary').html('<div id="chart_div" class="div'+i+'">my graph '+(i+1)+' in fancybox</div>'); 
} 

function showChart(i) { 
    drawPieChart(i); 
} 

function showChartByEmpId(i) { 
    showChart(i); 
} 

jQuery(function ($) { 
    //How to get emp Id here? 
    $(".doPieChart").each(function (i) { 
     $(this).on("click", function() { 
      showChartByEmpId(i); 
      $.fancybox("#chart_div"); 
     }); // on click 
    }); // each 
}); 

JSFIDDLE

답변

1

를 사용하여 내 예는이 클릭 함수 내에서 EMP ID를 얻는 것입니다

var empID = $(this).closest('tr').find('td:first').text(); 

당신이 당신의 문제를 해결해야

$('.doPieChart').on("click", function() { 
    var empID = $(this).closest('tr').find('td:first').text(); 
    showChartByEmpId(empID); 
    $.fancybox("#chart_div"); 
}); 
+0

감사합니다. Anton. 이제 작동합니다. –

0

.each()를 필요로하지 않습니다

var EmpId; 
jQuery(function ($) { 
    //How to get emp Id here? 
    $(".doPieChart").each(function() { 
     $(this).on("click", function() { 
      EmpId = $(this).closest('tr').find('td:first').text(); 
      showChartByEmpId(EmpId); 
      $.fancybox("#chart_div"); 
     }); // on click 
    }); // each 
}); 

바이올린 : http://jsfiddle.net/malvaniya_shakti/bqs52/12/

+0

예를 들어 주셔서 감사합니다. Shakti –

+0

jsfiddle 데모 링크를 답장하는 방법은 무엇입니까? –

+0

편집기 상단의 하이퍼 링크 삽입 아이콘을 클릭 할 수 있습니다. 팝업 항목의 과거 링크. –

0

은 또한 당신의 기존이 VAR를 추가 코드

var empID = $.trim($(this).parent().siblings("td").eq(0).text()); 
,210

그래서

jQuery(function ($) { 
    //How to get emp Id here? 
    $(".doPieChart").each(function (i) { 
     $(this).on("click", function() { 
      var empID = $.trim($(this).parent().siblings("td").eq(0).text()); 
      showChartByEmpId(empID); 
      $.fancybox("#chart_div"); 
     }); // on click 
    }); // each 
}); 

JSFIDDLE

참고를 참조하십시오 더 빨리 (틀림없이)이기 때문에 항상 의사 클래스 :first 통해 .eq() 방법을 선호합니다.

관련 문제