I've been battling trying to get this working for the last few hours, and I just can't for some reason. I've followed the steps almost exactly as indicated on the github repository link.
I created a new application using all of the following steps:
# rails new demo_app
# cd demo_app/
+++ added gem 'cocoon' to the Gemfile
+++ added //= require cocoon to the application.js file
# rails g scaffold Project name:string description:string
# rails g model Task description:string done:boolean project:belongs_to
+++ added has_many :tasks to the Project model
+++ added :_destroy to the permit in my projects_controller.rb file
# bundle install
Here is my views/projects/_form.html.erb file:
<%= form_for(#project) do |f| %>
<% if #project.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(#project.errors.count, "error") %> prohibited this project from being saved:</h2>
<ul>
<% #project.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="field">
<%= f.label :name %><br>
<%= f.text_field :name %>
</div>
<div class="field">
<%= f.label :description %><br>
<%= f.text_field :description %>
</div>
<%= f.fields_for :tasks do |task| %>
<%= render 'task_fields', :f => task %>
<%= link_to_add_association 'Add task', f, :tasks, class: "links" %>
<% end %>
<div class="actions">
<%= f.submit %>
</div>
<% end %>
Now here's my views/projects/_task_fields.html.erb file:
<div id="nested-fields">
<div class="field">
<%= f.label :description %><br>
<%= f.text_field :description %>
</div>
<div class="field">
<%= f.label :description %><br>
<%= f.text_field :description %>
</div>
<%= link_to_remove_association 'remove task', f %>
</div>
Is this not exactly what the guide mentions? When I go to create a new project, it shows nothing but the default Name label, name text box, description label, description textbox, and the "create project link". Here's the HTML output of the new project form:
<!DOCTYPE html>
<html>
<head>
<title>DemoApp</title>
<link data-turbolinks-track="true" href="/assets/projects.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/scaffolds.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/application.css?body=1" media="all" rel="stylesheet" />
<script data-turbolinks-track="true" src="/assets/jquery.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery_ujs.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/projects.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/cocoon.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/application.js?body=1"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="uIpLnix47UNaBONCR+0SV/uz1uiulU6BHqKe5qENzHQ=" name="csrf-token" />
</head>
<body>
<h1>New project</h1>
<form accept-charset="UTF-8" action="/projects" class="new_project" id="new_project" method="post"><div style="display:none"><input name="utf8" type="hidden" value="✓" /><input name="authenticity_token" type="hidden" value="uIpLnix47UNaBONCR+0SV/uz1uiulU6BHqKe5qENzHQ=" /></div>
<div class="field">
<label for="project_name">Name</label><br>
<input id="project_name" name="project[name]" type="text" />
</div>
<div class="field">
<label for="project_description">Description</label><br>
<input id="project_description" name="project[description]" type="text" />
</div>
<div class="actions">
<input name="commit" type="submit" value="Create Project" />
</div>
</form>
Back
</body>
</html>
Can someone please assist me with this? It looks like I'm doing everything as mentioned in the guide, and I'm not getting anything out of this.
The link_to_add_association should be located outside the fields_for tag, whatever is inside it will be replicated for each task added and you generally only want a link to add at the end, also nothing shows because no task is instantiated, in order to instantiate one you either click the link_to_add_association or instantiate them on the projects form creation, this can be done at the projects controller new action by doing
#projects_controller.rb
def new
#project = Project.new
#projet.tasks.build
end
You can also instantiate multiple tasks on form creation here by doing some loop like
3.times do
#project.tasks.build
end
Related
I am using kaminari to paginate the index pages of some of my models, and it works quite well. I'm using it with the bootstrap4 theme, and while it looks great, it does not resize well on mobile devices. More specifically, I mean that these links don't resize at all (or if they do, it's minimal), and they extend well beyond the screen to the right, which is annoying. I've tried putting these links inside a bootstrap container, but that didn't cause them to properly resize.
How do I resize kaminari pagination for mobile devices?
Here is the relevant view code:
<div class="container">
<h1>All Leagues</h1>
<hr />
<% #leagues.each do |league| %>
<p><%= link_to league.name, league %></p>
<% end %>
<hr />
<div class="container">
<%= paginate #leagues %>
<%= page_entries_info #leagues %>
</div>
</div>
Thank you!
Try with adding this into your section:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
if this doesn't help then try this:
<div class="container">
<div class="row">
<div class="col-xs-12">
<h1>All Leagues</h1>
<hr />
<% #leagues.each do |league| %>
<p><%= link_to league.name, league %></p>
<% end %>
<hr />
<%= paginate #leagues %>
<%= page_entries_info #leagues %>
</div>
</div>
</div>
I'm a junior ruby on rails developer. I developed a web app that uses Google maps javascript API and I use the autocomplete function on a form input.
The autocomplete works fine on localhost but does not work anymore after deploying on heroku.
Here is my html.erb below. For your perfect information, the form is in the page footer. This form is partially hidden and the only visible part corresponds to a button used to upload a video file. Once this button has been clicked and the video file has been chosen, I display a modal containing the rest of the form. That's where the 'text_field_tag' (with the id = "user_input_autocomplete_address") is displayed and where the autocomplete should work.
<% if user_signed_in? %>
<div class="footer-check hidden-md hidden-lg">
<div class="container text-right">
<div class="row">
<div class="flexbox">
<div class="footer-home active">
<%= link_to root_path do %>
<i class="fa fa-home" aria-hidden="true"></i>
<% end %>
</div>
<div class="footer-search">
<!-- later put link_to reviews_path -->
<%= link_to search_path do %>
<i class="fa fa-search" aria-hidden="true"></i>
<% end %>
</div>
<div class="footer-button">
<%= simple_form_for(Review.new) do |f| %>
<div id="add_video_image_btn">
<label for="review_video", class="add_video_image"><%= image_tag "plus.png" %></label>
<%= f.input :video, label: false, input_html: { accept: ".mp4, .mov, .m4v, .wmv, .webm, .avi", class: 'hidden'} %>
<%= f.input :video_cache, as: :hidden, class: "add_video_image file required" %>
</div>
</div>
<div class="footer-likes">
<%= link_to dashboard_users_path do %>
<i class="fa fa-heart" aria-hidden="true"></i>
<% end %>
</div>
<div class="footer-user">
<%= link_to user_path(current_user) do %>
<i class="fa fa-user" aria-hidden="true"></i>
<% end %>
</div>
</div>
</div>
</div>
</div>
<!--Beginning Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">
<div id="add_video_form_step2">
<%= f.error_notification %>
<fieldset class="form-group" style="margin-bottom:0;">
<div class="section">
Place
</div>
<div class="inner-wrap">
<div id="">
<%= text_field_tag :place, nil, class: 'form-control', id: 'user_input_autocomplete_address', placeholder: 'Start typing...', size: 80 %>
</div>
</div>
<div class="section">
Comment
</div>
<div class="inner-wrap">
<%= text_field_tag :comment, nil, class:'form-control', placeholder: 'Food is good but the place is a bit noisy', size: 80 %>
</div>
<div class="inner-wrap" style="padding:15px;">
<div class="emoji-toggle emoji-happy">
<input type="checkbox" id="toggle1" class="toggle" name="review[mood]" value="false">
<div class="emoji"></div>
<label for="toggle1" class="well"></label>
</div>
</div>
<div class="">
<%= f.button :submit, class: "btn btn-primary form-control", id: "click-trigger" %>
</div>
<%= hidden_field_tag :name, id: 'name' %>
<%= hidden_field_tag :street_number, id: 'street_number' %>
<%= hidden_field_tag :route, id: 'route' %>
<%= hidden_field_tag :locality, id: 'locality' %>
<%= hidden_field_tag :administrative_area_level_1, id: 'administrative_area_level_1' %>
<%= hidden_field_tag :postal_code, id: 'category_0' %>
<%= hidden_field_tag :country, id: 'country' %>
<%= hidden_field_tag :formatted_address, id: 'formatted_address' %>
<%= hidden_field_tag :phone_number, id: 'phone_number' %>
<%= hidden_field_tag :website, id: 'website' %>
<%= hidden_field_tag :gplace_id, id: 'gplace_id' %>
<%= hidden_field_tag :category_0, id: 'category_0' %>
<%= hidden_field_tag :category_1, id: 'category_1' %>
<%= hidden_field_tag :category_2, id: 'category_2' %>
<%= hidden_field_tag :category_3, id: 'category_3' %>
<%= hidden_field_tag :category_4, id: 'category_4' %>
<%= hidden_field_tag :category_5, id: 'category_5' %>
<%= hidden_field_tag :hours_open_day_0, id: 'hours_open_day_0' %>
<%= hidden_field_tag :hours_open_day_1, id: 'hours_open_day_1' %>
<%= hidden_field_tag :hours_open_day_2, id: 'hours_open_day_2' %>
<%= hidden_field_tag :hours_open_day_3, id: 'hours_open_day_3' %>
<%= hidden_field_tag :hours_open_day_4, id: 'hours_open_day_4' %>
<%= hidden_field_tag :hours_open_day_5, id: 'hours_open_day_5' %>
<%= hidden_field_tag :hours_open_day_6, id: 'hours_open_day_6' %>
</fieldset>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<% end %>
<% end %>
<!--End Modal -->
<!-- Start of js to display the modal -->
<!-- NB: the autocomplete module is in assets/javascript/autocomplete.js -->
<%= content_for :after_js do %>
<script>
$('#review_video').change(function(){
$('#myModal').modal('show');
});
</script>
<% end %>
<!-- End of js to display the modal -->
The footer (gathering the modal and the form) is called within a layouts/application.html.erb view, which is below. You'll see that I use Google API key in there (hidden in application.yml)
<!DOCTYPE html>
<html>
<head>
<title><%= meta_title %></title>
<%= csrf_meta_tags %>
<!-- Start Favicon -->
<%= favicon_link_tag '_/app/assets/images/favicon.ico' %>
<link rel="manifest" href="/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="<%= image_path 'ms-icon-144x144.png' %>">
<meta name="theme-color" content="#ffffff">
<!-- end Favicon -->
<meta name="description" content="<%= meta_description %>">
<!-- Facebook Open Graph data -->
<meta property="og:title" content="<%= meta_title %>" />
<meta property="og:type" content="website" />
<meta property="og:url" content="<%= request.original_url %>" />
<meta property="og:image" content="<%= meta_image %>" />
<meta property="og:description" content="<%= meta_description %>" />
<meta property="og:site_name" content="<%= meta_title %>" />
<!-- Twitter Card data -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="<%= DEFAULT_META["twitter_account"] %>">
<meta name="twitter:title" content="<%= meta_title %>">
<meta name="twitter:description" content="<%= meta_description %>">
<meta name="twitter:creator" content="<%= DEFAULT_META["twitter_account"] %>">
<meta name="twitter:image:src" content="<%= meta_image %>">
<!-- Google+ Schema.org markup -->
<meta itemprop="name" content="<%= meta_title %>">
<meta itemprop="description" content="<%= meta_description %>">
<meta itemprop="image" content="<%= meta_image %>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
<%= stylesheet_link_tag 'application', media: 'all' %>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!-- start Mixpanel -->
<script type="text/javascript">(function(e,b){if(!b.__SV){var a,f,i,g;window.mixpanel=b;b._i=[];b.init=function(a,e,d){function f(b,h){var a=h.split(".");2==a.length&&(b=b[a[0]],h=a[1]);b[h]=function(){b.push([h].concat(Array.prototype.slice.call(arguments,0)))}}var c=b;"undefined"!==typeof d?c=b[d]=[]:d="mixpanel";c.people=c.people||[];c.toString=function(b){var a="mixpanel";"mixpanel"!==d&&(a+="."+d);b||(a+=" (stub)");return a};c.people.toString=function(){return c.toString(1)+".people (stub)"};i="disable time_event track track_pageview track_links track_forms register register_once alias unregister identify name_tag set_config reset people.set people.set_once people.increment people.append people.union people.track_charge people.clear_charges people.delete_user".split(" ");
for(g=0;g<i.length;g++)f(c,i[g]);b._i.push([a,e,d])};b.__SV=1.2;a=e.createElement("script");a.type="text/javascript";a.async=!0;a.src="undefined"!==typeof MIXPANEL_CUSTOM_LIB_URL?MIXPANEL_CUSTOM_LIB_URL:"file:"===e.location.protocol&&"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js".match(/^\/\//)?"https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js":"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js";f=e.getElementsByTagName("script")[0];f.parentNode.insertBefore(a,f)}})(document,window.mixpanel||[]);
mixpanel.init("ENV['MIXPANEL_TOKEN']");
</script>
<!-- end Mixpanel -->
</head>
<body>
<%= render 'shared/flashes' %>
<%= yield %>
<%= render 'shared/footer' %>
<%= javascript_include_tag "http://maps.google.com/maps/api/js?libraries=places&key=#{ENV['GMAP_BROWSER_KEY']}" %>
<%= javascript_include_tag "http://cdn.rawgit.com/mahnunchik/markerclustererplus/master/dist/markerclusterer.min.js" %>
<%= javascript_include_tag 'application' %>
<%= yield :after_js %>
</body>
</html>
Last, the javascript code allowing the autocomplete on the input (having "user_input_autocomplete_address" as id) is in assets/javascript/autocomplete.js and is the following :
function initializeAutocomplete(id) {
var element = document.getElementById(id);
console.log('coucou');
if (element) {
var autocomplete = new google.maps.places.Autocomplete(element, { types: ['geocode', 'establishment'] });
google.maps.event.addListener(autocomplete, 'place_changed', onPlaceChanged);
}
}
function onPlaceChanged() {
var place = this.getPlace();
console.log(place); // Uncomment this line to view the full object returned by Google API.
for (var i in place.address_components) {
var component = place.address_components[i];
// console.log(component.types);
for (var j in component.types) { // Some types are ["country", "political"]
var type_element = document.getElementById(component.types[j]); // Returns the div with their differents ids or null if the id doesnt exist
// console.log(document.getElementById(component.types[j]));
if (type_element) {
type_element.value = component.long_name;
}
}
}
var formatted_address = document.getElementById('formatted_address');
// console.log(international_phone_number);
if (formatted_address) {
formatted_address.value = place.formatted_address;
}
for (var i in place.types) {
// console.log(place.types);
// console.log(i);
// console.log(place.types[i]);
var type_content = document.getElementById('category_' + i); // Returns the div with their differents ids or null if the id doesnt exist
// console.log(document.getElementById(component.types[j]));
if (type_content) {
console.log(place.types[i]);
type_content.value = place.types[i];
}
}
var international_phone_number = document.getElementById('phone_number');
// console.log(international_phone_number);
if (international_phone_number) {
international_phone_number.value = place.international_phone_number;
}
var name = document.getElementById('name');
if (name) {
name.value = place.name;
}
var gplace_id = document.getElementById('gplace_id');
if (gplace_id) {
gplace_id.value = place.place_id;
}
var website = document.getElementById('website');
if (website) {
website.value = place.website;
}
for (var i in place.opening_hours.weekday_text) {
var hours_open_in_db = place.opening_hours.weekday_text[i];
var hours_open_in_form = document.getElementById('hours_open_day_' + i);
if (hours_open_in_form) {
hours_open_in_form.value = hours_open_in_db;
}
}
}
google.maps.event.addDomListener(window, 'load', function() {
initializeAutocomplete('user_input_autocomplete_address');
});
In order to deploy all this on heroku, I already did the following :
"heroku run db:migrate" in the terminal (because I had some pending
migrations);
"figaro heroku:set -e production" in the terminal, in order to push all my API keys to heroku (I also checked that these keys are indeed in heroku's config vars).
in Google's developer console, within my project and within Google map javascript API, I ensured that my browser key is allowed for both my locahost and my domain name. In order to be very precise, I am using the same key for my locahost and my domain name. Until now, the only thing I have not managed to do yet, in Google's console, is to prove that I own my domain name.
I checked I have not reached any of my API quotas yet.
Within my autocomplete.js file, I used some console.log in order to find out, in my browser's inspector, what parts of the code are working. It seems that everything works except the console.logs that are in the 'OnPlaceChange' callback, since Gmap's autocomplete suggestions are not shown... ;
I know that not seeing the autocomplete suggestions is not a problem of z-index associated to the .pac-container css element, since I already had to fix this and since Gmaps suggestions cannot be reached thanks to my keyboard arrows.
I read this post about geocomplete (geocomplete for rails 4 not working in Heroku) and tried to precompile my assets. That did not lead to any change.
In my browser inspector (in the 'network' section), when I write something in my form input, every new letter pressed on the keyboard triggers a new request. These requests names are 'AutocompletionService.GetPredictions.....'. In the "headers" section, I can see they are https requests to googleapis, with get methods and 200 status code. In the "response" section, I can see there seems to be a error with my API keys since the message is :
/**/_xdc_._ty4oqn && _xdc_._ty4oqn( [3,null,null,"This API project is not authorized to use this API. Please ensure that this API is activated in the APIs Console: https://console.developers.google.com/apis/library?project=_ Please ensure this API is activated in the Google Developers Console: https://console.developers.google.com/apis/api/places_backend?project=_ For more information on authentication and Google Maps Javascript API services please see: https://developers.google.com/maps/documentation/javascript/get-api-key"] )
I followed the link in the error message, leading me to Google's console, and I get back to my project and API keys, which are settled both server-side and browser-side. Once again, the only thing i did not managed to do in Google's console was to prove I own my domain name.
Is this last point the origin of the issue (and in this case I guess I need some help from my hosting services) or do you guys see another mistake?
I has same issue too.
just goto google console, enable the "Google Places API Web Service", then it will solved the problem.
Enable "Google Places API Web Service" on Google API Console. It solved my problem when the website worked on localhost, but don't at Locaweb server.
When I run my test it fails as below:
test Error message:
Failure/Error: page.should have_content 'Email'
Capybara::Ambiguous:
Ambiguous match, found 2 elements matching xpath "/html"
I searched online in how to structure haml file and I think its correct.
Here is My application.html.haml
!!! 5
%html
%head
%title Hello
= stylesheet_link_tag 'application', media: 'all'
= javascript_include_tag 'application'
= csrf_meta_tags
%body
= yield
And here is: new.html.haml
%h1 Sign Up
= render partial: 'form'
And here is my partial form: _form.html.haml
= form_for #user do |f|
- if #user.errors.any?
%div.error_messages
%h2 Form is invalid
%ul
- #user.errors.full_messages.each do |message|
%li= message
= f.label :full_name, 'Full Name:'
= f.text_field :full_name
%br
= f.label :email, 'Email:'
= f.text_field :email
%br
= f.label :password, 'Password:'
= f.text_field :password
%br
= f.label :password_confirmation, 'Confirm Password:'
= f.text_field :password_confirmation
%br
= f.submit 'Sign Up'
As you can see from the view source page, the closing tag is at the top beside the open tag and not at the end of page. Which why Capybara is complaining about.
<!DOCTYPE html>
<html></html>
<head>
<title>Hello</title>
<link href="/assets/application.css?body=1" media="all" rel="stylesheet" />
<script src="/assets/jquery.js?body=1"></script>
<script src="/assets/jquery_ujs.js?body=1"></script>
<script src="/assets/turbolinks.js?body=1"></script>
<script src="/assets/application.js?body=1"></script>
</head>
<body>
<h1>Sign Up</h1>
<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓" /><input name="authenticity_token" type="hidden" value="n6sYrcT+Z7LtaH1AwT6h5/knsdMFRzwDTXAWZh6VyfI=" /></div> <label for="user_full_name">Full Name:</label>
<input id="user_full_name" name="user[full_name]" type="text" />
<br>
<label for="user_email">Email:</label>
<input id="user_email" name="user[email]" type="text" />
<br>
<label for="user_password">Password:</label>
<input id="user_password" name="user[password]" type="text" />
<br>
<label for="user_password_confirmation">Confirm Password:</label>
<input id="user_password_confirmation" name="user[password_confirmation]" type="text" />
<br>
<input name="commit" type="submit" value="Sign Up" />
</form>
</body>
Am I missing anything here?
Everything should be indented after the HAML html tag. This indentation lets HAML know how to nest your tags. Therefore, application.html.haml should be:
!!! 5
%html
%head
%title Hello
= stylesheet_link_tag 'application', media: 'all'
= javascript_include_tag 'application'
= csrf_meta_tags
%body
= yield
You need to indent all the content for the html tag:
!!! 5
%html
%head
%title Hello
= stylesheet_link_tag 'application', media: 'all'
= javascript_include_tag 'application'
= csrf_meta_tags
%body
= yield
What you're doing is different:
!!! 5
%html
%head
...
This is telling haml to render a html tag with no embedded content, followed by a head tag which has embedded content. Indenting everything to be inside the html tag fixes this problem.
Im trying to do a little Restaurant-Website in Ruby on Rails(v. 3.2.13).
I made 3 tables: Customer(Name,Email), Reservation(customer_id,table_id), Table(seats,area).
My Models look like this.
class Reservation < ActiveRecord::Base
belongs_to :customer
belongs_to :table
end
class Customer < ActiveRecord::Base
has_many :reservations
has_many :tables, :through => :reservations
end
class Table < ActiveRecord::Base
has_many :reservations
has_many :customers, :through => :reservations
end
I made a form for searching a suitable table. If the customer finds his table, he clicks a button to book it. This button leads to the "add a new customer" view. The button looks like this:
<%= button_to "Book table #{table.id}" , customers_path(:table_id => table) %>
In the CustomerController, I edited the create method like the following:
def create
#customer = Customer.new(params[:customer])
table = Table.find(params[:table_id])
respond_to do |format|
if #customer.save
format.html { redirect_to #customer, notice: 'Customer was successfully created.' }
format.json { render json: #customer, status: :created, location: #customer }
#reservation = #customer.reservations.build(table: table).save!
else
format.html { render action: "new" }
format.json { render json: #customer.errors, status: :unprocessable_entity }
end
end
end
Sadly the "Table.find" does not work. When I use "Table.first" a Reservation is added, but when I use table like above I get the message: "Couldn't find Table with id=". I can, however, display the ID on the NewCustomer view.
Why is the ID not available in the create method?
EDIT:
Here is the form of the mainpage to search a table. Furthermore I have to say that i made a new resource mainpage for the table-search.
<%= form_tag mainpages_path, :method => 'get' do %>
<p>
How many persons: <br/><%= number_field_tag(:search) %> <br/>
Date: <%= date_select :date, 'Date', use_short_month: true, order: [:day, :month, :year] %> <br/>
Beginn: <%= time_select :Beginn, 'Beginn' , default:Time.now %> <br/>
End : <%= time_select :Ende, 'Ende' , default: Time.now + 2.hours %> <br/>
<%params[:search]%>
<%= submit_tag "Search" %>
</p>
<% end %>
<% if #tables %>
<h2>Folgende Tische stehen zur Auswahl</h1>
<% #tables.each do |table| %>
<div class="entry" >
<h3>Seats: <%= table.seats %></h3>
<h3>Area: <%= table.area %></h3>
<%= link_to "Book this table #{table.id}" , new_customer_path(:table_id => table) %>
</div>
<% end %>
<% else %>
<p> Pls choose a table</p>
<% end %>
EDIT2:
The link to HTML-Code:
Book this table 1
And here is the HTML-Code of the customer/new-view:
<!DOCTYPE html>
<html>
<head>
<title>Restaurant</title>
<link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/customers.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/mainpages.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/reservations.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/scaffolds.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/tables.css?body=1" media="all" rel="stylesheet" type="text/css" />
<script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/customers.js?body=1" type="text/javascript"></script>
<script src="/assets/mainpages.js?body=1" type="text/javascript"></script>
<script src="/assets/reservations.js?body=1" type="text/javascript"></script>
<script src="/assets/tables.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="ej1MgV2fad014SLkCv3dZXl8TknQH4JHZLoe56Xn/Kk=" name="csrf-token" />
</head>
<body>
<h1>New customer</h1>
<form accept-charset="UTF-8" action="/customers" class="new_customer" id="new_customer" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓" /><input name="authenticity_token" type="hidden" value="ej1MgV2fad014SLkCv3dZXl8TknQH4JHZLoe56Xn/Kk=" /></div>
<div class="field">
<label for="customer_name">Name</label><br />
<input id="customer_name" name="customer[name]" size="30" type="text" />
</div>
<div class="field">
<label for="customer_email">Email</label><br />
<input id="customer_email" name="customer[email]" size="30" type="text" />
</div>
<input id="table_id" name="table_id" type="hidden" />
<div class="actions">
<input name="commit" type="submit" value="Create Customer" />
</div>
</form>
Back
</body>
</html>
change in the controller (just add an# symbol)
#table = Table.find(params[:table_id])
in view
<%= button_to "Book table #{table.id}" , customers_path(:table_id => #table) %>
try this out
<%= button_to "Book table #{table.id}" , customers_path(:table_id => table), method: :post %>
The problem here is the use of button_to...
From the Url Helpers documentation:
Generates a form containing a single button that submits to the URL created by the set of options.
The action attribute of the form needs to look similar to this:
/customers/new?table_id=<table_id>
When you click this button it should route to the Customer new action that renders the new view. You need to pass table_id to the new view and then add it to your Customer form. Something like this:
def new
...
#table_id = params[:table_id]
end
Then, when you submit the Customer form - which will route to the create action, you should have access to params[:table_id]
Based on your last bit of code you posted, you need to have:
<%= link_to "Book this table #{table.id}" , customer_path(:table_id => table), mode: :post %>
Hello after 1 million tries I found the mistake! The solution with the hidden_field_tag was partly correct. All the time I tried <%= hidden_field_tag :table_id %> . But with this code the create action knows the variable :table_id but it has an empty string. Now I added params[:table_id] to the hidden_field and now the value of the variable :table_id is availlable.
Long story made short, variable name AND value have to be in the hidden_field_tag!
<%= hidden_field_tag :table_id, params[:table_id] %>
Thanks to everyone who tried helping me!
I am using gmap4rails on jQueryMobile but the map is not showing when I'm doing a redirecting to the page showing the map. The map shows normally when I refresh the map page, but not when I redirect to the page showing the page. Does anyone have an idea why? Thanks! Below is the code
/app/views/items/map.html.erb
<div data-role="header">
<h1>Market</h1>
<%= link_to 'Sell/Buy', new_item_path, "data-icon" => "plus", "class" => "ui-btn-right" %>
<%= link_to 'Back', root_path, "class" => "ui-btn-left" %>
</div>
<div class="center-wrapper">
<div data-role="controlgroup" data-type="horizontal">
List
Map
</div>
</div>
<div data-role="content">
<%= gmaps4rails(#json) %>
</div>
/app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Project</title>
<%= stylesheet_link_tag "application", :media => "all" %>
<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<%= javascript_include_tag "application" %>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<%= csrf_meta_tag %>
</head>
<body>
<div data-role="page">
<%= yield %>
<%= yield :scripts %>
</div>
</body>
</html>
/config/routes.rb
ProjectZ::Application.routes.draw do
...
match '/map', to: 'items#map'
end