Question

我发现复选框是一个强大的工具，但我很难绕过它们。我希望客户指定他们喜欢哪种厨房（快餐，意大利菜，寿司......）。后来我想问餐馆他们提供什么厨房，并根据我想要匹配客户和餐馆的结果。我认为将所有选择保存在厨房数组中会很好[]。这是一个很好的方法，或者你通常将每个选择保存为一个单独的变量？我的HTML看起来像这样：

<template name="hello">
    <form class="main form page">
    <div class="form-group">
      <label class="control-label" </label>
    <div class="checkbox">
      <label> <input  name="kitchen" type="checkbox" class="kitchen" id="italian"> italian</label>
    </div>
    <div class="checkbox">
      <label> <input name="kitchen" type="checkbox" class="kitchen" id="sushi"> sushi </label>
    </div>
    <div class="checkbox">
      <label><input name="kitchen" type="checkbox" class="kitchen" id="fastfood"> fast food </label>
    </div>
  </form>
</template>

问题在于我不知道将数据存储在mongo数据库中的最有效方式。

我在流星工作。所以我必须创建一个模板事件：

Template.hello.events({
'submit form': function(e) {
e.preventDefault();

现在我需要将所有结果都提供给数据库。厨房是应该添加到Checkbox集合的变量。

var kitchens = {
 fastfood: $(e.target).find('[name=fastfood]').val(),
 sushi: $(e.target).find('[name=sushi]').val(),
 italian: $(e.target).find('[name=italian]').val(),
};

kitchens._id = Checkbox.insert(kitchens);
console.log("added to database");

此代码会将数据发送到数据库并创建一个ID，但我无法查看该复选框是否已选中。我发现以下代码将支票翻译成＆＃34;是＆＃34;或＆＃34;否＆＃34;但我不知道如何将其整合到我的代码中：

function kitchensChecked(id) {
var X = document.getElementById(id);
if (X.checked == true) {
 X.value = "YES";
} else {
X.value = "NO";
};

您能否帮我集成此代码或向我展示将复选框结果保存到Checkbox集合的更流畅方法？

Answer 1

这就是我在应用中处理复选框的方式。我会移除id字段，而是在复选框上显示value字段：

<input name="kitchen[]" type="checkbox" class="kitchen" value="italian">
<input name="kitchen[]" type="checkbox" class="kitchen" value="sushi">
<input name="kitchen[]" type="checkbox" class="kitchen" value="fastfood">

然后使用pcel:serialize包轻松检索已检查的项目：

var formObject = $('form.main').serializeJSON();
var checkedItems = formObject.kitchen; // an array containing the checked values

Answer 2

有一个名为:checked的css选择器可过滤选择并仅返回已检查的输入。

var kitchens = {
 fastfood: $(e.target).find('#fastfood:checked').val(),
 sushi: $(e.target).find('#sushi:checked').val(),
 italian: $(e.target).find('#italian:checked').val()
};

使用JavaScript将复选框值传递给数据库

2 个答案: