with <Ajax on Rails>
S2.3. Bringing Rails into the Picture
complex url_for example:
url_for :only_path => false, :protocol => ‘gopher:// ‘,
:host => ‘example.com’, :controller => ‘chapter2′,
:action => ‘myresponse’, :trailing_slash => true, :foo => ‘bar’,
:anchor => ‘baz’
#=> ‘gopher://example.com/chapter2/myresponse?foo=bar/#baz’
ajax on rails(aor) alert:
<p><%= link_to_remote "Alert with javascript Helper", :url =>
"/chapter2/myresponse", :success => "alert(request.responseText)" %></p>
aor insert:
<p><%= link_to_remote "Update with javascript Helper", :url =>
{:action => "myresponse"}, :update => "response5" %></p>
<p id="response5"></p>
Chapter 3. Introducing Prototype
3.2 Ajax Links
:method => :delete
<%= link_to "Delete", "/people/1", :method => :delete %>
==>
<a href="/people/1"
onclick="var f = document.createElement(‘form’);
f.style.display = ‘none’;
this.parentNode.appendChild(f);
f.method = ‘POST’;
f.action = this.href;
var m = document.createElement(‘input’);
m.setAttribute(‘type’, ‘hidden’);
m.setAttribute(‘name’, ‘_method’);
m.setAttribute(‘value‘, ‘delete’);
f.appendChild(m);
f.submit( );
return false;">Delete</a>
Return false;
<a href="#"
onclick="new Ajax.Updater(‘current_time’, ‘/chapter3/get_time’,
{asynchronous:true, evalScripts:true});
return false;">Check Time</a>
<div id="current_time"></div>
The link will only be followed if the expression evaluates true (or if the user has javascript turned off). That’s why the link_to_remote helper puts return false at the end of the onclick attribute.
Callbacks:
<%= link_to_remote "Check Time",
:update => ‘current_time’,
:url => { :action => ‘get_time’ },
:before => "$(‘indicator’).show( )",
:success => "$(‘current_time’).visualEffect(‘highlight’)",
:failure => "alert(‘There was an error. ‘)",
:complete => "$(‘indicator’).hide( )" %>
<span id="indicator" style="display: none;">Loading…</span>
<div id="current_time"></div>
hide( ) and show( )
for an element to be dynamically shown via javascript, its CSS display: none property must be defined inline
this won’t work:
<style type="text/css">
#indicator { display: none; }
</style>
<div id="indicator">Hidden DIV</div>
<script type="text/javascript">
$("indicator").show( ); // won’t work
</script>
But this will work:
<div id="indicator" style="display: none">Hidden DIV</div>
<script type="text/javascript">
$("indicator").show( ); // will work
</script>
:condition
<li><%= check_box_tag ‘checkbox’ %> Thing #1</li>
<%= link_to_remote "Delete checked items",
:condition => "$(‘checkbox’).checked",
:url => { :action => ‘delete_items’ } %>
:submit
it allows you to simulate a form submission. By providing the ID of a page element, any fields contained in it will be sent along with the request.
<div id="fakeForm">
<input type="text" name="foo" value="bar" />
</div>
<%= link_to_remote "Submit fake form",
:submit => "fakeForm",
:url => { :action => ‘repeat’ },
:complete => "alert(request.responseText)" %>
nested forms
<form id="myForm">
<input type="text" name="text_to_reverse" id="text_to_reverse" />
<%= link_to_remote "Reverse field",
:url => { :action => ‘reverse’ },
:submit => "myForm",
:complete => "$(‘text_to_reverse’).value=request.responseText" %>
<input type="submit" />
</form>
:with
<%= link_to_remote "Link with params",
:url => { :action => ‘repeat’ },
:complete => "alert(request.responseText)",
:with => "’foo=bar’" %>
two sets of quote marks. javascript expression
include references to javascript variables or DOM elements:
<input id="myElement" type="text" value="bar" />
<%= link_to_remote "Link with dynamic params",
:url => { :action => ‘repeat’ },
:complete => "alert(request.responseText)",
:with => "’foo=’+escape($F(‘myElement’))" %>
escape it (so that it can safely be included in a URL query string)
link_to_function
<%= link_to_function "Toggle DIV", "$(‘indicator’).toggle( )" %></p>
toggle( ), which hides and shows elements on the page.
button_to_function
<%= button_to_function "Greet", "alert(‘Hello world!’)" %>
combine with remote_function
<%= button_to_function "Check Time",
remote_function(:update => "current_time",
:url => { :action => ‘get_time’ }) %>
DIY button_to_remote
def button_to_remote(name, options = {})
button_to_function(name, remote_function(options))
end
==>
<%= button_to_remote "Get Time Now",
:update => "current_time",
:url => { :action => ‘get_time’ } %>