Rails 3 submit form with link

Question

How I can submit form with link on correct rails 3 format? Thanks.

<%= form_for @post do |f| %>
<%= f.label :title %><br>
<%= f.text_field :title %>
<p><%= f.submit %></p>
<% end %>

My code sample.

Handbill

Add some code starting can be great – Araucanian

Answer 1

"Correct" is a tricky word in this context ;) . One could ask why you're not just taking a button element and make it look like a link?

Anyways — you can't achieve this with plain HTML (at least not to my knowledge). With a Javascript framework like e.g. jQuery you could simply do something like this:

$('a').click(function(){
    $('form').submit();
    return false;
});

Rails 2.3.x had a link_to_remote helper which let's you specify a :submit parameter (= DOM element's ID, default is the parent form). So you were be able to write:

link_to_remote 'submit', :url => {…}, :submit => "my_form"

But with Rails 3's push to UJS, this helper is gone.

Manteau

Article link is broken/hijacked for ads. – Telegony

Answer 2

For people who came here via Google, I have an improvement on Zequez's answer. Instead of the method that he gives, add this method to the application helper instead:

def link_to_submit(*args, &block)
  link_to_function (block_given? ? capture(&block) : args[0]), "$(this).closest('form').submit()", args.extract_options!
end

Then, as Zequez stated, for simple links you can just do this in your view:

<%= link_to_submit 'Submit Form' %>

...and for more complicated buttons you can pass HTML options and a block to be used inside the link. If you use Twitter Bootstrap, for example, this lets you add CSS classes, formatting and icons:

<%= link_to_submit( class: 'btn btn-primary' ) do %>
  <strong>Submit</strong> the Form <i class="icon-arrow-right"></i>
<% end %>

The JQuery code will work as long as the link is a child of the form (that is, as long as link_to_submit is called from somewhere within the form_for block).

Kill

Well, that's indeed a more solid helper. – Colobus

Yes, well I wouldn't have figured it out without your answer. The jQuery and the existence of link_to_function are all you. – Kill

can this be done on the form object f.submit_link? – Outofdate

Answer 3

You can add the following to the application helper:

def link_to_submit(text)
  link_to_function text, "$(this).closest('form').submit()"
end

Then inside your view files you can just call

link_to_submit 'Submit Form'

And the link must be child of the form.

Colobus

Nice! Didn't even know this existed. – Mehetabel

For people who came here from Google, look below for an improvement I found on this answer. – Kill

Answer 4

With jquery, this one-liner will work fine for a simple form.

<%= link_to t("translate.submit"), "#", class: "make it beautiful", :onclick=>"$('form').submit()" %>

Of course you don't really have to use jquery, just finding the dom element for your form will work fine as well.

<%= link_to t("translate.submit"), "#", class: "make it beautiful", :onclick=>"document.getElementById('your_form_id').submit()" %>

This way you don't use any ajax, just plain form submit.

Parse

I used this approach and it works well. Although, you may want to add a 'return false;' to the end of the :onclick to ensure the link isn't followed. – Hennery

Answer 5

In Rails 3, the link_to_remote helper is gone, but it's replaced with

link_to 'submit me', url_for(@post), {:remote => true, :class => 'submit_me'}

In your case, you likely want your form to do the AJAX, like so:

<%= form_for @post, :remote => true do |f| %>
  <%= f.label :title %><br>
  <%= f.text_field :title %>
  <p><%= f.submit %></p>
<% end %>

With a companion link:

link_to 'submit me', '#', :class => 'submit_me'

Then, in an .js file included in the page body:

$('.submit_me').click(function() {
  $('form').submit();
  return false;
});

The idea is that anything more complicated than turning a link or form into an ajax request should be done with the jQuery callbacks, as listed here:

https://github.com/rails/jquery-ujs/wiki/ajax

And if you want to really get into interactive AJAX requests, go here for a great 2-part article on it.

Descendible