Railsアプリケーションのページのビューに次のコードがあり、価格を計算し、jqueryを使用して注文を送信します。まずフォームはこちら
<%= form_for(@order) do |f| %>
<% if @order.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(@order.errors.count, "error") %> prohibited this category from being saved:</h2>
<ul>
<% @order.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="col-md-12">
<div id="customs-form">
<span class="badge">1</span>
<%= f.label "Select your model location*" %>
<%= f.collection_select :location_id, Location.all, :id, :formatted_display, { prompt: true }, :required => true, :class => 'chosen-select order_form' %>
<span class="badge">2</span>
<%= f.label "Select Your model" %>
<%= f.select :performer_id, grouped_options_for_select(Location.order(:name).map{ |group| [group.name, group.performers.map{ |performer| [performer.first_name, performer.id, {'data-whitelabel_amount'=>performer.white_label.w_markup, 'data-thumb' => performer.profile_thumb_url,'data-id'=>performer.white_label.id, 'data-admin' => performer.white_label.markup.price }] } ] }), { prompt: true}, required: true, class: 'chosen-select order_form' %>
<span class="badge">3</span>
<%= f.label "SELECT YOUR CATEGORY" %>
<%= f.select :clip_category_id, grouped_options_for_select(Performer.order(:first_name).map{ |group| [group.first_name, group.clip_category_performers.map{ |c| [c.clip_category.name, c.clip_category.id, {'data-amount'=>c.amount}] } ] }), { prompt: true}, required: true, class: 'chosen-select order_form' %>
<span class="badge">4</span>
<%= f.label "SELECT THE DURATION" %>
<%= f.select :duration_id, grouped_options_for_select(Performer.order(:first_name).map{ |group| [group.first_name, group.duration_performers.map{ |c| [c.duration.time, c.duration.id, {'data-amount'=>c.amount}] } ] }),{ prompt: true}, required: true, class: 'chosen-select order_form' %>
<span class="badge">5</span>
<%= f.label "SELECT THE QUALITY" %>
<%= f.select :quality_id, grouped_options_for_select(Performer.order(:first_name).map{ |group| [group.first_name, group.quality_performers.map{ |c| [c.quality.name , c.quality.id, {'data-amount'=>c.amount}] } ] }), { prompt: true}, required: true, class: 'chosen-select order_form' %>
<span class="badge">6</span>
<%= f.label "SELECT DELIVERY TIME" %>
<%= f.select :delivery_time_id, grouped_options_for_select(Performer.order(:first_name).map{ |group| [group.first_name, group.delivery_time_performers.map{ |c| [c.delivery_time.duration, c.delivery_time.id, {'data-amount'=>c.amount}] } ] }), { prompt: true}, required: true, class: 'chosen-select order_form' %>
<span class="badge">7</span>
<%= f.label "Write your description"%>
<% if session[:from_site] %>
<%= f.hidden_field :affiliate_id, :value=>@prev_website_id%>
<%end %>
<%= f.text_area :description, :rows => 4, :cols => 60, maxlength: 999, :class => "order_desc order_form form-control" %>
<span id="remainingC"><p class="help-block">Content limited to 999 characters, remaining: 999</p></span>
<%= f.hidden_field :total, value: "", id: "order_total"%>
<% if user_signed_in? %>
<%= f.hidden_field :email, :value => current_user.email%>
<% end %>
<div class="actions" >
<h4 class="alert1"><p class ="help-block">*Please buy credits before you order as customer</p></h4>
<%= f.button :"ORDER NOW", :class => "btn btn-lg btn-marketing" %>
</div>
</div>
<!-- <div class="actions" onclick="check()">-->
<% end %>
</div>
これが私が使用したjqueryです
read = function(){
function calculate_perf_total()
{
category_amount = parseFloat($('#order_clip_category_id :selected').data('amount')) || 0
duration_amount = parseFloat($('#order_duration_id :selected').data('amount')) || 0
quality_amount = parseFloat($('#order_quality_id :selected').data('amount')) || 0
delivery_amount = parseFloat($('#order_delivery_time_id :selected').data('amount')) || 0
perf_addition=(category_amount + duration_amount + quality_amount+delivery_amount)
if(category_amount && duration_amount && delivery_amount && quality_amount)
{
console.log("hello you are here")
white_label_amount = parseFloat($('#order_performer_id :selected').data('whitelabel_amount')) || 1
if(white_label_amount==1)
{
white_label_amount=parseFloat($('#white_label_id_price').data('amount')) || 1
}
affiliate_amount=parseFloat($('#affiliate_id_price').data('amount')) || 1
admin_amount = parseFloat($('#super_admin_price').data('amount')) || 1
if(admin_amount==1)
{
admin_amount=parseFloat($('#order_performer_id :selected').data('admin'))
}
admin_cut=perf_addition*admin_amount
console.log("admin_amount")
console.log(admin_amount)
console.log("admin_cut")
console.log(admin_cut)
if(parseFloat($('#order_performer_id :selected').data('id')) ==1 || parseFloat($('#white_label_id').data('amount'))==1)
{
other_cut=0
}
else
{
other_cut=perf_addition*white_label_amount
}
console.log("other_cut")
console.log(other_cut)
if(affiliate_amount!=1)
{
other_cut_1=perf_addition*affiliate_amount
// alert(other_cut_1)
}
else
{
other_cut_1=0
}
console.log("other_cut_1")
console.log(other_cut_1)
// alert(window.my_config.perf_addition+other_cut+admin_cut)
total_amount=perf_addition+other_cut+admin_cut+other_cut_1
// alert(total_amount)
//alert(total_amount)
$('#total_amount').html(Math.ceil(total_amount));
// alert($('#order_total'))
$('#order_total').val(Math.ceil(total_amount));
}
else
{
// alert(window.my_config.perf_addition);
//alert(total_amount)
$('#total_amount').html(Math.ceil(perf_addition))
}
}
$('#order_clip_category_id').change(function()
{
//alert("alert1");
calculate_perf_total()
});
$('#order_duration_id').change(function()
{
//alert("alert2");
calculate_perf_total()
});
$('#order_quality_id').change(function()
{
// alert("alert3");
calculate_perf_total()
});
$('#order_delivery_time_id').change(function()
{
// alert("alert4");
calculate_perf_total()
// calculate_total()
});
}
$(document).ready(read);
$(document).on('page:load', read);
非表示フィールドの計算と値はorder_totalローカルで設定されていますが、本番環境では発生していません。それは私のプロジェクトを殺しています。何か案は？