<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Module: ActionView::Helpers::JavaScriptHelper</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<link rel="stylesheet" href="../../.././rdoc-style.css" type="text/css" media="screen" />
<script type="text/javascript">
// <![CDATA[
function popupCode( url ) {
window.open(url, "Code", "resizable=yes,scrollbars=yes,toolbar=no,status=no,height=150,width=400")
}
function toggleCode( id ) {
if ( document.getElementById )
elem = document.getElementById( id );
else if ( document.all )
elem = eval( "document.all." + id );
else
return false;
elemStyle = elem.style;
if ( elemStyle.display != "block" ) {
elemStyle.display = "block"
} else {
elemStyle.display = "none"
}
return true;
}
// Make codeblocks hidden by default
document.writeln( "<style type=\"text/css\">div.method-source-code { display: none }</style>" )
// ]]>
</script>
</head>
<body>
<div id="classHeader">
<table class="header-table">
<tr class="top-aligned-row">
<td><strong>Module</strong></td>
<td class="class-name-in-header">ActionView::Helpers::JavaScriptHelper</td>
</tr>
<tr class="top-aligned-row">
<td><strong>In:</strong></td>
<td>
<a href="../../../files/lib/action_view/helpers/javascript_helper_rb.html">
lib/action_view/helpers/javascript_helper.rb
</a>
<br />
</td>
</tr>
</table>
</div>
<!-- banner header -->
<div id="bodyContent">
<div id="contextContent">
<div id="description">
<p>
Provides functionality for working with JavaScript in your views.
</p>
<h2>Ajax, controls and visual effects</h2>
<ul>
<li>For information on using Ajax, see <a
href="PrototypeHelper.html">ActionView::Helpers::PrototypeHelper</a>.
</li>
<li>For information on using controls and visual effects, see <a
href="ScriptaculousHelper.html">ActionView::Helpers::ScriptaculousHelper</a>.
</li>
</ul>
<h2>Including the JavaScript libraries into your pages</h2>
<p>
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 (<a
href="PrototypeHelper.html">ActionView::Helpers::PrototypeHelper</a> and <a
href="ScriptaculousHelper.html">ActionView::Helpers::ScriptaculousHelper</a>),
you must do one of the following:
</p>
<ul>
<li>Use <tt><%= javascript_include_tag :defaults %></tt> in the HEAD
section of your page (recommended): This function will return references to
the JavaScript files created by the <tt>rails</tt> command in your
<tt>public/javascripts</tt> directory. Using it is recommended as the
browser can then cache the libraries instead of fetching all the functions
anew on every request.
</li>
<li>Use <tt><%= javascript_include_tag ‘prototype’ %></tt>:
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.
</li>
</ul>
<p>
For documentation on <tt>javascript_include_tag</tt> see <a
href="AssetTagHelper.html">ActionView::Helpers::AssetTagHelper</a>.
</p>
</div>
</div>
<div id="method-list">
<h3 class="section-bar">Methods</h3>
<div class="name-list">
<a href="#M000516">array_or_string_for_javascript</a>
<a href="#M000512">button_to_function</a>
<a href="#M000513">escape_javascript</a>
<a href="#M000514">javascript_tag</a>
<a href="#M000511">link_to_function</a>
<a href="#M000515">options_for_javascript</a>
</div>
</div>
</div>
<!-- if includes -->
<div id="includes">
<h3 class="section-bar">Included Modules</h3>
<div id="includes-list">
<span class="include-name"><a href="PrototypeHelper.html">PrototypeHelper</a></span>
</div>
</div>
<div id="section">
<div id="constants-list">
<h3 class="section-bar">Constants</h3>
<div class="name-list">
<table summary="Constants">
<tr class="top-aligned-row context-row">
<td class="context-item-name">JAVASCRIPT_PATH</td>
<td>=</td>
<td class="context-item-value">File.join(File.dirname(__FILE__), 'javascripts')</td>
</tr>
<tr class="top-aligned-row context-row">
<td class="context-item-name">JS_ESCAPE_MAP</td>
<td>=</td>
<td class="context-item-value">{ '\\' => '\\\\', '</' => '<\/', "\r\n" => '\n', "\n" => '\n', "\r" => '\n', '"' => '\\"', "'" => "\\'" }</td>
</tr>
</table>
</div>
</div>
<!-- if method_list -->
<div id="methods">
<h3 class="section-bar">Public Instance methods</h3>
<div id="method-M000512" class="method-detail">
<a name="M000512"></a>
<div class="method-heading">
<a href="JavaScriptHelper.src/M000512.html" target="Code" class="method-signature"
onclick="popupCode('JavaScriptHelper.src/M000512.html');return false;">
<span class="method-name">button_to_function</span><span class="method-args">(name, *args, &block)</span>
</a>
</div>
<div class="method-description">
<p>
Returns a button with the given <tt>name</tt> text that‘ll trigger a
JavaScript <tt>function</tt> using the onclick handler.
</p>
<p>
The first argument <tt>name</tt> is used as the button‘s value or
display text.
</p>
<p>
The next arguments are optional and may include the javascript function
definition and a hash of html_options.
</p>
<p>
The <tt>function</tt> argument can be omitted in favor of an
<tt>update_page</tt> block, which evaluates to a string when the template
is rendered (instead of making an Ajax request first).
</p>
<p>
The <tt>html_options</tt> will accept a hash of html attributes for the
link tag. Some examples are :class => "nav_button", :id =>
"articles_nav_button"
</p>
<p>
Note: if you choose to specify the javascript function in a block, but
would like to pass html_options, set the <tt>function</tt> parameter to nil
</p>
<p>
Examples:
</p>
<pre>
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
</pre>
</div>
</div>
<div id="method-M000513" class="method-detail">
<a name="M000513"></a>
<div class="method-heading">
<a href="JavaScriptHelper.src/M000513.html" target="Code" class="method-signature"
onclick="popupCode('JavaScriptHelper.src/M000513.html');return false;">
<span class="method-name">escape_javascript</span><span class="method-args">(javascript)</span>
</a>
</div>
<div class="method-description">
<p>
Escape carrier returns and single and double quotes for JavaScript
segments.
</p>
</div>
</div>
<div id="method-M000514" class="method-detail">
<a name="M000514"></a>
<div class="method-heading">
<a href="JavaScriptHelper.src/M000514.html" target="Code" class="method-signature"
onclick="popupCode('JavaScriptHelper.src/M000514.html');return false;">
<span class="method-name">javascript_tag</span><span class="method-args">(content_or_options_with_block = nil, html_options = {}, &block)</span>
</a>
</div>
<div class="method-description">
<p>
Returns a JavaScript tag with the <tt>content</tt> inside. Example:
</p>
<pre>
javascript_tag "alert('All is good')"
</pre>
<p>
Returns:
</p>
<pre>
<script type="text/javascript">
//<![CDATA[
alert('All is good')
//]]>
</script>
</pre>
<p>
<tt>html_options</tt> may be a hash of attributes for the <script>
tag. Example:
</p>
<pre>
javascript_tag "alert('All is good')", :defer => 'defer'
# => <script defer="defer" type="text/javascript">alert('All is good')</script>
</pre>
<p>
Instead of passing the content as an argument, you can also use a block in
which case, you pass your <tt>html_options</tt> as the first parameter.
</p>
<pre>
<% javascript_tag :defer => 'defer' do -%>
alert('All is good')
<% end -%>
</pre>
</div>
</div>
<div id="method-M000511" class="method-detail">
<a name="M000511"></a>
<div class="method-heading">
<a href="JavaScriptHelper.src/M000511.html" target="Code" class="method-signature"
onclick="popupCode('JavaScriptHelper.src/M000511.html');return false;">
<span class="method-name">link_to_function</span><span class="method-args">(name, *args, &block)</span>
</a>
</div>
<div class="method-description">
<p>
Returns a link of the given <tt>name</tt> that will trigger a JavaScript
<tt>function</tt> using the onclick handler and return false after the
fact.
</p>
<p>
The first argument <tt>name</tt> is used as the link text.
</p>
<p>
The next arguments are optional and may include the javascript function
definition and a hash of html_options.
</p>
<p>
The <tt>function</tt> argument can be omitted in favor of an
<tt>update_page</tt> block, which evaluates to a string when the template
is rendered (instead of making an Ajax request first).
</p>
<p>
The <tt>html_options</tt> will accept a hash of html attributes for the
link tag. Some examples are :class => "nav_button", :id =>
"articles_nav_button"
</p>
<p>
Note: if you choose to specify the javascript function in a block, but
would like to pass html_options, set the <tt>function</tt> parameter to nil
</p>
<p>
Examples:
</p>
<pre>
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="/images/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>
</pre>
</div>
</div>
<h3 class="section-bar">Protected Instance methods</h3>
<div id="method-M000516" class="method-detail">
<a name="M000516"></a>
<div class="method-heading">
<a href="JavaScriptHelper.src/M000516.html" target="Code" class="method-signature"
onclick="popupCode('JavaScriptHelper.src/M000516.html');return false;">
<span class="method-name">array_or_string_for_javascript</span><span class="method-args">(option)</span>
</a>
</div>
<div class="method-description">
</div>
</div>
<div id="method-M000515" class="method-detail">
<a name="M000515"></a>
<div class="method-heading">
<a href="JavaScriptHelper.src/M000515.html" target="Code" class="method-signature"
onclick="popupCode('JavaScriptHelper.src/M000515.html');return false;">
<span class="method-name">options_for_javascript</span><span class="method-args">(options)</span>
</a>
</div>
<div class="method-description">
</div>
</div>
</div>
</div>
<div id="validator-badges">
<p><small><a href="http://validator.w3.org/check/referer">[Validate]</a></small></p>
</div>
</body>
</html>
distrib
>
Mandriva
>
2010.0
>
i586
>
media
>
contrib-release
>
by-pkgid
>
8b99df826c3b6cf56a1caaae5f931d50
>
files
>
813
