javascript - 如何使用 Meteor 在 HTML 中选择多复选框？

Question

我需要知道如何使用 meteor 在 html 中选择多个复选框。我做了一个示例。在这个示例中选择了多个复选框。如何获取所选数据以及如何将数据存储在数组中。你能请看到下面的代码并建议我做什么？

假设arrayname = Bike,car,Computer(这些是选中的项)，数组中的详细信息存储

HTML代码:

<form id="cb-form" action="action">
<input type="checkbox" name="owns" value="Bike">Bike<br/>
<input type="checkbox" name="owns" value="Car">car<br/>
<input type="checkbox" name="owns" value="Refridgerator">Refridgerator<br/>
<input type="checkbox" name="owns" value="Mobile">Mobile<br/>
<input type="checkbox" name="owns" value="Tablet">Tablet<br/>
<input type="checkbox" name="owns" value="Computer">Computer<br/>
<input type="submit"  value="send" />
</form>

JS代码:

Template.login.events

  ({

    'submit #cb-form' : function (e,t)

    {

      // template data, if any, is available in 'this'

      if (typeof console !== 'undefined')

        console.log("You pressed LOGIN Button");

        e.preventDefault();

       //retrieve the input field values

         //here write get multiple check boxes data logic same as above scenario
     }

  });

Answer 1

HTML:

<template name="login">
  <form id="cb-form" action="action">
   <input type="checkbox" name="owns" value="Bike">Bike<br/>
   <input type="checkbox" name="owns" value="Car">car<br/>
   <input type="checkbox" name="owns" value="Refridgerator">Refridgerator<br/>
   <input type="checkbox" name="owns" value="Mobile">Mobile<br/>
   <input type="checkbox" name="owns" value="Tablet">Tablet<br/>
   <input type="checkbox" name="owns" value="Computer">Computer<br/>
   <input type="submit"  value="send" />
 </form>  
</template>

JS:

Template.login.events({
 'submit #cb-form' : function (event, template) {
   event.preventDefault();

   var selected = template.findAll( "input[type=checkbox]:checked");

   var array = _.map(selected, function(item) {
     return item.defaultValue;
   });

   console.log(array);

 }
});

如果选择了 Car 和 Refridge，则输出 ["Car", "Refridgerator"]。它只是简单地使用下划线。查看下划线文档以进一步阅读。