Using the this button_to helper:
<%= button_to "Add Beer", "/growlers/create", method: "get" %>
yields the following HTML:
<form action="/growlers/create" class="button_to" method="get">
<div>
<input type="submit" value="Add Beer" />
</div>
</form>
Which is exactly what is supposed to happen. However, as you can see, the HTML element is a <form>. I am wondering how to render this as a <button> for styling purposes (using Foundation).
I found this:
<%= link_to "<button>Add Beer</button>".html_safe, "/growlers/create", method: "get" %>
yields this HTML:
<a data-method="get" href="/growlers/create">
<button>Add Beer</button>
</a>
Which, though a <button>, doesn't seem perfect to me.
I am curious if there are any other solutions/workarounds to this issue.
If you wrap your button label in the button_to statement:
<%= button_to "/growlers/create", method: "get" do %>
Add Beer
<% end %>
It will render the wrapped text within a element inside the form.
props to apidock: https://apidock.com/rails/ActionView/Helpers/UrlHelper/button_to
Are you looking for button_tag?
http://api.rubyonrails.org/classes/ActionView/Helpers/FormTagHelper.html#method-i-button_tag
Related
I would like to have an icon as the submit button for my form. Something like:
<%= form.submit do %>
<i class="fas fa-arrow-right fa-2x"></i>
<% end %>
Is having custom html as a form submit possible, if so what is the syntax?
Use html button tag:
<button type="submit" class="btn btn-sm"><i class="fas fa-arrow-right fa-2x"></i></button>
That's it!
I have div element in my view and I want it to trigger ajax call on mouse click (Rails way).
I've read in documentation (see 3.2.2) that you just have to set data attributes and it should work, but its not.
This is not working:
<div class="room" data-remote="true" data-method="get" data-url="<%= url_for([:backend, #restaurant, room]) %>"><%= room.name %></div>
If I'm using link_to function it works perfectly:
<%= link_to 'test link', [:backend, #restaurant, room], remote: true %>
Can't find any solution on the internet... Will be very happy if someone can answer this.
EDIT:
Also this is working correctly:
<input type="checkbox" data-remote="true" data-url="<%= url_for([:backend, #restaurant, room]) %>" />
I have a Rails 5 application using only AngularJS, no jQuery/Turbolinks. Typical submit buttons generated by form helper do not work in this application (go immediately to disabled) without submitting the form, and I've resorted to using button_tags with type="Submit" instead.
If I remove the "name='commit'" atribute from the submit button, it works as expected by submittin the form. I'm wondering if there's something bound to this attribute that I'm not seeing. Below is an example form.
<%= form_for(role) do |f| %>
<div class="field">
<%= f.label :name %>
<%= f.text_field :name %>
</div>
<div class="actions">
<%= f.submit %> <!-- this fails -->
<input type="submit" /> <!-- this works -->
</div>
<% end %>
Before click, the button html looks like this:
<input type="submit" name="commit" value="Update Role" data-disable-with="Update Role">
After click, the button looks like this:
<input type="submit" name="commit" value="Update Role" data-disable-with="Update Role" disabled="disabled" class="disabled">
It's as if Chrome thinks that the form has been submitted, but something has blocked this from happening.
Documentation: Link
<div class="actions">
<%= f.submit "Commit", name: "commit" %>
#or
<input type="submit" name="Commit" />
</div>
As the documentation suggests, this is perfectly fine.
<%= form_for #post do |f| %>
<%= f.submit %>
<% end %>
Rails form_for will transform f.submit to the respective submit button with type as submit. Try restarting the server once and check if the issue persists.
An additional thing is that any button with type as submit inside the rails form will be taken as form submit button.
I'm trying something really simple, inside a link I want there to be text and an image.
= link_to 'NVidia Graphics', inventory_url, class: 'lato' do
= image_tag 'list-highlighter.png'
I'd like the output to be something like:
<a href="/inventory">
NVidia Graphics
<img src="list-highlighter.png" />
</a>
How can I achieve this using Slim? My current code causes the website to crash.
undefined method `stringify_keys' for "http://foobar.com/inventory":String
= link_to inventory_url, class: 'lato' do
| NVidia Graphics
= image_tag 'list-highlighter.png'
I think that should work.. just not 100% about the slim syntax. link_to shouldn't have any content when wrapping something as a block -- that is, it should be immediately followed by its url. All the content inside will be wrapped by the <a> tag output. For non-slim, this would look like
<%= link_to inventory_url, class: 'lato %>
NVidia Graphics
<%= image_tag 'list-highlighter.png' %>
<% end %>
Soluction
= button_to('Add', line_item_path, method: :post , class: "btn btn-warning btn-lg" , params: { param1: 'value1', param2: 'value2' })
Rendered
<form class="button_to" method="post" action="/line_items/17">
<input class="btn btn-warning btn-lg" type="submit" value="Add" />
<input type="hidden" name="authenticity_token" value="Qk2sdfgasdfasdfsfa sdfsfsw==" />
<input type="hidden" name="param1" value="value1" />
<input type="hidden" name="param2" value="value1" />
</form>
http://qiita.com/tomomomo1217/items/a5f790c31670587e2d87
I am working on a search function on RoR that basically just has a cool visual effect when a user clicks the search button.
Here is the code in my view for search.rhtml
<html>
<head>
<title>Tutor</title>
<%= javascript_include_tag :defaults %>
</head>
<body>
<h1></h1>
<%= form_remote_tag :url =>{ :action => :search_results }, :update => "results" %>
<fieldset>
<legend>Tutor Search.</legend>
<label for="searchItField">Keyword Search.</label>
<input class="tfield" type="text" value="FIND YOUR TUTOR HERE" name="searchItField" id="searchItField" />
<span id="Submit_search">
<span id="Submit_search_hover"><input type="submit" id="Submit" value="Search" /></span>
</span>
</fieldset>
</form>
<div id="results">
</div>
</body>
</html>
Here is the search_results.rhtml which is what gets displayed in the results div in search.rhtml
<% for tutors in #tutors %>
<%= tutors.first_name %> <br/>
<% end %>
And finally here is my controller and actions.
class TutorsController < ApplicationController
def search
end
def search_results
#tutors = Tutors.find_by_sql('SELECT * FROM tutors')
end
end
What I want to do is basically create an effect that when the search results are loaded because of the ajax call that it would slide up. I am using jrails. Exactly how this site does it. http://keyonary.com/#/paste
In short, to get you started, you will need to do the following:
use observe_field on the input-field, which retrieves data from a controller-method and will update a certain div with the results
create a corresponding controller-method that will retrieve the items (use your search_results)
create a view for that controller-method that will show the data with the required effects and animation.