I'm trying to submit a form using link_to as follows:
<%= form_for(#post, :url=> '/post/action', :method=> 'post', :html => {:id=>'form_id'} ) do |f| %>
....
<%= link_to 'submit', "/post/action", :onclick=>"document.getElementById('form_id').submit()" %>
....
but it is not posting the form, it is simply redirecting my form to the specified url. Does anyone know how to do this?
You can use:
<%= link_to 'submit', "#", :onclick => "$('#form_id').submit()" %>
if you are using JQuery and a later version of rails.
Above will work but if you have a really long page it will navigate to top of the page because of "#" so if you want to avoid that you can do:
<%= link_to 'submit', "", :onclick => "$('#form_id').submit()" %>
I think both things happen. The browser starts to submit the form, but it also follows the link's href. You can fix it by linking to # instead of /post/action...
...however, I don't recommend doing it. There are a few better approaches:
First, you can use a button instead of a link. You'll have to style it to make it look like a link, but that should not be a problem. It will be better, because it won't break the Principle of Least Surprise (people who read the code expect forms to be submitted with buttons) and you won't need the JavaScript.
If you insist on using a link, you should at least move the JavaScript code from the view to a JavaScript file. Then have this behavior added unobtrusively (although, you won't have a good fallback with the link). Assuming you're using jQuery, it should be as simple as:
$(document).on('click', '[data-submit-form]', function(e) {
e.preventDefault();
$(this).closest('form').submit()
}
Related
I see some issues similar but they seem contrived and mostly for previous versions of Rails.
What is the simplest way to submit a form with an anchor tag (link) instead of the normal button
<%= f.submit 'Search', :class => "button expand"%>
What is the most concise way (best practice) way to change that to a link that submits?
I often use js/jquery to submit forms. It's very useful if the submit button is outside of the form or if there is more than one button that submits the same form.
$(".submit-btn").click(function(event) {
event.preventDefault();
$("#form-id").submit();
});
The event.preventDefault(); prevents the default button/submit behaviour.
Here is a coffeescript example I have used in a rails 4 project:
ready = ->
if $("#form-id").length > 0
$(".submit-btn").click (event) ->
event.preventDefault()
$("#form-id").submit()
$(document).ready ready
$(document).on "page:load", ready
Also note, this way the link can be any type of element - not necessarily a submit button. You do not have to have the submit button inside the form, but if you do the preventDefault will prevent the default form submission behaviour.
Submit
To extend the answers provided already, HTML forms have to be submitted with a submit button.
I'm not sure exactly what special characteristics the submit button has over a link - it essentially calls the submit action, which a link cannot (info):
--
Link
This means if you wish to replace a submit button with a link, you'll essentially have to mimick the submit method in your application. This can be done with JS (JQuery):
#app/assets/javascripts/application.js
$(document).on("click", "#your_link", function(){
$("#form").submit();
});
#app/views/controller/your_view.html.erb
<%= form_tag your_path, id: "form" do %>
<%= link_to "Submit", your_path, id: "your_link" %>
<% end %>
This is so simple:
Then:
<%= f.submit '', :class => "hidden", :id => 'form_submit_button' %>
content_tag(:a, 'Submit', :name => 'submit', :id => 'submit_link')
and in JS:
$(document).ready(function() {
$(document).on("click","#submit_link",function() {
$('#form_submit_button').click();
});
});
I am not sure about exact sytax so there might be some syntax error. Feel free to ask for more help.
As far as I can tell button_to is for submitting a form. Is there something in rails dedicated for buttons that just run some javascript on the client without sending anything to the server?
If you want to run only javascript on client side, you can add plain html button and call some function to run your required javascript, by binding an event to that button. You dont need to use rails code at all.
That has nothing to do with rails but rather HTML.
You can always place normal HTML markup (like a <button> or a <a> on the form and make it trigger some action in JavaScript)
Sample:
<%= form_for(#post) do |f| %>
...
<button id="clicktrigger">Click Me!</button>
<% end %>
Please try this:
you can call javascript function using onclick. It will not submit a form.
<%= submit_tag "Test me!", :type => 'button', :onclick => 'alert("It works!")' %>
This comes from Twitter Bootstrap modal rails delete button not working
How can I pass html code to show in Twitter Bootstrap modal? Here is the link
<%= link_to t('delete'), post, method: :delete, confirm: t('delete_this_question'), 'data-my-message' => raw(post.text), class: 'label' %>
post.text is HTML code. Now it shows link in bad format.
Thanks
I think the problem here is probably your use of "raw". If you use raw html inside your link_to helper it will probably mess up the link's quoting. For example you might get something like this:
world" ...>
And that would mess up your link tag. I'm not sure how the rest of your view fits together but I think you should just be able to drop the 'raw' method:
<%= link_to t('delete'), post, method: :delete, confirm: t('delete_this_question'), 'data-my-message' => post.text, class: 'label' %>
<%= link_to 'New Post', new_post_path %>
This produces link to new_post_path. Previously i used <input type="submit" class="new" name="Addlist" value="Add New" /> which resembled like a button. So how can i make the link look like button in erb?
Just to throw another option out there since I had a scenario where the button_to option didn't work. This looks kind of similar to that.
<%= link_to '<button type="button">New Post</button>'.html_safe, new_post_path %>
What I basically wanted is a button that doesn't turn into a submit, since I have multiple buttons on the page that aren't related to a form, and I really just want it to just go to another page.
Take a look at button_to. In summary it will be simmilar to this:
<%= button_to "New Post", { :action => "new" }, :method => :get %>
Although be aware, this method accepts the :method and :confirm modifiers described in the link_to documentation. If no :method modifier is given, it will default to performing a POST operation. You can also disable the button by passing :disabled => true in html_options. If you are using RESTful routes, you can pass the :method to change the HTTP verb used to submit the form.
#Ryan's answer is good but sadly fails html validation http://validator.w3.org/
error: The element button must not appear as a descendant of the a element.
Why not simply apply a (CSS) class to your link and make it appear as a button.
erb:
<%= link_to "Button Text", new_post_path, class: 'button' %>
produces (valid & semantic) HTML:
<a class="button" href="/post/new">Button Text</a>
which you can then style to look like a button.
Example: http://jsfiddle.net/nelsonic/FQK9M/7/
I have a form which has this text field
<%= f.text_field :content %>
I have a link_to tag to post the value of the text field to an action present in another controller. I need to be able to get the value of the text field and say
<%= link_to 'post', :controller => "a_different_controller", :action => "update", :message => "text field's value" %>
Can you please help me out here?
I tried various options posted on stack overflow. None seem to work.
If you want to POST a value without a html form, you must do this via javascript. You can create a onClick listener for that link, and in the listener grab the value of that text_field and submit the form via javascript.
You can pass the remote and method options on your link_to helper:
<%= link_to 'Post', yourmodel_path, :remote => true, :method => :put %>
That will submit it via ajax. If you don't want that and you just want to use the PUT HTTP verb, you can drop the :remote => true portion.
Note that I'm using the shorthand way of referring to the action you are targeting. If you're not familiar with that, I suggest you run through the Rails Guides…it's pretty core to understanding example code.