ERPrototaculous

Version 269.1 by Ravi Mendis on 2009/07/17 01:22

Introduction

ERPrototaculous was developed to provide the ajax functionality in ERDivaLook.

What is ERPrototaculous?

Features include:

  • 'Organic' support for Prototype and Scriptaculous in WebObjects.
    • Light-weight dynamic WebObjects elements to support Prototype
    • No custom patches to Prototype
    • Sans custom Prototype extensions
  • Use of Unobtrusive Javascript.
  • Pseudo-stateless ajax responses
  • A set of widgets in the Prototype + Scriptaculous family.

Unobtrusive Javascript in ERPrototaculous

Unobtrusive javascript is used in contrast to on-demand style of ajax programming.
By including Javascript as well as CSS globally in the page wrapper, CSS and Javascript don't have to load inside each and every ajax requests.
This keeps the ajax responses compact and granular.

The result is faster and more reliable ajax in WebObjects.

Prototype WebObjects Elements

Ajax.Updater and Ajax.Request have been implemented as WebObjects dynamic elements.

Ajax.Updater

Support for Prototype's Ajax.Updater is in the form of three components:

  • AjaxUpdaterLink
  • AjaxUpdaterButton
  • AjaxUpdaterForm (with onsubmit for ajax form submission)

These components will update a container on the page.

Ajax.Request

Prototype's Ajax.Request is in the form of:

  • AjaxRequestLink
  • AjaxRequestButton

These are used for strictly background ajax communication.

Prototype + Scriptaculous Widgets

  • Accordion
  • LightWindow
  • ModalBox
  • CalendarDateSelect
  • FileUpload

Forms in ERPrototaculous

Differences from using forms in WebObjects. i.e WOForm:

  1. All form controls must be named. This includes text fields, selects and buttons.
    (WebObjects dynamically assigned names are not compatible with ERPrototaculous).
  2. All forms in an ERPrototaculous app are instances of AjaxUpdaterForm.
  3. Form submits can be the form of a:

    • Static <button>.
    • WOSubmitButton (if the result is to update whole page/app).
    • AjaxUpdaterButton (to update a container). Or
    • AjaxRequestButton (for a background ajax request).

Ajax Page Caching in ERPrototaculous

One notable difference in the ERPrototaculous and Ajax.framework is in the ajax responses.
ERPrototaculous updates and actions break with "The WebObjects Way" by being pseudo-stateless.

Instead of returning a fresh response, an ajax update or action is in fact the same instance.

The reason returning a fresh response is not necessary is because a client never travels back or forwards through an ajax application unlike in a typical WebObjects app.
Here the current state of the update or action is all that is necessary.