ch.Validation (Class)

Documentation updated on Tue Jun 05 2012, generated by JsDoc Toolkit.

Overview

ch.Validation extends ch.Controls. Validation is a engine for HTML forms elements.

View source on GitHub

Requires

Returns

itself

Configuration

The following options lets you create a customized ch.Validation:

  • conf: Object Object with configuration properties.
  • conf.message: String Validation message.
  • conf.points: String Sets the points where validation-bubble will be positioned.
  • conf.offset: String Sets the offset in pixels that validation-bubble will be displaced from original position determined by points. It's specified by configuration or zero by default: "0 0".
  • conf.context: String It's a reference to position the validation-bubble.

Returns

Properties

element

Reference to a DOM Element. This binding between the component and the HTMLElement, defines context where the component will be executed. Also is usual that this element triggers the component default behavior.

HTMLElement

float

Is the little sign that floats showing the validation message. Is a Float component, so you can change it's content, width or height and change its visibility state.

ch.Floats

(Since 0.10.2

See also: ch.Floats

form

Is the little sign that floats showing the validation message. Is a Float component, so you can change it's content, width or height and change its visibility state.

ch.Form

See also: ch.Form

helper

Is the little sign that floats showing the validation message. Is a Float component, so you can change it's content, width or height and change its visibility state.

ch.Helper

See also: ch.Floats

reference

Deprecated: Used by the helper's positioner to do his magic.

jQuery Object

type

This public property defines the component type. All instances are saved into a 'map', grouped by its type. You can reach for any or all of the components from a specific type with 'ch.instances'.

string

uid

The 'uid' is the Chico's unique instance identifier. Every instance has a different 'uid' property. You can see its value by reading the 'uid' property on any public instance.

number

validator

Is the little sign that floats showing the validation message. Is a Float component, so you can change it's content, width or height and change its visibility state.

ch.Validator

See also: ch.Validator

Methods

and()

Let you keep chaining methods.

Returns

  • jQuery Object
clear()

Clear all active validations.

Returns

  • itself
content(content)

Sets and gets component content. To get the defined content just use the method without arguments, like 'widget.content()'. To define a new content pass an argument to it, like 'widget.content("new content")'. Use a valid URL to get content using AJAX. Use a CSS selector to get content from a DOM Element. Or just use a String with HTML code.

It method borrows ch.Uiobject#content.

Parameters

  • content: string Static content, DOM selector or URL. If argument is empty then will return the content.

Examples

Get the defined content

widget.content();

Set static content

widget.content("Some static content");

Set DOM content

widget.content("#hiddenContent");

Set AJAX content

widget.content("http://chico.com/some/content.html");
disable()

Turn off Validation and Validator engine or an specific condition.

Returns

  • itself

See also:

ch.Validator

enable()

Turn on Validation and Validator engine or an specific condition.

Returns

  • itself

See also:

ch.Validator

hasError()

Run all configured validations.

Returns

  • boolean
isActive()

Turn off Validation and Validator engine or an specific condition.

Returns

  • boolean

See also:

ch.Validator

message()

Sets or gets conditions messages

Returns

  • itself

Examples

Sets a new message

validation.message("required", "New message for required validation");

Gets a message from a condition

validation.message("required");
off(event, handler)

Removes a callback function from specific event.

It method borrows ch.Object#off.

Parameters

  • event Since version 0.7.1: string Event nawidget.
  • handler Since version 0.7.1: function Handler function.

Returns

  • itself

Examples

Will remove event handler to the "ready" event

var startDoingStuff = function () {
    // Some code here!
};

widget.off("ready", startDoingStuff);
on(event, handler)

Add a callback function from specific event.

It method borrows ch.Object#on.

Parameters

  • event Since version 0.7.1: string Event nawidget.
  • handler Since version 0.7.1: function Handler function.

Returns

  • itself

Examples

Will add a event handler to the "ready" event

widget.on("ready", startDoingStuff);
once(event, handler)

Add a callback function from specific event that it will execute once.

It method borrows ch.Object#once.

Parameters

  • event Since version 0.8.0: string Event nawidget.
  • handler Since version 0.8.0: function Handler function.

Returns

  • itself

Examples

Will add a event handler to the "contentLoad" event once

widget.once("contentLoad", startDoingStuff);
position()

Sets or gets positioning configuration. Use it without arguments to get actual configuration. Pass an argument to define a new positioning configuration.

Returns

  • itself

See also:

ch.Uiobject#position

Examples

Change validaton bubble's position.

validation.position({
	  offset: "0 10",
	  points: "lt lb"
});
toggleEnable()

Turn on/off the Validation and Validator engine.

Returns

  • itself

See also:

ch.Validator

validate()

Run all configured validations.

Returns

  • boolean

Events

afterValidate
Triggers when the validation process ends.

Examples

widget.on("afterValidate",function(){
	submitButton.disable();
});
beforeValidate
Triggers before start validation process.

Examples

widget.on("beforeValidate",function(event) {
	submitButton.disable();
});
clear
Triggers when al validations are cleared.

Examples

Title

widget.on("clear",function(){
	submitButton.enable();
});
error
Triggers when an error occurs on the validation process.

Examples

widget.on("error",function(event, condition) {
	if (condition === "required") {
		errorModal.show();
	}
});
ready
Triggers when the component is ready to use.

Examples

Following the first example, using widget as modal's instance controller:

widget.on("ready",function(){
	this.show();
});