Application layout not applied to form - ruby-on-rails

In app/controllers/fw_exports_controller.rb, I have:
def import_spreadsheet
#followeds = Followed.all.order(:screen_name)
#import_spreadsheet = FwExport.new
render partial: 'fw_exports/import_spreadsheet'
end
In app/views/layouts/application.html.slim, I have:
doctype html
html
head
meta content=("text/html; charset=UTF-8") http-equiv="Content-Type" /
meta content="width=device-width, initial-scale=1.0" name="viewport" /
title= content_for?(:title) ? yield(:title) : t('project_name')
meta content=("#{content_for?(:description) ? yield(:description) : t('project_name')}") name="description" /
= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true
= javascript_include_tag 'application', 'data-turbolinks-track' => true
= csrf_meta_tags
body
header
= render 'layouts/navigation'
main role="main"
= render 'layouts/messages'
= yield
= render "layouts/footer"
In app/views/layouts/_navigation.html.slim, I have:
nav.navbar.navbar-default role="navigation"
.container
.navbar-header
a.navbar-brand href="#"
= t('parnassus_tools_home')
.navbar-left
ul.nav.navbar-nav
li
a
= link_to t('menus.upload_file'), import_spreadsheet_path
In app/views/fw_exports/_import_spreadsheet.html.slim, I have:
.container
h1
= t('fw_exports.choose_file_to_upload')
= form_tag process_imported_spreadsheet_path, html: { multipart: true }
.form-group
= file_field_tag :import_file
- if !#followeds[0].nil?
.form-group
= select_tag "followed_id", options_from_collection_for_select(#followeds, "id", "screen_name", "1")
.form_group
.sr-only
= label_tag t('fw_exports.screen_name_to_add')
= text_field_tag :screen_name_addition, placeholder: t('fw_exports.screen_name_to_add')
= button_tag(type: 'submit', class: "btn btn-primary") do
i.icon-ok.icon-white
= t('fw_exports.import')
In app/views/landings/index.html.slim, I have (this is the home page):
h1 Home Page
p test text
Here's what I see when I am on the home page:
But when I click on the Upload File menu item, from the home page, here's what I see:
Why isn't the application layout applied to the form?

You will need to render as a template and not as a partial. First, create a view template:
app/views/fw_spreadsheet/import_spreadsheet.html.slim
= render 'fw_exports/import_spreadsheet_form'
Next, rename your partial by changing the name of app/views/fw_spreadsheet/_import_spreadsheet.html.slim to app/views/fw_spreadsheet/_import_spreadsheet_form.html.slim
Finally, modify your controller as follows:
app/controllers/fw_exports_controller.rb
def import_spreadsheet
#followeds = Followed.all.order(:screen_name)
#import_spreadsheet = FwExport.new
render 'fw_exports/import_spreadsheet'
end

Related

How to render HTML hierarchy correctly

I need to deal with the front-end of my application only. I understand how to write the templates but, for some reason, a few specific elements jump out of the hierarchy I've created:
%html
%head
%meta{ content: 'text/html; charset=UTF-8', 'http-equiv': 'Content-Type' }
%title Title
%body{ data: { action: action_name, controller: controller_name.camelcase } }
.page-container
= render 'application/timeout'
%header
= render 'application/cookie_banner'
.container
.row
.logo.col-3
= link_to root_path do
= image_tag 'logo.jpg'
.login.col-9
= render 'application/user_information'
%nav.navbar.navbar-expand.navbar-light
= render 'navigation/by_role'
.content-container.container
.row
%section
.section-container
= render 'application/notifications'
= render 'application/flash'
= yield
= render 'application/footer'
I want to wrap the page in '.page-container', but the footer and content-container.container elements are outside the wrapper:
I need the rendering to follow my element hierarchy.

Rails partial rendering twice on changing the URL

I m new to RoR and i recently figured out that if I change the part of URL from the address bar it is just rendering the partial twice below I m illustrating the same.
So my url is localhost:3000/admin/exp_app/10 so if i refresh this page it gets rendered one time but if i change the url to localhost:3000/admin/exp_app/11 the same request gets twice to controller and it is rendering the partial two times .
Can someone help me?
Below i m attaching the part of code.
exp_controller.rb
def show
authorize! :sales, current_user
#filter = params[:filter] || 'all'
#filter_by = params[:filter_by] || 'all'
#analytics_filter = params[:analytics_filter] || 'all'
#uw = params[:uw_id]
#entity = params[:entity]
#leo_no_brc = params[:leo_no_brc].present?
#exporter_application = User.exp_leads_applications.find(params[:id]) rescue nil
user = User.find(params[:id]) if #exporter_application.nil? || can?(:mexico_sales, current_user)
#total_ltm = #exporter_application.shipment_volume_last_year(nil, false).to_i
#exp_clients = #exporter_application.clients
#exp_applications_clients = #exp_clients.where(status: Client::CLIENT_STATUS_ORDER).group_by(&:status)
#exp_task_instances = #exporter_application.task_instances.where(client_id: nil)
#exporter_application = User.exp_leads_applications.includes(:iec, :contacts,
interactions: [:replies],
task_instances: { interactions: [:replies] },
application: { exporter_user: [:iec] })
end
show.html.erb
<% if params[:_tpl] %>
<div class="admin-section tabpanel row">
<%= render partial: params[:_tpl], locals: { instance: #exporter_application } %>
</div>
<% else %>
<%= render 'admin/header' %>
<%= render partial: 'admin/exporter_applications/show' %>
<%= render 'admin/footer' %>
<% end %>
It is guranteed that this url is not called in partial again admin/exporter_applications/show
Thanks in advance!

Can anyone help pinpoint why I get this Uncaught ReferenceError: $ is not defined error for google maps?

I am trying to render the google map api on my web page but I keep getting this error:
edit:1076 Uncaught ReferenceError: $ is not defined
Here is the process. The call that leads to the rendering of the api map begins in an edit.html.haml file.
edit.html.haml
........html.....
........html.....
........html.....
.col-md-5.col-md-push-1
.form-group
%label.control-label!= t('.city_and_country')
.controls
%p.enabled
%input.form-control#location_scratch{ type: :text, autocomplete: :off, value: #account.location }
%a{ href: 'javascript:EditMap.clearLocation();' }= t('clear')
%p.error#not_found{ style: 'display:none' }
= t('.location_error_message')
#map
#-----THIS IS WHERE IT STARTS-------------
!= map_init('map,' #account.latitude ? 7 : 0)
#-------------------------------------------
= f.hidden_field :location
= f.hidden_field :country_code
= f.hidden_field :latitude
= f.hidden_field :longitude
From map_init in the edit.html.haml file we then travel to the map_helper.rb file
map_helper.rb
module MapHelper
def map_init(id, zoom = 2)
map_script_load + map_js_initialization(id, zoom)
end
private
def map_script_load
key = Rails.application.config.google_maps_api_key
uri = "#{request.ssl? ? 'https' : 'http'}://maps.googleapis.com/maps/api/js?v=3&key=#{key}"
"<script async defer src='#{uri}' type='text/javascript'></script>"
end
def map_js_initialization(id, zoom)
javascript_tag <<-JSCRIPT
$(document).on('page:change', function() {
Map.load('#{id}', 25, 12, 2);
Map.moveTo(25, 12, #{zoom});
});
JSCRIPT
end
and then from there it goes to a Map.js file that calls the load and moveTo methods.
The problem though is in the map_js_initialization method. The JSCRIPT javascript code fails for $(document).on('page:change') Why is it failing for the jQuery object? I saw that an error like this occurs because the google maps api loads before the jquery source code. However, I've also placed an async defer on the maps and still no change in result.
I have require jquery in my application.js file and then in my application.html.haml file I have
!!!5
%html
%head
- page_title = content_for?(:html_title) ? "#{yield(:html_title)}" : t('.openhub')
%title= page_title
%meta{ name: 'viewport', content: 'width=device-width, initial-scale=1.0' }
%meta{ name: 'description', content: page_context[:description] }
%meta{ name: 'keywords', content: page_context[:keywords] }
%meta{ name: 'digits-consumer-key', content: ENV['DIGITS_CONSUMER_KEY'] }
%meta{ name: 'google-site-verification', content: 'jKkWeVQ0tB1bffJYg7xXAtcIM-nrjjVxhP3ohb8UH2A' }
= yield :custom_head
= stylesheet_link_tag 'application', media: 'all'
= csrf_meta_tags
%body{ zoom: 1 }
= yield :session_projects_banner
.container#page
%header= render partial: 'layouts/partials/header'
= render partial: 'layouts/partials/page'
.clear
%footer= render partial: 'layouts/partials/footer'
= yield(:javascript) if content_for?(:javascript)
= javascript_include_tag 'application',
'https://www.google.com/recaptcha/api.js',
'https://cdn.digits.com/1/sdk.js',
'//cdn.optimizely.com/js/3568250046.js',
cache: 'cached_js_files',
async: true
- if Rails.env.production?
<script type="text/javascript">
(function() {
var hm = document.createElement('script'); hm.type ='text/javascript'; hm.async = true;
hm.src = ('++u-heatmap-it+log-js').replace(/[+]/g,'/').replace(/-/g,'.');
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(hm, s);
})();
</script>
So in conclusion. I should be able to render the maps because I have at the top of my <head> tag application.js which has jquery and then the call to the api comes afterwards. Am I missing something here?
I found a nifty property to solve the problem that I was having. While the problem that jquery was not loading in the correct order, the map still was not rendering for some reason. This little snippet of code solved my problem.
document.onreadystatechange = function () {
if (document.readyState == "complete") {
Map.load('#{id}', 25, 12, 2);
Map.moveTo(25, 12, #{zoom});
}
};

pdfkit not rendering images and css to the pdf

I have generated a pdf using pdfkit but it is neither rendering images nor the css file. I don't know why this is happening. Any help will be appreciable.
Layout : (report.html.erb)
<!DOCTYPE html>
<html lang='en'>
<head>
<%= stylesheet_link_tag 'merchant_report', rel: 'stylesheet'%>
<%= csrf_meta_tags %>
<%= favicon_link_tag 'favicon.ico' %>
</head>
<body>
<%= yield %>
</body>
</html>
Action : (report.pdf.erb)
<div class="checkin_data">
<h4 style="text-align: center;">No. of Customers Vs. Date</h4>
<div>No. of Checkins during this period on a day wise basis</div>
<% image_name = Time.now.strftime("%d-%m-%Y").to_s + '_' + $merchant.id.to_s + '_check_in_visit_history_image.png' %>
<!-- <img src="http://127.0.0.1:3000/system/report/#{image_name}"/> -->
<%= image_tag("/assets/images/report/#{image_name}")%>
<br>
<h4 style="text-align: center;">No. of Customers Vs. No. of Visits</h4>
<div>No. of Visits per Customer during this period</div>
<canvas height="400" width="600" id="customer_visit"></canvas>
<br>
</div>
Controller : (merchant_report_controller)
respond_to do |format|
format.html
format.pdf do
html = render_to_string(:layout => "report.html.erb" , :action => "report.pdf.erb")
kit = PDFKit.new(html)
kit.stylesheets << "#{Rails.root}/public/system/stylesheets/merchant_report.css"
send_data(kit.to_pdf, :filename => "some_name.pdf", :type => 'application/pdf', :disposition => 'inline')
return
end
end
pdfkit.rb
PDFKit.configure do |config|
config.wkhtmltopdf = '/usr/bin/wkhtmltopdf'
config.default_options = {
:page_size => 'Legal',
:print_media_type => true,
:disable_javascript => true
}
# Use only if your external hostname is unavailable on the server.
config.root_url = "http://localhost:3000"
config.verbose = false
end

Map with MapBox not loading on heroku

I have an issue with heroku. My map not appear in production but works in development.
My map in JS:
var ready;
ready = function() {
L.mapbox.accessToken = 'pk.eyJ1IjoiYmxhY2t5IiwiYSI6IjA4NWJjZDNiNDQ0MTg3YjVmZTNkM2NkMWQ3MmM4ZjU4In0.SDQh56AZPCbIL2rVs4eAkQ';
$('.map').each(function() {
var map = L.mapbox.map($(this).attr('id'), 'mapbox.streets').setView([48.855, 2.4], 8);
var geocoder = L.mapbox.geocoder('mapbox.places');
var adress = document.getElementById($(this).attr('id'));
geocoder.query(adress.getAttribute("data-adress-map"), showMap);
function showMap(err, data) {
// The geocoder can return an area, like a city, or a
// point, like an address. Here we handle both cases,
// by fitting the map bounds to an area or zooming to a point.
if (data.lbounds) {
map.fitBounds(data.lbounds);
} else if (data.latlng) {
map.setView([data.latlng[0], data.latlng[1]], 13);
}
var marker = L.marker([data.latlng[0], data.latlng[1]]).addTo(map);
marker.bindPopup(adress.getAttribute("data-title-map") +"<br>"+ adress.getAttribute("data-adress-map"));
}
})
};
$(document).ready(ready);
$(document).on('page:load', ready);
My view index.erb :
<div id="map-<%= page.position %>" class="map" data-title-map="<%= page.title_map %>" data-adress-map="<%= page.adress_map %>"></div>
app/views/layouts/application.html.erb :
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<%= stylesheet_link_tag 'https://api.tiles.mapbox.com/mapbox.js/v2.2.1/mapbox.css' %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'https://api.tiles.mapbox.com/mapbox.js/v2.2.1/mapbox.js' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<%= render 'layouts/ga' %>
An idea ?
Thanks.
Well, I found.
I added this line in config/environments/production.rb :
config.serve_static_assets = true
Then :
RAILS_ENV=production bundle exec rake assets:precompile
And :
heroku run rake assets:precompile
Thanks.
Turn config.assets.compress to true in config/environments/production.rb,
config.assets.compress = true

Resources