Form

RightJS inherits forms from the common Element unit, which means you can do everything you can do with any other element plus several additional features which make the work with forms a lot easier

Ajax handling

To submit your form via an Xhr request just call the send method.

$('some-form').send();

This will handle everything automatically, grab the request method, URL, options and so on. If your form contains files to upload, it will be nicely handled by an iframed request in just the same way. You don’t need to worry about anything.

You can also mark the form as a remote one. When it gets submitted the form will go via a Xhr request automatically.

$('some-form').remotize();

You can specify any standard Xhr options as well.

$('some-form').send({
onSuccess: function(r) {
$('notices').update(r.responseText);
}
});

If your form has an element with the CSS class spinner, it will be automatically used as a spinner for your form submission. You don’t need to define it explicitly.

Methods

include, initialize, blur, cancelXhr, disable, elements, enable, focus, input, inputs, remotize, reset, send, serialize, submit, unremotize, values

top ↑include

include(Object methods[, boolean dont_rewrite])

Description

Registers additional methods for the Form elements.

Example

Form.include({
myMethod: function() {....}
});

$('my_form').myMethod();

top ↑initialize

initialize([Object options])

Description

Basic constructor which receives all the common Element unit options plus a boolean one named remote which tells whether you want the form to be submitted via a Xhr request by default.

Example

var form = new Form({
method: 'post',
action: 'some/action'
});

top ↑blur

blur() -> Form self

Description

Looses focus on every element of the form.

Example

$('form').blur();

top ↑cancelXhr

cancelXhr() -> Form self

Description

Cancels the currently running Xhr request started with the send method

Example

$('form').send();
$('form').cancelXhr();

top ↑disable

disable() -> Form self

Description

Disables every visible element of the form.

Example

$('form').disable();

top ↑elements

elements() -> Array of elements

Description

Returns the form elements list in an array.

Example

var form_elements = $('form').elements();

top ↑enable

enable() -> Form self

Description

Enables all disabled elements of the form.

Example

$('form').enable();

top ↑focus

focus() -> Form self

Description

Tries to put the focus on the first visible and not disabled input element of the form.

Example

$('form').focus();

top ↑input

input(String name) -> Input with that name

Description

Returns a wrapped input field by it’s name attribute

Example

$('form').input('username');
$('form').input('password');

top ↑inputs

inputs() -> Array of elements

Description

Returns a list of all the form input elements except the buttons.

Example

$('form').inputs();

top ↑remotize

remotize([Object options]) -> Form self

Description

Marks the form to be automatically send via a Xhr request when submitted. Optionally presets any standard Xhr object options.

Example

$('form').remotize({spinner: $('some-image')});

$('form').submit(); // the form goes remotely

top ↑reset

reset() -> Form self

Description

A tunnel for the native reset method

Example

$('form').reset();

top ↑send

send([Object options]) -> Form self

Description

Remotely submits the form via a Xhr request. The argument may contain any standard Xhr object options.

NOTE: Works with file uploads too!

Example

$('form').send();

$('form').send({
spinner: $('spinner'),
onComplete: call_the_function
});

top ↑serialize

serialize() -> String

Description

Collects all the values of the form and serializes them into a single URL query string.

Example

$('form').serialize();

top ↑submit

submit() -> Form self

Description

Just a tunnel for the native submit method

Example

$('form').submit();

top ↑unremotize

unremotize() -> Form self

Description

Undoes the remotize method changes.

Example

$('form').remotize();
$('form').unremotize();

$('form').submit(); // the form goes via usual HTTP request

top ↑values

values() -> Object

Description

Returns a name->value hash of all form values.

Example

$('form').values();