Provides functionality for working with JavaScript in your views.

Ajax, controls and visual effects

Including the JavaScript libraries into your pages

Rails includes the Prototype JavaScript framework and the Scriptaculous JavaScript controls and visual effects library. If you wish to use these libraries and their helpers (ActionView::Helpers::PrototypeHelper and ActionView::Helpers::ScriptaculousHelper), you must do one of the following:

  • Use <%= javascript_include_tag :defaults %>in the HEAD section of your page (recommended): This function will return references to the JavaScript files created by the railscommand in your public/javascriptsdirectory. Using it is recommended as the browser can then cache the libraries instead of fetching all the functions anew on every request.

  • Use <%= javascript_include_tag 'prototype' %>: As above, but will only include the Prototype core library, which means you are able to use all basic AJAX functionality. For the Scriptaculous-based JavaScript helpers, like visual effects, autocompletion, drag and drop and so on, you should use the method described above.

For documentation on javascript_include_tagsee ActionView::Helpers::AssetTagHelper.

Methods
A
B
E
J
L
O
Included Modules
Constants
JAVASCRIPT_PATH = File.join(File.dirname(__FILE__), 'javascripts')
 
JS_ESCAPE_MAP = { '\\' => '\\\\', '</' => '<\/', "\r\n" => '\n', "\n" => '\n', "\r" => '\n', '"' => '\\"', "'" => "\\'" }
 
Instance Public methods
button_to_function(name, *args, &block)

Returns a button with the given nametext that'll trigger a JavaScript functionusing the onclick handler.

The first argument nameis used as the button's value or display text.

The next arguments are optional and may include the javascript function definition and a hash of html_options.

The functionargument can be omitted in favor of an update_pageblock, which evaluates to a string when the template is rendered (instead of making an Ajax request first).

The html_optionswill accept a hash of html attributes for the link tag. Some examples are :class => “nav_button”, :id => “articles_nav_button”

Note: if you choose to specify the javascript function in a block, but would like to pass html_options, set the functionparameter to nil

Examples:

button_to_function "Greeting", "alert('Hello world!')"
button_to_function "Delete", "if (confirm('Really?')) do_delete()"
button_to_function "Details" do |page|
  page[:details].visual_effect :toggle_slide
end
button_to_function "Details", :class => "details_button" do |page|
  page[:details].visual_effect :toggle_slide
end
# File actionpack/lib/action_view/helpers/javascript_helper.rb, line 122
def button_to_function(name, *args, &block)
  html_options = args.extract_options!.symbolize_keys
  function = block_given? ? update_page(&block) : args[0] || ''
  onclick = "#{"#{html_options[:onclick]}; " if html_options[:onclick]}#{function};"
  tag(:input, html_options.merge(:type => 'button', :value => name, :onclick => onclick))
end
escape_javascript(javascript)

Escape carrier returns and single and double quotes for JavaScript segments.

# File actionpack/lib/action_view/helpers/javascript_helper.rb, line 141
def escape_javascript(javascript)
  if javascript
    javascript.gsub(/(\|<\/|\r\n|[\n\r"'])/) { JS_ESCAPE_MAP[$1] }
  else
    ''
  end
end
javascript_tag(content_or_options_with_block = nil, html_options = {}, &block)

Returns a JavaScript tag with the contentinside. Example:

javascript_tag "alert('All is good')"

Returns:

<script type="text/javascript">
//<![CDATA[
alert('All is good')
//]]>
</script>

html_optionsmay be a hash of attributes for the <script> tag. Example:

javascript_tag "alert('All is good')", :defer => 'defer'
# => <script defer="defer" type="text/javascript">alert('All is good')</script>

Instead of passing the content as an argument, you can also use a block in which case, you pass your html_optionsas the first parameter.

<% javascript_tag :defer => 'defer' do -%>
  alert('All is good')
<% end -%>
# File actionpack/lib/action_view/helpers/javascript_helper.rb, line 168
def javascript_tag(content_or_options_with_block = nil, html_options = {}, &block)
  content =
    if block_given?
      html_options = content_or_options_with_block if content_or_options_with_block.is_a?(Hash)
      capture(&block)
    else
      content_or_options_with_block
    end
  tag = content_tag(:script, javascript_cdata_section(content), html_options.merge(:type => Mime::JS))
  if block_called_from_erb?(block)
    concat(tag)
  else
    tag
  end
end

Returns a link of the given namethat will trigger a JavaScript functionusing the onclick handler and return false after the fact.

The first argument nameis used as the link text.

The next arguments are optional and may include the javascript function definition and a hash of html_options.

The functionargument can be omitted in favor of an update_pageblock, which evaluates to a string when the template is rendered (instead of making an Ajax request first).

The html_optionswill accept a hash of html attributes for the link tag. Some examples are :class => “nav_button”, :id => “articles_nav_button”

Note: if you choose to specify the javascript function in a block, but would like to pass html_options, set the functionparameter to nil

Examples:

link_to_function "Greeting", "alert('Hello world!')"
  Produces:
    <a onclick="alert('Hello world!'); return false;" href="#">Greeting</a>
link_to_function(image_tag("delete"), "if (confirm('Really?')) do_delete()")
  Produces:
    <a onclick="if (confirm('Really?')) do_delete(); return false;" href="#">
      <img src="/mages/delete.png?" alt="Delete"/>
    </a>
link_to_function("Show me more", nil, :id => "more_link") do |page|
  page[:details].visual_effect  :toggle_blind
  page[:more_link].replace_html "Show me less"
end
  Produces:
    <a href="#" id="more_link" onclick="try {
      $(&quot;details&quot;).visualEffect(&quot;toggle_blind&quot;);
      $(&quot;more_link&quot;).update(&quot;Show me less&quot;);
    }
    catch (e) {
      alert('RJS error:\n\n' + e.toString());
      alert('$(\&quot;details\&quot;).visualEffect(\&quot;toggle_blind\&quot;);
      \n$(\&quot;more_link\&quot;).update(\&quot;Show me less\&quot;);');
      throw e
    };
    return false;">Show me more</a>
Instance Protected methods
array_or_string_for_javascript(option)
# File actionpack/lib/action_view/helpers/javascript_helper.rb, line 199
def array_or_string_for_javascript(option)
  if option.kind_of?(Array)
    "['#{option.join('\',\'')}']"
  elsif !option.nil?
    "'#{option}'"
  end
end
options_for_javascript(options)
# File actionpack/lib/action_view/helpers/javascript_helper.rb, line 191
def options_for_javascript(options)
  if options.empty?
    '{}'
  else
    "{#{options.keys.map { |k| "#{k}:#{options[k]}" }.sort.join(', ')}}"
  end
end