• brock
  • Ticketholder
  • Offline
  • Registered: 2009-01-07
  • Posts: 7

Topic: Simple div.hide() not so simple?

I have a helper method:

  def cancel_tag id
    image_tag("cancel.png", :id => id, :alt => "Close Form", :height => 20, :width => 20)
  end

used in a form partial (within a div with id #link_form):

 <%= link_to(cancel_tag('link_form_cancel'), @topic.episode, :remote => true, :class => 'form-cancel') %>

and some js:

 $("form-cancel").bind("click", function(){
  $("#link_form".hide());
  return false;
});

There's some extra in there because I've been trying different ways to do this. But, all I want to do is close the div with the form in it if the user decides not to fill in the form. That's a can-do easy with link_to_function(cancel_tag("link_form_cancel"), "$('#link_form').hide()" and also a can-do easy with a call to the server, but apparently a bridge too far for me with UJS.

All I can get out of it is a call back to the server with a bunch of warnings about link_to_function being depricated.

I've tried putting the js into the asset pipeline, I've tried putting it in the .js.erb that loads the form.

If anyone can spare a moment to edify me :-)

Where do I put the js for client-side functions?
How do I call the function?

Thank you!

Last edited by brock (2012-07-31 11:11:19)

  • brock
  • Ticketholder
  • Offline
  • Registered: 2009-01-07
  • Posts: 7

Re: Simple div.hide() not so simple?

I thought .live() would do this automagically, but I guess not. The problem was the form partial was not loaded when the asset pipepline js was loaded. So the fix:

in the form partial:

 <%= link_to(cancel_tag('link_form_cancel'), @topic.episode, :id => "form-cancel_#{@topic.id}") %>

in the new.js.erb:

 $("#form-cancel_<%= @topic.id %>").click(function() { 
  $("#link_form_<%= @topic.id %>").hide();
  return false;
});
  • Registered: 2012-07-18
  • Posts: 15

Re: Simple div.hide() not so simple?

you have typo here:

$("form-cancel").bind("click", function(){
  $("#link_form".hide());
  return false;
});

should be $(".form-cancel").bind.....

btw if you don't know how .live() (.on() in 1.7+) works, read doc first and then use it.

Last edited by rubytree (2012-08-08 21:53:15)