从 Meteor js 中的每一行获取值答案

【问题标题】：Getting values from each row in Meteor js从 Meteor js 中的每一行获取值
【发布时间】：2020-07-11 18:44:38
【问题描述】：

有一个被模板包裹的表格。我想要做的是从该表的指定字段中获取值以及表单中的值。每行都有一个按钮来传递值。但是当我试图在控制台中打印出来时，它说它是未定义的。因此，任何人都对此有解决方案或更好的方法，我将不胜感激。

到目前为止，我已经尝试使用serializeArray()。但是，它似乎无法从 <td> 元素中获取值。

<template name="student">
    {{#each student}}
    <tr>
      <td>{{name}}</td>
      <td>{{studentID}}</td>
      <td><textarea rows="1"></textarea></td>
      <td><input type="submit" class="btn btn-primary markAttendance"></td>
    </tr>
    {{/each}}
</template>

<template name="subject">
    <select id="dropdown" name="dropdown" class="form-control">
    <option>Please select a subject</option>
    {{#each subject}}
    <option>{{subjectCode}}</option>
    {{/each}}
    </select>
</template>

事件处理程序：

Template.content.events({
   'click .markAttendance':function(e){
     e.preventDefault();
     var subjectCode = $(e.target).find('[name=dropdown]').val();
     var week = $(e.target).find('[name=week]').val();
     var studentName = $(e.target).find('td:eq(0)').text();
     var studentID = $(e.target).find('td:eq(1)').text();
     console.log(subjectCode);
     console.log(week);
     console.log(studentName);
     console.log(studentID);
     //.....
   }
 });

【问题讨论】：

标签： javascript jquery meteor meteor-blaze

【解决方案1】：

    Template.content.events({
      'click .markAttendance':function(event, instance){
       e.preventDefault(); // not needed unless you have a form someplace I'm not seeing
       var student = this;
       var subjectCode = $('#dropdown').val();
       var week = $('[name=week]').val();
       var studentName = student.name;
       var studentID = student._id;
       console.log(subjectCode);
       console.log(week);
       console.log(studentName);
       console.log(studentID);
     //.....
   }
});

【讨论】：

还有一个问题，如果我想在该模板的textarea中获取值怎么办。我只能从第一行获得价值。 ` $('[name=remarks]').val(); `
如果您将点击事件处理程序移动到学生模板，您可以执行 instance.find('textarea').val() 来获取值。您的另一个选择是给该 textarea 一个 id a 然后 $('#mytextareaid').val();

【解决方案2】：

我将 https://viewmodelblaze.azurewebsites.net/blaze 与 Blaze 一起使用，它使这种超级简单，但没有它你可以：

在输入中添加data-studendid

<td><input type="submit" class="btn btn-primary markAttendance" data-studentid="{{studentID}}"></td>

然后您可以在方法处理程序中通过 ID 查询学生，即：Students.findOne({_id: studentId})

【讨论】：