Trying to configure a nested form with Vue.js in a Rails application to save ingredients for a recipe. While all other details of the ingredients are saving correctly, the ingredient name (from an input field) is not getting saved in the database. How can I ensure that the name field gets saved?
app/models/ingredient.rb
class Ingredient < ApplicationRecord
belongs_to :recipe
end
app/models/recipe.rb
class Recipe < ApplicationRecord
has_many :ingredients
end
app/views/index.html.erb
<h1>Index</h1>
<!-- Rest of the code remains the same -->
...
app/views/api/v1/recipes/index.json.jbuilder
json.array! @recipes, partial: "recipe", as: :recipe
app/views/api/v1/recipes/_recipe.json.jbuilder
<!-- JSON output template remains the same -->
...
app/controllers/api/v1/recipes_controller.rb
<!-- Controller logic for handling recipes remains the same -->
...
app/javascripts/recipes_ctrl.js
$(document).on('ready', function() {
new Vue({
el: '#app',
data: {
// Data structure for Vue instance remains the same
...
},
methods: {
// Methods for handling newRecipe, newIngredient, and removeIngredient remain the same
...
}
})
})
This terminal output shows my efforts so far, with the CSRF token issue being handled:
Processing by Api::V1::RecipesController#create as JSON
Parameters: {"name"=>"", "chef"=>"", "cooktime"=>"", "amount"=>"", "description"=>"", "favorite"=>false, "ingredients"=>[{"name"=>"test"}, {"recipe_id"=>""], "recipe"=>{"name"=>"", "chef"=>"", "cooktime"=>"", "amount"=>"", "description"=>"", "favorite"=>false}}
Can't verify CSRF token authenticity.
(4.3ms) BEGIN
SQL (5.5ms) INSERT INTO "recipes" ("name", "chef", "cooktime", "description", "favorite", "created_at", "updated_at") VALUES ($1, $2, $3, $4, $5, $6, $7) RETURNING "id" [["name", ""], ["chef", ""], ["cooktime", ""], ["description", ""], ["favorite", false], ["created_at", 2017-02-05 17:29:34 UTC], ["updated_at", 2017-02-05 17:29:34 UTC]]
SQL (51.5ms) INSERT INTO "ingredients" ("recipe_id", "created_at", "updated_at") VALUES ($1, $2, $3) RETURNING "id" [["recipe_id", 18], ["created_at", 2017-02-05 17:29:34 UTC], ["updated_at", 2017-02-05 17:29:34 UTC]]
(3.1ms) COMMIT
Rendering api/v1/recipes/show.json.jbuilder
Ingredient Load (0.7ms) SELECT "ingredients".* FROM "ingredients" WHERE "ingredients"."recipe_id" = $1 [["recipe_id", 18]]
Rendered api/v1/recipes/_recipe.json.jbuilder (12.2ms)