Skip to content
gregmoser edited this page Dec 4, 2010 · 9 revisions

#Home

Overview

The FW/1 Ajax adapter is comprised of two files. The main purpose is to allow for a developer to execute a FW/1 action from a form post. Instead of the action being executed with a page request, it is executed via AJAX, and the actions view is updated to reflect any changes. This allows for developers using FW/1 to create rich AJAX enabled views without having to write any JavaScript.

Example

Running the source code unchanged will provide a working example of how the Adapter works

Instructions

There are two files that constitutes the entire adapter:

  • /org/gregmoser/fw1AjaxAdapter.cfc
  • /org/gregmoser/fw1AjaxAdapter.js

To use the adapter you will need to follow these three simple steps:

First, you will first need to include the both the jQuery library, and the fw1AjaxAdapter.js in the head of your html like this:

  <script language="Javascript" type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
  <script language="Javascript" type="text/javascript" src="/org/gregmoser/fw1AjaxAdapter.js"></script>

Second, inside of your view you need to add a standard html form. The only difference is that you will want to include the desired action as a hidden field and add the JavaScript function to the onSubmit attribute as shown below:

onsubmit="return fw1AjaxFormSubmit( this );"

Third, you will want to wrap the view in an html element that has the class set to the action without any period's or colon's. If you were doing this for the main.default action it:

<div class="maindefault">
   *... Form And Other Display Elements Here ...*
</div>

THATS IT! Now you can make your FW/1 application ajax enabled without writing a single line of javascript. It is important to note that if you choose to move the cfc from its standard location, there is a variable at the top of fw1AjaxAdapter.js that will need to be changed.

Clone this wiki locally