Module ActionView::Helpers::PrototypeHelper::JavaScriptGenerator::GeneratorMethods
In: lib/action_view/helpers/prototype_helper.rb

JavaScriptGenerator generates blocks of JavaScript code that allow you to change the content and presentation of multiple DOM elements. Use this in your Ajax response bodies, either in a <script> tag or as plain JavaScript sent with a Content-type of "text/javascript".

Create new instances with PrototypeHelper#update_page or with ActionController::Base#render, then call insert_html, replace_html, remove, show, hide, visual_effect, or any other of the built-in methods on the yielded generator in any order you like to modify the content and appearance of the current page.

Example:

  update_page do |page|
    page.insert_html :bottom, 'list', "<li>#{@item.name}</li>"
    page.visual_effect :highlight, 'list'
    page.hide 'status-indicator', 'cancel-link'
  end

generates the following JavaScript:

  new Insertion.Bottom("list", "<li>Some item</li>");
  new Effect.Highlight("list");
  ["status-indicator", "cancel-link"].each(Element.hide);

Helper methods can be used in conjunction with JavaScriptGenerator. When a helper method is called inside an update block on the page object, that method will also have access to a page object.

Example:

  module ApplicationHelper
    def update_time
      page.replace_html 'time', Time.now.to_s(:db)
      page.visual_effect :highlight, 'time'
    end
  end

  # Controller action
  def poll
    render(:update) { |page| page.update_time }
  end

You can also use PrototypeHelper#update_page_tag instead of PrototypeHelper#update_page to wrap the generated JavaScript in a <script> tag.

Methods

<<   []   alert   assign   call   delay   draggable   drop_receiving   hide   insert_html   literal   redirect_to   remove   replace   replace_html   select   show   sortable   toggle   visual_effect  

Public Instance methods

Writes raw JavaScript to the page.

Returns a element reference by finding it through id in the DOM. This element can then be used for further method calls. Examples:

  page['blank_slate']                  # => $('blank_slate');
  page['blank_slate'].show             # => $('blank_slate').show();
  page['blank_slate'].show('first').up # => $('blank_slate').show('first').up();

Displays an alert dialog with the given message.

Assigns the JavaScript variable the given value.

Calls the JavaScript function, optionally with the given arguments.

If a block is given, the block will be passed to a new JavaScriptGenerator; the resulting JavaScript code will then be wrapped inside function() { … } and passed as the called function‘s final argument.

Executes the content of the block after a delay of seconds. Example:

  page.delay(20) do
    page.visual_effect :fade, 'notice'
  end

Creates a script.aculo.us draggable element. See ActionView::Helpers::ScriptaculousHelper for more information.

Creates a script.aculo.us drop receiving element. See ActionView::Helpers::ScriptaculousHelper for more information.

Hides the visible DOM elements with the given ids.

Inserts HTML at the specified position relative to the DOM element identified by the given id.

position may be one of:

:top:HTML is inserted inside the element, before the element‘s existing content.
:bottom:HTML is inserted inside the element, after the element‘s existing content.
:before:HTML is inserted immediately preceeding the element.
:after:HTML is inserted immediately following the element.

options_for_render may be either a string of HTML to insert, or a hash of options to be passed to ActionView::Base#render. For example:

  # Insert the rendered 'navigation' partial just before the DOM
  # element with ID 'content'.
  insert_html :before, 'content', :partial => 'navigation'

  # Add a list item to the bottom of the <ul> with ID 'list'.
  insert_html :bottom, 'list', '<li>Last item</li>'

Returns an object whose to_json evaluates to code. Use this to pass a literal JavaScript expression as an argument to another JavaScriptGenerator method.

Redirects the browser to the given location, in the same form as url_for.

Removes the DOM elements with the given ids from the page.

Replaces the "outer HTML" (i.e., the entire element, not just its contents) of the DOM element with the given id.

options_for_render may be either a string of HTML to insert, or a hash of options to be passed to ActionView::Base#render. For example:

  # Replace the DOM element having ID 'person-45' with the
  # 'person' partial for the appropriate object.
  replace 'person-45', :partial => 'person', :object => @person

This allows the same partial that is used for the insert_html to be also used for the input to replace without resorting to the use of wrapper elements.

Examples:

  <div id="people">
    <%= render :partial => 'person', :collection => @people %>
  </div>

  # Insert a new person
  page.insert_html :bottom, :partial => 'person', :object => @person

  # Replace an existing person
  page.replace 'person_45', :partial => 'person', :object => @person

Replaces the inner HTML of the DOM element with the given id.

options_for_render may be either a string of HTML to insert, or a hash of options to be passed to ActionView::Base#render. For example:

  # Replace the HTML of the DOM element having ID 'person-45' with the
  # 'person' partial for the appropriate object.
  replace_html 'person-45', :partial => 'person', :object => @person

Returns a collection reference by finding it through a CSS pattern in the DOM. This collection can then be used for further method calls. Examples:

  page.select('p')                      # => $$('p');
  page.select('p.welcome b').first      # => $$('p.welcome b').first();
  page.select('p.welcome b').first.hide # => $$('p.welcome b').first().hide();

You can also use prototype enumerations with the collection. Observe:

  page.select('#items li').each do |value|
    value.hide
  end
  # => $$('#items li').each(function(value) { value.hide(); });

Though you can call the block param anything you want, they are always rendered in the javascript as ‘value, index.’ Other enumerations, like collect() return the last statement:

  page.select('#items li').collect('hidden') do |item|
    item.hide
  end
  # => var hidden = $$('#items li').collect(function(value, index) { return value.hide(); });

Shows hidden DOM elements with the given ids.

Creates a script.aculo.us sortable element. Useful to recreate sortable elements after items get added or deleted. See ActionView::Helpers::ScriptaculousHelper for more information.

Toggles the visibility of the DOM elements with the given ids.

Starts a script.aculo.us visual effect. See ActionView::Helpers::ScriptaculousHelper for more information.

[Validate]