Jquery Meteor应用程序与DataTables：如何捕获选定表行的值

在我的meteor应用程序中，我有下表，它被包装在数据表中）：

---

我的问题是：如何捕获选中/单击的表行的值？

首先，您可能希望使用jQuery事件处理程序，而不是jQuery事件处理程序。但是无论哪种方式，在

click

事件处理程序中，

event.target

对象都应该引用已单击的

tr

因此，您需要做的就是更新

appRow

模板，使每个

tr

标记都有一个

id

或

data-someIdentifier，您可以选择保存该行的
\u-id
或其他标识符的属性。然后在处理程序中，
$（event.target）.prop（'id'）
或
$（event.target）.data（'someIdentifierOurSelecting'）
应该检索它

编辑以下是一个示例（未经测试）：

另请参见Meteor文档部分。
现在，我以以下内容结束：Template.IntroductionWizard_Step_2.rendered=function（）{console.log（'wizard.js:IntroductionWizard_Step_2 is rendered'）；/*Init the table*/oTable=$（'#apptable'）.dataTable（）；$（“#apptable tbody tr”）。on（'click'，函数（事件）{var aPos=oTable.fnGetPosition（event.target）；var aData=oTable.fnGetData（aPos[0]）；var value=fngeselected（oTable.AppName；console.log（aData）；$（“#apptable tbody tr”）.removeClass（'row#selected'）；$（this.addClass（'row#selected'）；}）}我可以用meteor的方式做这个吗（任何示例）
<template name="IntroductionWizard_Step_2">
   <div class="container">
        <div class="row">
            <div class="col-md-6">
                <div class="panel panel-primary">
                    <div class="panel-heading">
                        <h3 class="panel-title">Introduction Wizard Step 2: </h3>
                        <h3>Select an Application to describe</h3>
                    </div>
                    <table class="table table-hover table-bordered" id="apptable">
                        <thead>
                            <tr>
                            <th>App ID</th>
                                <th>App Name</th>
                                <th>In Scope</th>
                                <th>App Owner</th>
                                <th>BU</th>
                            </tr>
                        </thead>

                        <tbody>
                            {{#each appList}}
                                {{>appRow}}
                            {{/each}}
                        </tbody>
                    </table>
                    <br />

                </div>
                <br/>
            </div>
        </div>
    </div>
</template>

<template name="appRow">
     <tr>
     <td>{{AppId}} </td>
        <td>{{AppName}} </td>
        <td>{{InScope}} </td>
        <td>{{AppOwner}}</td>
        <td>{{Bu}}</td>
     </tr>
</template> 

Template.IntroductionWizard_Step_2.rendered = function(){
  console.log('wizard.js: IntroductionWizard_Step_2 is rendered');

  /* Init the table */
    oTable = $('#apptable').dataTable( );

$("#apptable tbody tr").on('click',function(event) {
    $("#apptable tbody tr").removeClass('row_selected');    
    $(this).addClass('row_selected');
  });  
}

<template name="appRow">
  <tr data-mongoId="{{_id}}">
    <td>{{AppId}}</td>
    <td>{{AppName}}</td>
    <td>{{InScope}}</td>
    <td>{{AppOwner}}</td>
    <td>{{Bu}}</td>
  </tr>
</template>

Template.appRow.events({
  "click tr": function (event) {
    var theRowThatWasClicked = event.target;
    var mongoIdOfThatRow = $(event.target).data("mongoId");
    // Then do whatever you want with those values; update the database, etc.

    // Copying/updating your code from your comment for completeness:
    var aPos = oTable.fnGetPosition(event.target);
    var aData = oTable.fnGetData(aPos[0]);
    var value = fnGetSelected( oTable ).AppName;
    console.log(aData);
    $("#apptable tbody tr").removeClass('row_selected');
    $(event.target).addClass('row_selected');
  });