Topic: link_to_function is not working

I am trying to use link_to_function to toggle div, but nothing happen.  Not sure what is going on.  I has observe_field() and collection_select with remote_function() in other places in my application to toggle div and they are working fine.   I am not sure why the link_to_function doesn't work.

I put some test code into my home/index.html.erb

<%= link_to_function(image_tag("search.png", :border=>0), "Element.toggle('divnametotoggle')") %>  
<%= link_to_function "Greeting", "alert('Hello world!')" %>
<%= link_to_function("Show me more", nil, :id => "more_link") do |page|
    page[:more_link].replace_html "Show me less"
  end %>

generated code

<a href="#" onclick="Element.toggle('#slider'); return false;"><img alt="Search" border="0" src="/images/search.png.?1300164526"></a>
<a href="#" onclick="alert('Hello world!'); return false;">Greeting</a>
<a href="#" id="more_link" onclick="try {
$(&quot;more_link&quot;).update(&quot;Show me less&quot;);
} catch (e) { alert('RJS error:\n\n' + e.toString()); alert('$(\&quot;more_link\&quot;).update(\&quot;Show me less\&quot;);'); throw e }; return false;">Show me more</a>

The 1st link_to_function with Element.toggle() doesn't even seem to fire up.  Nothing happen.  This is what I really want to use for my application to toggle div when the img is clicked.
The 2nd link_to_function is working fine
The 3rd link_to_function gave me error message that RJS error: Type error: Object #<'object'> has no method 'update'

I am quite confuse by this.  I did include javascript_include_tag :defaults in my layout.  I also has other jquery in included because I am using it for picture slide.

<%= javascript_include_tag :defaults, 'jquery-1.3.2.min', 'jquery.cycle.all.min'  %>

One thing I notice, once I click the link (ones don't work), it add '#' to the URL like "http://localhost:3000/#"

I am new to ROR, please help

Re: link_to_function is not working

Prototype and jQuery are both using the $ as their callers.
But, jQuery provides a jQuery.noConflict function to handle this.

Just modify your javascript includes like this:

<%= javascript_include_tag :defaults, 'jquery-1.3.2.min', 'jquery.cycle.all.min'  %>
<script type="text/javascipt">
  $j = jQuery.noConflict();
</script>

The following script tell you how to use Prototype and jQuery:

// call Prototype
$('some_id').show();

// call jQuery
$j('#some_id').show();
jQuery('#some_id').show();
(function($){
  // in this function, $ is jQuery, not Prototype
  $('#some_id').show();
})(jQuery);

Hope this can help smile

Last edited by hasan.iskandar (2011-03-19 15:49:32)