使用JavaScript将复选框值传递给数据库 [英] Passing checkbox values to database using JavaScript

问题描述

我发现复选框是一个功能强大的工具，但是我很难将它们包裹住.我希望客户指定他们喜欢哪种厨房(快餐，意大利菜，寿司等).后来我想问餐馆他们提供什么厨房，并根据结果我想匹配顾客和餐馆.我认为将所有选择保存在厨房数组中会很好.这是个好方法吗?还是通常将每个选择都保存为一个单独的变量? 我的html看起来像这样:

I find checkboxes a powerful tool but I have a hard time wrapping my head around them. I want customers to specify which kind of kitchen they like (fast food, italian, sus ..). Later I want to ask restaurants what kitchens they offer and based on the result I want to match customers and restaurants. I thought it would be nice to save all the choices in a kitchen array[]. Is that a good way to go about it or do you usually save each choice as an individual variable? My html looks like this:

<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数据库中的最有效方法.

The problem is that I don't know the most effective way in which to store the data in the mongo database.

我正在流星上工作.因此，我必须创建一个模板事件:

I am working in meteor. So I have to create a template event:

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

现在，我需要将所有结果都保存到数据库中.其中kitchens是应添加到Checkbox集合的变量.

Now I need to get all the results to the database. Where kitchens is the variable that should be added to the Checkbox collection.

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，但我看不到该复选框是否已选中.我发现以下代码将支票转换为是"或否"，但我不知道如何将其集成到我的代码中:

This code will send data to the database and an id is created but I can't see if the checkbox was checked or not. I found the below code to translate the check to a "Yes" or "No" but I don't know how to integrate this into my code:

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

您能帮我集成这段代码，还是向我展示一种将复选框结果保存到Checkbox集合的更流畅的方法?

Could you help me to integrate this code or show me a smoother way to save the checkbox results to the Checkbox collection?

推荐答案

这是我处理应用程序中复选框的方式.我将删除id字段，而在复选框上使用value字段:

This is how I deal with checkboxes in my app. I'd remove the id field and instead have a value field on the checkboxes:

<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 包轻松检索已选中的项目:

Then use the pcel:serialize package to easily retrieve checked items:

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

这篇关于使用JavaScript将复选框值传递给数据库的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！