1
如果用户点击“添加更多”按钮成分名称和金额输入字段保持上添加page.And当用户填写所有其他字段后提交表单我想，所有的输入值包括组分名称和金额字段被插入到Recipes集合中。所以后来我可以用show_recipe page.I不知道是否需要添加成分名称和金额字段值转换为show_recipe页面上显示它们的某些其他集合。我没有得到如何添加所有成分和数量，然后在show_recipe页面上正确显示它们。请给我指导如何去做。 完整的源代码是here表单提交具有多个字段
add_recipes.html
<template name="add_recipes">
<form class="add_recipe">
<div class="form-group">
<label class="control-label" for="name" >Recipe Name</label>
<input type="text" class="form-control" name="name" id="name" placeholder="Please Enter the Recipe name">
</div>
<div class="form-inline mb">
<div class="form-group">
<label for="ingredient">Ingredient Name</label>
<input type="text" class="form-control" name="ingredient" id="ingredient" placeholder="Name">
</div>
<div class="form-group">
<label for="amount">Amount</label>
<input type="text" class="form-control" name="amount" id="amount" placeholder="Amount ">
</div>
<button class="btn btn-default addMore">Add More</button>
</div>
<div class="form-group">
<label class="control-label" for="des" >How to prepare</label>
<textarea class="form-control" type="text" name="description" rows="3" id="des">
</textarea>
</div>
<div class="form-group">
<label class="control-label" for="time" >Time to prepare</label>
<input class="form-control" type="number" name="time" id="time" placeholder="Time required to make the recipe. (In Minutes)">
</div>
<div class="form-group">
<label for="prodImg">Please Select the Image of your Recipe</label>
<input type="file" id="recipeImage" name="recipeImage">
</div>
<div>
<button type="submit" name="submit" class="btn btn-success "> Add Recipe</button>
<a href="/" class="btn btn-default">Close</a>
</div>
</form>
</template>
add_recipes.js
Template.add_recipes.events({
'submit .add_recipe':function(event){
var name = event.target.name.value ;
var ingredient = event.target.ingredient.value ;
var amount = event.target.amount.value ;
var description = event.target.description.value ;
var time= event.target.time.value ;
var file = $('#recipeImage').get(0).files[0];
if(file){
fsFile = new FS.File(file);
RecipesImages.insert(fsFile,function(err,result){
if(!err){
var recipeImage = '/cfs/files/RecipesImages/'+ result._id;
Recipes.insert({
name:name,
description:description,
image:recipeImage,
time:time,
createdAt: new Date()
})
}
});
} else{
var recipieImage = '/img/noimage.png';
Recipes.insert({
name:name,
description:description,
image:recipesImages,
time:time,
createdAt: new Date()
})
}
// Clear the form
event.target.name.value = "";
event.target.ingredient.value = "";
event.target.amount.value = "";
event.target.description.value = "";
event.target.time.value= "";
FlashMessages.sendSuccess('Recipe Added',{ autoHide: true, hideDelay: 3000 });
Router.go('/');
event.preventDefault();
}
})