2016-01-13 1 views
1

У меня есть таблица, в которой у меня есть несколько строк, и у каждого есть данные таблицы. теперь я хочу получить атрибут привязки данных таблицы данных по клику текущего tr.Хотите получить значение текущих данных tabe по щелчку строки таблицы

моя структура таблицы следующим образом:

<tr id="row1jqxgrid" role="row" data-key="1"> 
<td class="jqx-cell jqx-cell-darkblue jqx-grid-cell jqx-grid-  cell-darkblue jqx-item jqx-item-darkblue jqx-grid-  cell-nowrap jqx-grid-cell-nowrap-darkblue" style="max-width:350px; width:350px;border-left-width: 0px;" role="gridcell"> 
<span class=""></span> 
<span class="jqx-tree-grid-title jqx-tree-grid-title-darkblue jqx-grid-cell-wrap jqx-grid-cell-wrap-darkblue">Accenture222</span></td> 
    <a class="ClickClass" data-link="http://www.recruiterfeedback.com/trs/index.php/recruiter/feedback_details/174"> 
     <button class="btn btn-primary btn-sm ClickClass"> 
      <i class="fa fa-search"></i> View 
     </button> 
    </a> 
    </td> 
</tr> 

У меня есть попытаться получить его с JQuery заднице следует, но не работал:

$("#jqxgrid").on('rowSelect', function() { 
    var current = $('#jqxgrid').attr('data-link'); 

    alert(current); 

    var args = event.args; 

    var rowData = args.row; 
    // var a_href = $(this).find(rowData); 
    // alert(a_href); 
    var rowKey = args.key; 

    console.log(args); 
    console.log(rowKey); 
    console.log(event); 
}); 

ответ

2
$("tr").click(function() { 
    var link = $("#"+$(this).attr('id')+" .ClickClass").attr('data-link'); 
    alert(link); 
); 

Кстати, у вас есть дополнительное закрытие </td> после Accenture222

JSFiddle

+0

благодаря ваш код работает как шарм .. а также спасибо за указание "ТД" ошибку. этот код просто для справки, в действительности он отлично работает. – Xabby

1

Атрибут data-link является частью анкерного элемента внутри таблицы. Поэтому вам нужно сначала настроить этот якорь с помощью .find() или .chilren(), а затем получить его атрибут данных.

$("#jqxgrid").on('click', function() { 
     var current = $(this).find('a.ClickClass').data("link"); 
     alert(current); 
    }); 

Рабочий пример: https://jsfiddle.net/DinoMyte/1jgo6mpc/3/

0
<!doctype html> 
<html> 
    <head> 
     <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /> 
     <script src="https://code.jquery.com/jquery-2.2.0.js"></script> 
     <script> 
      $(document).ready(function() { 

       $("#jqxgrid tr").click(function() { 
        var link = $(this).find("td").eq(1).find("a").data("link"); 
        alert(link); 
       }); 
      }); 
     </script> 
    </head> 

    <body> 
     <table id="jqxgrid"> 
      <tr id="row1jqxgrid" role="row" data-key="1"> 
       <td class="jqx-cell jqx-cell-darkblue jqx-grid-cell jqx-grid-cell-darkblue jqx-item jqx-item-darkblue jqx-grid-  cell-nowrap jqx-grid-cell-nowrap-darkblue" style="max-width:350px; width:350px;border-left-width: 0px;" role="gridcell"> 
        <span class=""></span> 
        <span class="jqx-tree-grid-title jqx-tree-grid-title-darkblue jqx-grid-cell-wrap jqx-grid-cell-wrap-darkblue">Accenture222</span> 
       </td><td> 
        <a class="ClickClass" data-link="http://www.recruiterfeedback.com/trs/index.php/recruiter/feedback_details/174"> 
         <button class="btn btn-primary btn-sm ClickClass"> 
          <i class="fa fa-search"></i> 
          View 
         </button> 
        </a> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>