Meteor：在点击事件上添加新字段答案

【问题标题】：Meteor : add new fields on click eventMeteor：在点击事件上添加新字段
【发布时间】：2015-05-26 02:06:07
【问题描述】：

我有一个表格，其中包含用户名和联系方式，其中包括电话号码和联系方式（个人、办公室等），我有一个 + 按钮，点击它我希望再显示一对联系方式.

因此，在每次点击 + 按钮时，我希望用户输入更多的联系电话号码和类型。

然后当用户点击提交按钮时，我希望它被保存。

任何人都可以帮助我如何在 Meteor 中完成此操作

【问题讨论】：

问题：您想将数据作为数组保存到您已经在编辑的集合中，例如contact { name: , attr: , numbers: [{ type: , number: }, ... ]} 还是应该将其存储在第二个链接集合中？你有架构吗？
我想保存在 Mongodb 中，所以数组更好吗？
这不依赖于 mongo - 只是对你的设计有一些想法。如果您想在其他焦点上重新使用数据，将它们作为单独的集合可能会很有用，如果不是必需的，那么存储为数组是非常好的
数组满足我的要求

标签： javascript meteor

【解决方案1】：

使用 Jquery 将您的动态输入框附加到正文或使用 id 或 class
的任何 div

而使用form你可以获得所有的价值

 <form id="Dynamic">
    <div>
        <input type="text" name="a"/>
    </div>
</form>
<button href="#" id="AddInpElem">Add Another Input Box</button>
<button href="#" id="s">submit</button>

var MaxInputs = 5;
var Dynamic = $('#Dynamic');
var i = $('#Dynamic div').size() + 1;

$('#AddInpElem').click( function () {
    if (i <= MaxInputs) {
        $('<div><input type="text" name="a'+i+'" /><a href="#" class="RemInpElem">Remove</a></div>').appendTo(Dynamic);
        i++;
    }
    return false;
});

$('#s').click( function () {
   var test = $('#Dynamic').serializeArray();
    console.log(test);
});

$("body").on("click",".RemInpElem", function(){
       if (i > 2) {
        $(this).parent('div').remove();
        i--;
    }
    return false;
})

示例： http://jsfiddle.net/kevalbhatt18/L9wtubnj/2/

【讨论】：

.serializeArray();将为您提供所有数据，请参见上面的示例
@Kevel 感谢您的回复，但我正在寻找在 Meteor 中使用 {{#each}} {{each}} 的东西

【解决方案2】：

我推荐使用AutoForm 和SimpleSchema，一旦你定义了一个数组类别，它们就会为你做到这一点。

MySchema = new SimpleSchema({
  myKey: {
    type: [String]  // this defines a string array
  }
});

【讨论】：