Ruby on Rails 4, form inside a view - ruby-on-rails

Question

I am currently trying to build a view that shows a question to the user and if they answer the question right, allows the user to check a checkbox which sends a request to persist that in the database. In other words we keep track of what questions have been answered correctly by the user in the database.
Now my issue is that (besides being a complete newbie in RoR and front end in general), I don't know how to insert the checkbox (form) inside my view along with the question.
I'm using rails 4.
Thank you!

Answer 1

I would start adding a Boolean value to all the answers.
$ rails g migration AddCorrectToAnswers
now that migration should look like
class AddCorrectToAnswers < ActiveRecord::Migration[5.0]
def change
add_column :answers, :correct, :boolean, default: false
end
end
now we can create a new route that will mark the answers correct
# config/routes.rb
Rails.application.routes.draw do
...
resources :questions do
resources :answers do
match "/correct" => "answers#correct", :as => :correct, via: :all
end
end
...
end
Now you should have a new route
question_answer_correct /questions/:question_id/answers/:answer_id/correct(.:format) answers#correct
I am assuming that the answer are in the questions show page
now in your show page you can do something like this
# app/views/questions/show.html.erb
<% #question.answers.each do |answer| %>
<%= answer.answer %>
<%= form_for #user, :url => url_for(:controller => 'answers', :action => 'correct') %>
<%= f.label "Correct Answer" %> <br />
<%= f.check_box :correct %> <br />
....
<%end %>
<% end %>
Now the last thing you have to do is create a method in the answers controller called correct to mark the answers as correct
# app/controllers/answers_controller.rb
class AnswersControlle < ApplicationController
...
def correct
#answer = Answer.find(params[:answer_id])
#answer.correct = true
#answer.save
redirect_to :back
end
end
I hope that this helps
Happy coding

Answer 2

Assuming you already have form setup,
you can add one button which says submit or anything you want to diplay
<button class="check">Click me</button>
Now you can write an event listener for this button which can reveal the answer and if it matches to the answer which User has given, then fire and Ajax call to your backend and save whatever you want to.
example code:
$('.check').on('click', function(){
var real = $('.reveal-answer').val();
$('.reveal-answer').show(); // you need to protect this part from being abused
var answer = $('.user-input-answer').val(); //Assuming its a input field
var questionId = $('.question').data('question-id');
if(answer === real){
url = '/submit_answer';
data = { question_id: questionId, answer: answer };
$.post( url, data , function() {
}, 'json');
}
});
Roughly it should work like this but there are lot to do from the security prospective. For ex: You can not have all answers on view side, You should do the backend validation once the answer is submitted(to check whether it is actually correct or someone tried to hack it.)