We Keep Coding

SyntaxError: Left hand side of operator '=' must be a reference

I hope someone could help as I have no clue on how to proceed with this error.
I am in the process of upgrading my existing site. My temp new site, tempsite, and plugins were all working fine until I upgraded to Wordpress 5.2.2–en_CA.
Now I get the following error :
`SyntaxError: Left hand side of operator '=' must be a reference`
Here is the instance code for the mini calendar.
<div class="clndr-controls">
<div class="current-month"><%= month %> <%= year %></div>
<div class="clndr-nav clndr-clearfix">
<div class="clndr-previous-button">‹</div>
<div class="clndr-next-button">›</div>
</div>
</div>
<div class="clndr-grid">
<div class="days-of-the-week clndr-clearfix">
<% _.each(daysOfTheWeek, function(day) { %>
<div class="header-day"><%= day %></div>
<% }); %>
</div>
<div class="days clndr-clearfix">
<% _.each(days, function(day) { %>
<div class="<%= day.classes %>" id="<%= day.id %>"><span class="day-number"><%= day.day %></span></div>
<% }); %>
</div>
</div>
<div class="event-listing">
<div class="event-listing-title">Events</div>
<% _.each(eventsThisMonth, function(event) { %>
<% if (event.url) { %><a target="<%= event.url_target %>" href="<%= event.url %>" <% } else { %><div <% } %> class="event-item clndr-clearfix">
<span class="event-item-date">
<% if (event.end != event.start) {
startMY = moment(event.start).format("MM YY");
endMY = moment(event.end).format("MM YY");
if (startMY === endMY) { %>
<%= moment(event.start).format("D") %>–<%= moment(event.end).format("D MMMM") %>
<% } else { %>
<%= moment(event.start).format("D MMMM") %> – <%= moment(event.end).format("D MMMM") %>
<% }
} else { %>
<%= moment(event.start).format("D MMMM") %>
<% } %>
</span>
<span class="event-item-name"><%= event.title %></span>
<% if (event.time) { %>
<span class="event-item-time"><%= event.time %></span>
<% } %>
<% if (event.location){ %>
<span class="event-item-time"><%= event.location %></span>
<% } %>
<span class="event-item-time">With: <%= event.speaker %></span>
<span class="event-item-desc"><%= event.desc %></span>
<% if (event.url) { %></a><% } else { %></div><% } %>
<% }); %>
</div>
Here is the js object options
doneRendering: function() {
var day=1, week=1, thisCLNDR = $(this)[0]["element"];
//make the background rows alternate colour
thisCLNDR.find(".day").each(function() {
if (day == 8) { day = 1; week++; }
if (week % 2 === 0) { $(this).addClass("alternate-bg"); }
day++;
});
//display a notice if there are no events for a month
var thisMonthEvents = thisCLNDR.find(".event-item").length;
if (thisMonthEvents == 0) {
thisCLNDR.find(".event-listing").append(
"<div style='text-align:center;' class='event-item'>No events found</div>"
);
}
},
weekOffset: 1

How to load rails form partials with jquery and submit as one form

