Giter VIP home page Giter VIP logo

feathersui / feathersui-validators Goto Github PK

View Code? Open in Web Editor NEW
2.0 1.0 0.0 270 KB

A port of the form validation classes from Apache Flex (formerly Adobe Flex) to Feathers UI for Haxe and OpenFL

Home Page: https://api.feathersui.com/validators/

License: Apache License 2.0

Haxe 99.39% JavaScript 0.31% HTML 0.30%
adobe-flex apache-flex feathers-ui form-validation form-validator haxe openfl

feathersui-validators's Introduction

Validators for Feathers UI

A port of the form validation classes from Apache Flex (formerly Adobe Flex) to Feathers UI for Haxe and OpenFL.

Includes the following validators:

Minimum Requirements

  • Haxe 4.0
  • OpenFL 8.9.7

Installation

Run the following command in a terminal to install feathersui-validators from Haxelib.

haxelib install feathersui-validators

Project Configuration

After installing the library above, add it to your OpenFL project.xml file:

<haxelib name="feathersui-validators" />

Usage

The following example validates a text input when it loses focus:

var textInput = new TextInput();
addChild(textInput);

var validator = new NumberValidator();
validator.source = textInput;
validator.valueFunction = () -> textInput.text;
validator.triggerEvent = FocusEvent.FOCUS_OUT;
validator.addEventListener(ValidationResultEvent.VALID, event -> {
	textInput.errorString = null;
});
validator.addEventListener(ValidationResultEvent.INVALID, event -> {
	var errorString = "";
	for (validationResult in event.results) {
		if (!validationResult.isError) {
			continue;
		}
		if (errorString.length > 0) {
			errorString += "\n";
		}
		errorString += validationResult.errorMessage;
	}
	textInput.errorString = errorString;
});

The following example validates a form when it is submitted:

var form = new Form();
addChild(form);

var textInput = new TextInput();
var formItem = new FormItem("My Field", textInput);
form.addChild(formItem);

var submitButton = new Button("Submit");
form.addChild(submitButton);
form.submitButton = submitButton;

var validator = new NumberValidator();
validator.source = null;
validator.valueFunction = () -> textInput.text;
// don't trigger automatically
// we'll do it manually when the form is submitted
validator.triggerEvent = null;
validator.addEventListener(ValidationResultEvent.VALID, event -> {
	textInput.errorString = null;
});
validator.addEventListener(ValidationResultEvent.INVALID, event -> {
	var errorString = "";
	for (validationResult in event.results) {
		if (!validationResult.isError) {
			continue;
		}
		if (errorString.length > 0) {
			errorString += "\n";
		}
		errorString += validationResult.errorMessage;
	}
	textInput.errorString = errorString;
});

form.addEventListener(FormEvent.SUBMIT, event -> {
	var hasErrors = false;
	var validators:Array<IValidator> = [validator];
	var events = Validator.validateAll(validators);
	for (event in events) {
		for (validationResult in event.results) {
			if (validationResult.isError) {
				hasErrors = true;
				break;
			}
		}
		if (hasErrors) {
			break;
		}
	}
	if (hasErrors) {
		// some checks were invalid, so don't submit
		return;
	}

	// everything is valid, so now it can be sent to the server
	// using URLLoader or something
});

Documentation

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.