Bootstrap buttons not applying styles Ruby on Rails - ruby-on-rails

I'm having a situation here with my bootstrap buttons. I cannot get the styling to apply even though the css for the theme itself is working.
Here's my code
<%= button_to 'Sign Up', class: 'btn btn-green' %>
I tried another method, but this one gives me errors since the view isn't generated yet. But, I wanted to do was add html files that I already created for another website to the project. To use them as a view.
<%= button_to("View Web Page", {action: "Web_Page_To_Be_Used"}, class: "btn btn-primary") %>
Please, show me the best method.
UPDATE:
The code below has the best format for the link. The one I used was incomplete. For the placeholder text, you have to create a new route first. And then include it into the button's link.
= link_to 'Register', new_user_registration_path, class: 'btn btn-green btn-md' %>

http://apidock.com/rails/ActionView/Helpers/UrlHelper/button_to
html_options is the third argument of button_to so your second example is closer, you're probably getting an error because action expects a route.
<%= button_to("View Web Page", {action: "show"}, class: "btn btn-primary") %>

Related

RAILS 5: Appending an HTML anchor to rails route path helper

I have a button that directs the user to another page:
<%= link_to "Jacuzzis", applications_path, class: "dropdown-item"%>
At the moment, this will lead the user to my 'applications' page, but there are many applications on this page. So I want to append the 'jacuzzis' id to the path variable so that the browser jumps to that section upon page load.
E.g instead of a GET request to: /applications, it's /applications#jacuzzis
I guess something like <%= link_to "Jacuzzis", (applications_path + '#jacuzzis'), class: "dropdown-item"%>
You can pass the :anchor option to your path helper.
<%= link_to "Jacuzzis", applications_path(anchor: 'jacuzzis'), class: "dropdown-item" %>
Reference: https://github.com/rails/rails/blob/85b533308f5ddcb9a59853bce38a113b66b13faa/actionview/lib/action_view/helpers/url_helper.rb#L172-L175
You can use this in rails way
<%= link_to post_path(#comment.post, anchor: 'some-id'), class: "dropdown-item" %>
Hope this will help
Thanks

Form_tag link to page in another folder

I am integrating 2 rails projects using button to link the first project to the second. Now I have this code
<%= form_tag fast_url_for(' ') do %>
<%= button_to AppConfig.app_clockout %>
<% end %>
and my current directory is
/var/www/html/wizTime/wizProject/Source/project_1
but I don't know how can this redirect to the home page of another project. The directory of my second project that I want to integrate is
/var/www/html/project_2
Please give me ideas. Thank you!
If you only want a link_to and your projects will have domains later, you can just create a link like this in rails:
<%= link_to 'sec project', "http://www.rubyonrails.org/" %> which will create an ordinary html link: <a href=""http://www.rubyonrails.org/" ...>
The form usually should not link to another project?!
If after submitting the form you want to redirect the view to another project, than you can use the controller action and redirect after submit.
As the other commenter said - you can just create a link to the other domain. You should not ever rely on your directory-structure - because when you deploy, that directory structure will very likely be subtly different.
So use the domains instead.
You can even put the domains into environment variables so that you can use different domains (eg localhost:3000 vs localhost:3001) on your development machine. you'd use them like this:
<%= link_to 'My App', ENV['MY_APP_DOMAIN'] %>
<%= link_to 'My Other App', ENV['MY_OTHER_APP_DOMAIN'] %>
Then google for how to set environment variables on your local machine to set the values.
If you want them to be buttons... then you don't need to use a form. button_to creates its own form and is used exactly the same way as a link_to eg:
<%= button_to 'My App', ENV['MY_APP_DOMAIN'] %>
<%= button_to 'My Other App', ENV['MY_OTHER_APP_DOMAIN'] %>
However... you really don't need to use a button-to if you are just doing a GET for a URL like this...
(you use buttons when you need to POST data eg POSTing form data to a create action)
You can just pass in a CSS-class and style the link-to to look as though it were a button.
eg using Bootstrap classes:
<%= link_to 'My App', ENV['MY_APP_DOMAIN'], class: 'btn btn-success' %>
<%= link_to 'My Other App', ENV['MY_OTHER_APP_DOMAIN'], class: 'btn btn-danger' %>
OR similar.

Rails button_to a external link

I have a form with a field of URL generated by users now I want in the show page to get access to thise external URL by clicking in a button in the normal situation where the link have a path i am doing a code like this <%= link_to 'Sign in', new_user_session_path, class: "btn sign-home-btn" %>, but here the links are generated by users and are external
Put the url address in the second argument of the link_to. Like so:
<%= link_to 'External Url', #external_url, class: "btn sign-home-btn" %>
The link_to method just creates the html for a link. The path can be whatever you want it to be.

Bootstrap Popover and Rails

Okay so this question has to do with the proper syntax for html.erb code. What I'm trying to do is use a popover button to display a form. I am able to make a button through the button_tag function, and I am able to make the form from the form_tag function, but I am not able to embed one inside the other. I'm not even entirely sure that this is something I should be doing at all. My understanding was that best practices is to avoid using html when you can use erb to do the work of generating the page.
Anyway, here is the code I have thus far:
<%= button_tag "Remove Friend", :title=>"Remove from Friend List",
:id=>"removeFriend", :class=>"btn btn-default", :rel=>"popover",
:data => {:html=>"true", :placement=>"top", :content=>
"form_tag(\"/friend\", method: \"post\") do
label_tag(:symbolInput, \"Enter Username\")
text_field_tag(:symbolInput)
submit_tag(\"Remove\")
end"}%>
So what this does is generate the following HTML
<button class="btn btn-default" data-content="form_tag("/friend",
method: "post") do
label_tag(:symbolInput, "Enter Username")
text_field_tag(:symbolInput)
submit_tag("Remove")
end" data-html="true" data-placement="top" id="removeFriend"
name="button" rel= "popover" title="Remove from Friend List"
type="submit">Remove Friend</button>
So essentially it just literally copied the erb code as text into the popover.
I have also tried framing each line with <%= %>, but I am very unclear on what the syntax for this would be, or when you should do that.
Basically what needs to happen is that the erb for the form has to be translated to html, which will then be passed to the :content section of the button_tag.
Should I be doing this in this way, or is there some other method to accomplish what I am trying to do? Being new to rails, I'm not sure what the best practices are.
By the way, if I use html to code either the form or the button and erb for the other one, it works perfectly, so there is a work around.
The minute you are inside the Embedded Ruby Tags eg <% %> then everything you do inside here is just ruby or to say it another way must be valid ruby, can be any ruby.
The first refactoring I would do is to move all that content code out own it's own. This halfway point is tidier and should give you a better idea.
<% remove_friend_form = "form_tag(\"/friend\", method: \"post\") do
label_tag(:symbolInput, \"Enter Username\")
text_field_tag(:symbolInput)
submit_tag(\"Remove\") end" %>
<%= button_tag "Remove Friend", :title=>"Remove from Friend List",
:id=>"removeFriend", :class=>"btn btn-default", :rel=>"popover",
:data => {:html=>"true", :placement=>"top", :content=> remove_friend_form }%>
After you isolate the content it becomes more obvious that the 'remove_friend_form' could be isolated even further. To do this move this content into it's own partial.
# create new file in the same folder as the current view.
# _remove_friend_form.html.erb
<%= form_tag("friend", method: "post") do |f| %>
<%= f.label_tag(:symbolInput, "Enter Username") %>
<%= f.text_field_tag(:symbolInput) %>
<%= f.submit_tag("Remove") %>
<% end %>
The main page now looks like this
<%= button_tag "Remove Friend", :title=>"Remove from Friend List",
:id=>"removeFriend", :class=>"btn btn-default", :rel=>"popover",
:data => {:html=>"true", :placement=>"top", :content=> (render partial: 'remove_friend_form') }%>

button with an image?

I am trying to create a button with an image. So basically, I need the button_to version of the code below :|
<%= link_to image_tag(product.image_url, :class => "img"), line_items_path(:product_id => product) %>
This is a pretty old post, but for future reference: since Rails 3.2.1 you can use button_tag instead of button_to, as the first one natively allows images:
Creates a button element that defines a submit button, reset button or a generic button which can be used in JavaScript, for example. You can use the button tag as a regular submit tag but it isn’t supported in legacy browsers. However, the button tag allows richer labels such as images and emphasis, so this helper will also accept a block.
As for your example:
<%= button_tag image_tag(product.image_url), line_items_path(:product_id => product), class: 'img' %>
I didn't test the code, but it should work. It is possible you need to declare the url with url:
This is my solution:
Use a button helper (you can use the button_to helper method):
<%= f.submit 'Save', :class => "button_with_image_save" %>
CSS:
.button_with_image_save {
background: url(../images/icons/page_save.png) #f2efa8 no-repeat 10px 6px;
text-indent:30px;
display:block;
cursor: pointer;
}
You can create a helper as button_to link -
<%= button_to product.image_url, line_items_path(:product_id => product) %>
and in application_helper
def button_to(image_path, link)
link_to (image_tag(image_path, :class => "img"), link)
end
I guess this is what you want.
The short answer is that you need to create a helper method, which is quite simple to do:
Here is a similar SO posting the explains it: Is there a way with rails form helper to produce a button tag for submit
Good luck
Image submit button:
<%= image_submit_tag("team/team1.png", class: 'image-responsive') %>
Link with image:
<%= link_to(image_tag("team/team1.png", class: 'image-responsive'), root_path, :method => :get) %>
Add the image is the folder app/assets/image
In the view
<%= image_submit_tag('nameimage.png') %>
the disadvantage is that you can not change the size with size, but you must have the image of the size you want to appear

Resources