I am quite new to rails and I would like to send a background request to the server and then show the results without updating the whole page.
I checked this video: http://ift.tt/1EwoFzK. In this video he says it is necessary to create a js view.I also took a look into this link http://ift.tt/1DGQ2KV but I am not able to achieve want I want.
Basically the user fills out a form and receive an answer from the controller BUT the values introduced in the form should be there. Because of the entire page refresh the values are reseted.
Routes.rb
Rails.application.routes.draw do
root 'energycalcmod#front_end'
get 'energycalcmod/front_end'
post 'energycalcmod/get_values'
end
energycalcmod_controller.rb
class EnergycalcmodController < ApplicationController
def front_end
end
def get_values
# Receiving the firsts two entries of the formular
input1 = params[:user_entry_module1].to_i
input2 = params[:user_entry_module2].to_i
@calc = Calculator.new(input1,input2)
@energy_calc_results = @calc.energy_calc_module_output
respond_to do |format|
format.html {redirect_to "/energycalcmod/front_end"}
format.js
end
end
end
views/energycalcmod/front_end.html.erb
<div id="outer-container" >
<div id="input" >
<h2>Title</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum perferendis mollitia at consectetur fuga quasi accusantium iste facere blanditiis nobis, aliquam incidunt impedit unde vitae aliquid dolor sapiente. Architecto, natus!</p>
<div id="wrapper-form" >
<%= render "partials/form" %>
</div>
</div>
<div id="optimal" >
</div>
<div id="independency" >
</div>
<div id="save" >
</div>
</div>
<h3 id="test" style="display:none;" > <%= @energy_calc_results %> </h3>
views/partials/_form.html.erb
<%= form_tag("/energycalcmod/get_values", remote: true) do %>
<div id="upper-form-wrapper" >
<div id="upper-form-left" >
<h5 >Jahreshausverbrauch <a href="#"><i class="fa fa-info-circle" title="Jahreshasuverbrauch"></i></a> </h5>
<h5 >PV <i class="fa fa-info-circle"></i></h5>
</div>
<div id="upper-form-right" >
<%= text_field_tag "user_entry_module1", params["user_entry_module1"] || "", id: "jahreshausverbrauch", disable: true, class: "first-input-box", size: 1 %><span>kWh</span>
<div id="slider-jahreshausverbrauch"></div>
<%= text_field_tag "user_entry_module2", params["user_entry_module2"] || "", id: "pv", disable: true, class: "input-box", size: 1 %><span>kWp</span>
<div id="slider-pv"></div>
</div>
</div>
<%= submit_tag "Berechnen" %>
<%end%>
views/energycalcmod/get_values.js.erb
$("test").show("<%= j @energy_calc_results %>" );
Error I got in the console:
Can't verify CSRF token authenticity
Completed 422 Unprocessable Entity in 1ms (ActiveRecord: 0.0ms)
ActionController::InvalidAuthenticityToken (ActionController::InvalidAuthenticityToken)
Question: I want to post the results @energy_calc_results without refreshing the entire page.
Aucun commentaire:
Enregistrer un commentaire