In an attempt to make my rails html more readable I extracted several parts of it into partials. I then use jquery to render the partials. The issue is that now the form has come all "unhooked" so to speak, meaning when I attempt to submit the form it acts as though the partials don't exist. I suspect I am not understanding quite how forms work, because it seems like in other answers related to this the form builder isn't even addressed.
This SO question seems related to what I want to do but I think I'm too inexperienced to grasp it properly
The code I have thus far goes as follows:
/assets/javascripts/work_order.js
$(document).ready(function(){
$('.best_in_place').best_in_place();
$('#work_order_dueDate').datepicker();
$.datepicker.setDefaults({ dateFormat: 'dd-mm-yy'});
var selection_made = false
$('#work_order_project_type_id').change(function(){
if (!selection_made){
selection_made = true
var selection = $(this).find('option:selected').text();
if (selection == "Variable Data Mailing"){
$.get('/presort_informations/new');
$.get('/printing_instructions/new');
}
else if (selection == "Mailing"){
$.get('/presort_informations/new');
}
else if (selection == "Print Job"){
$.get('/printing_instructions/new');
}
}
});
});
and then
/views/work_orders/_form.html.erb
<%= form_for(#workorder) do |f| %>
<% if #workorder.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(#workorder.errors.count, "error") %> prohibited this workorder from being saved:</h2>
<ul>
<% #workorder.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<fieldset class="general-info">
<legend>General</legend>
<div class="col-md-12">
<div class="col-md-3">
<div class="form-group">
<%= f.label :Job_Title, class: "control-label" %>
<%= f.text_field :title, class:"form-control" %>
</div>
<div class="form-group">
<%= f.label :Project_Type, class: "control-label" %>
<%= f.collection_select(:project_type_id, ProjectType.all, :id, :name, {:prompt => true}, {:class => "form-control"}) %>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<%= f.label :Rep, class: "control-label" %>
<%= f.text_field :rep, class:"form-control" %>
</div>
<div class="form-group">
<%= f.label :Labels, class: "control-label" %>
<%= f.collection_select(:labels_id, Labels.all, :id, :name, {:prompt => true}, {:class => "form-control"}) %>
</div>
</div>
<div class="col-md-3">
<div class= "form-group">
<%= f.label :Due_Date, class: "control-label" %>
<%= f.text_field :dueDate, class: "form-control" %>
</div>
<div class="form-group">
<%= f.label :Project_Description, class: "control-label" %>
<%= f.text_area :projectDescription, class: "form-control" %>
</div>
</div>
</div>
</fieldset>
<fieldset class="presort-information">
</fieldset>
<div class="col-md-6 printing">
</div>
<fieldset class="production-details">
<legend>Production</legend>
<%= f.fields_for :production_details, ProductionDetails.new do |ff| %>
<%end%>
</fieldset>
<%= f.hidden_field(:number, :value => #workorder.number) %>
<%= f.hidden_field(:client_id, :value => #workorder.client_id) %>
<%= f.submit(class: "btn btn-default") %>
<% end %>
and as an example of one of the partials:
/app/views/presort_informations/new.js.erb
$('.presort-information').append( '<%= j render("presort_informations/form") %>' );
/app/views/presort_informations/_form.html.erb
<legend>Mailing</legend>
<%= fields_for :presort_information, PresortInformation.new do |ff| %>
.
.
.
<% end %>
I'm not really sure how to tie this all together so that I can load the partials based on the select box, but then submit them all as one form.
Edit:
I found this SO question which deals with the same issue, but I suspect that because I am rendering the partial after the page has been loaded I no longer have access to the form builder variable.
$('.presort-information').append( '<%= j render("presort_informations/form", f: f) %>' );
gives an undefined variable error when it's called. I'm still not sure how to bridge this gap between jquery and rails.

Turns out it was a relatively (if new conceptually to me) easy fix
First, load each DOM partial in along with hidden sections.
<%= form_for(#workorder) do |f| %>
<% if #workorder.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(#workorder.errors.count, "error") %> prohibited this workorder from being saved:</h2>
<ul>
<% #workorder.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<fieldset id="general-info-partial">
<%=render("genInfo", f: f)%>
</fieldset>
<fieldset id="presort-information-partial">
<%=render("presort_informations/form", f: f)%>
</fieldset>
<div class="col-md-6">
<fieldset id="printing-information-partial">
<%=render("printing_instructions/form", f: f)%>
</fieldset>
</div>
<fieldset id="production-details-partial">
<%=render("production_details/form", f: f) %>
</fieldset>
<%= f.hidden_field(:number, :value => #workorder.number) %>
<%= f.hidden_field(:client_id, :value => #workorder.client_id) %>
<input type="submit" value="Submit" class="btn btn-default">
<% end %>
<div id="hidden-general-info" class="hidden"></div>
<div id="hidden-presort-information" class="hidden"></div>
<div id="hidden-printing-information" class="hidden"></div>
Then the Javascript to move things in and out of the form:
$(document).ready(function(){
$('.best_in_place').best_in_place();
$('#work_order_dueDate').datepicker();
$.datepicker.setDefaults({ dateFormat: 'dd-mm-yy'});
var presortFields = $('#presort-information-partial');
var printingFields = $('#printing-information-partial');
var presortHidden = $('#hidden-presort-information');
var printingHidden = $('#hidden-printing-information');
presortHidden.html(presortFields.html());
presortFields.html('');
printingHidden.html(printingFields.html());
printingFields.html('');
$('#work_order_project_type_id').change(function(){
var selection = $(this).find('option:selected').text();
if (selection == "Variable Data Mailing"){
if (printingFields.html() == '' && presortFields.html() == ''){
printingFields.html(printingHidden.html()).hide().slideDown();
presortFields.html(presortHidden.html()).hide().slideDown();
}
else if(printingFields.html() == '' && !(presortFields.html() == '')){
printingFields.html(printingHidden.html()).hide().slideDown();
}
else if(!(printingFields.html() == '') && presortFields.html() == ''){
presortFields.html(presortHidden.html()).hide().slideDown();
}
}
else if (selection == "Mailing"){
if(!(printingFields.html() == '')){
printingFields.slideUp();
printingFields.html('');
presortFields.html(presortHidden.html()).hide().slideDown();
}else{
presortFields.html(presortHidden.html()).hide().slideDown();
}
}
else if (selection == "Print Job"){
printingFields.html(printingHidden.html()).hide().slideDown();
presortFields.slideUp();
presortFields.html('');
}
});
Basically, the idea was to load everything in as if I was going to use it all, and then just move the partials into a hidden section of the DOM, and then use JS to put them back in when the user makes a selection

rails nested form jquery image preview

Im using rails with jquery nested form. How to preview image that I want to upload in their own image tag. At the above picture. Everytime I add a new picture, it will be reviewed on the first image tag.
this is my html code:
<%= f.fields_for :product_images do |builder| %>
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<%= f.label 'Upload Image' %>
<%= builder.file_field :image, class: 'form-control', onchange: 'readURL(this);' %>
<small class="pull-right">
<%= builder.link_to_remove "Remove this image" %>
</small>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<%= f.label 'Image: ' %> <br>
<%= image_tag builder.object.image_url(:small), id: 'img_prev' if builder.object.image_url.present? %>
</div>
</div>
</div>
<% end %>
<div class="form-group">
<%= f.link_to_add "Add image", :product_images, class: 'btn btn-success' %>
</div>
<% end %>
and my jquery script:
// image preview
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#img_prev')
.attr('src', e.target.result)
// .width(150);
.height(100);
};
reader.readAsDataURL(input.files[0]);
}
}

jQuery:
// Set image preview on selection
function readURL(input, div_id) {
div_id = "#" + div_id;
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$(div_id).attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
Rails:
<%= f.fields_for :pictures do |pic| %>
<%= pic.file_field :picture, :onChange => "readURL(this, #{pic.index})" %>
<img id="<%= pic.index %>" src="<%= image_url 'image-placeholder.png' %>">
<% end %>

Rails combined two form fields into one

How do I combined the day and time into a "start_time" variable (and "end_time") before submitting? JS?
<%= form_for #task do |f| %>
<%= render 'shared/error_messages', object: f.object %>
<div class="time_selectors">
<%= f.label :start_time %>
<%= f.text_field :start_time, :class => 'datepicker' %>
<select class="form-control time_dropdown" id="start_hour">
<option>Select Date</option>
</select>
<div class="clear_both"></div>
<%= f.label :end_time %>
<%= f.text_field :end_time, :class => 'datepicker' %>
<select class="form-control time_dropdown" id="end_hour">
<option>Select Date</option>
</select>
</div>
<div class="clear_both"></div>
</div>
<div class="clear_both"></div>
<%= f.submit "Create Task", class: "btn btn-large btn-primary" %>
</div>
<% end %>
I have them combined in my Task model, and I'd prefer to leave them combined if I can.
My JS right now doesn't work. What am I missing?
$('#new-task').submit ()->
valuesToSubmit = $(this).serialize
console.log('test')
console.log(valuesToSubmit)
return false
$('button').click ()->
console.log ('test2')

What about something like this?
$('form').on 'submit', (event) ->
event.preventDefault()
start_time = ''
start_time += $(#).find('input[name=start_day]').val()
start_time += '_'
start_time += $(#).find('input[name=start_hour]').val()
$('<input/>', {type: 'hidden', name: 'start_time', value: start_time}).appendTo($(#))
#submit()
(*The CoffeeScript version hasn't been tested - use the working Fiddle as your guide.)
Fiddle

modification of hidden field using jquery working in development not in server rails

I have the following code in the view of a page in my rails application to calculate the price and submit an order using jquery. Here is the form first
<%= 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>
Here is the jquery that I used
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);
The calculation and the value of the hidden field order_total is getting set in the local but it is not happening in the production. It is killing my project. Any ideas?