Skip to content
Prototype Based Form Filler that fills a form from a JSON object http://dev.outlandweb.com/form_filler/index.html
JavaScript
Find file
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
README.textile
form_filler.js
form_filler.min.js
index.html

README.textile

Depreciated – See ProFiller

Form Filler

Description

Form Filler is used to autocomplete a form using a JSON obect. It requires the Prototype Javascript Framework version 1.6.1 which can be obtained at http://www.prototypejs.org.

Usage

Form Filler is straight forward. Instantiate the class with the id of the form and use the fill method to populate.


  var filler = new FormFiller('formId');
  filler.fill(jsonObject);

Required ID’s

FormFiller no longer relies on ID’s. You can still use ID’s and they will override the name attribute.

ID’s for the form elements should be the same as the name. This can be an issue for multiselect boxes but FormFiller will handle those fine. Most backends require a name[] to receive an array of values for these elements.

In order to fill checkboxes you need to follow these guidelines. Example checkbox input:


	I have a bike:
	<input id="vehicle::bike" type="checkbox" name="vehicle[]" value="Bike" />
	<br />
	I have a car:
	<input id="vehicle::car" type="checkbox" name="vehicle[]" value="Car" />
	<br />
	I have an airplane:
	<input id="vehicle::airplane" type="checkbox" name="vehicle[]" value="Airplane" />

Notice the id’s contain the name of the input with :: and something to make them unique and keep them valid.

Callbacks

There are two included callbacks

Calback Parameters Description
onStart form triggered when FormFiller#fill is called
onComplete form triggered after the form has been filled

Pass the callbacks in as options during instantiation.


  var filler = new FormFiller('formId', {
    onStart: function(){
      showAjaxLoader();
    },
    onComplete: function(){
      hideAjaxLoader();
    }
  });  
  filler.fill(jsonObject);

Methods

Method Description
FormFiller#fill Used to populate the form with the supplied JSON object
FormFiller#reset Resets the form to the forms original values (uses Prototypes Form#reset)
Something went wrong with that request. Please try again.