jquery hide on rails form submit button click

Question

I have the following form in my rails view:

<%= form_for :search do |f| %>
      <%= f.label :search_by_name %>
      <%= f.text_field :by_name  %>
      <%= f.submit 'Search' %>
<% end %>

In jQuery, I can do something like this:

        $("h1").click(function(){
            $("h1").hide();
        });

That would cause all h1 tags to become invisible upon clicking an h1 tag. How can I instead cause my entire form to become invisible by clicking on the "submit" button for my form above?

EDIT

Perhaps the issue is a little bigger than I'm thinking. When I do this per the answer below:

 $("form").submit(function(){
        $(this).hide();
    })

The form becomes invisible, but then the page is immediately reloaded and the form is visible again. It stays invisible for a split second before reloading the page. Is there a way to carry that affect over from page to page, or to display the form results without reloading the page?

Edit 2

Problem solved. I wrapped the form in a div class and passed that ID into the hide function as mentioned in the comments below, and that seems to work. I don't understand why the page was just realoading and displaying the form when passing in form, but it doesn't have that effect when passing in a id. But, problem solved.

What's the id of the form? Just use that in your hide function. — Kelly J Andrews
– Kelly J Andrews, Commented Dec 22, 2013 at 16:43
You want to lear about ajax, read something about remote forms stackoverflow.com/questions/6723334/… — arieljuod
– arieljuod, Commented Dec 22, 2013 at 16:52

Nitin Jain · Accepted Answer · 2013-12-22 16:42:52Z

1

Try

 $("form").submit(function(){
        $(this).hide();
    })

answered Dec 22, 2013 at 16:42

Nitin Jain

3,0832 gold badges27 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

pcarvalho · Accepted Answer · 2013-12-22 17:21:42Z

0

Seems to me that Ajax is what you want (like @arieljuod said) but if you just wanted to hide the form without passing data to the server you could have prevented the event.

$("form").submit(function(e){
    e.preventDefault();
    $(this).hide();
})

answered Dec 22, 2013 at 17:21

pcarvalho

3061 gold badge3 silver badges5 bronze badges

Collectives™ on Stack Overflow

jquery hide on rails form submit button click

EDIT

Edit 2

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

EDIT

Edit 2

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related