compose-form-up - npm Package Compare versions

Comparing version 1.5.0 to 1.6.0

index.js

		@@ -7,4 +7,5 @@ var validation = require( './lib/validation' )
		validate: validation.validate,
		invalidateField: validation.invalidateField,
		next: progressive.next,

		}

lib/validation.js

		@@ -130,3 +130,3 @@ // Dependencies
		// Does input value == invalid value? (case insensitive)
		var regexp = new RegExp('^'+input.dataset.invalidValue+'$', 'i')
		var regexp = escapedRegex( input.dataset.invalidValue, 'i' )

		@@ -151,2 +151,7 @@ if ( input.value.match( regexp ) ) {

		function escapedRegex( input, options ) {
		var str = input.replace(/[-\/\\^$*+?.()\|[\]{}]/g, '\\$&')
		return new RegExp( "^" + str + '$', options )
		}

		function checkLength ( input ) {
		@@ -213,2 +218,10 @@ return checkCount( input, 'min' )

		function invalidateField ( el, message ) {
		if ( el && el.value ) {
		el.dataset.invalidValue = el.value
		if ( message )
		el.dataset.invalidValueMessage = message
		}
		}

		function hideMessage ( el ) {
		@@ -240,3 +253,4 @@
		module.exports = {
		validate: validateForm
		validate: validateForm,
		invalidateField: invalidateField
		}

package.json

		{
		"name": "compose-form-up",
		"version": "1.5.0",
		"version": "1.6.0",
		"description": "A lightweight HTML5 form validation utility",
		@@ -5,0 +5,0 @@ "main": "index.js",

README.md

		@@ -90,2 +90,4 @@ # FormUp

		### Styling fieldsets

		To help with styling form steps (with transitions) these classnames are added to fieldsets to show state.
		@@ -146,4 +148,10 @@

		Here's an example of the HTML for a form with navigation
		To add navigation to your progressive form, add `data-nav=true` to the form element.

		Note: Users cannot use the navigation to advance forward through fieldsets witout submitting the forms.
		This navigation exists to allow users to revisit any fieldset and update its information. Users can navigate to any fieldset
		which has been filled out and submitted, or navigate back to the current step.

		Here's an example a form with navigation

		```html
		@@ -165,4 +173,6 @@ <form id="some-form" class="progressive" data-nav='true'>

		This will generate navigation with this HTML
		Each fieldset can set the title for the navigation with the `data-nav` element.

		This will generate navigation with this HTML:

		```
		@@ -175,2 +185,4 @@ <nav class='progressive-form-nav'>

		### Styling nav items

		Nav items will receive classes based on their state. You can use these to style them appropriately.
		@@ -177,0 +189,0 @@

test/test.js

		@@ -41,10 +41,13 @@ var assert = require( 'chai' ).assert,

		var input = utils.addInput( fieldsetOne, { 'data-invalid-value': 'nope@nope.com' })
		var input = utils.addInput( fieldsetOne )

		setValue( input, 'nope@nope.com' )
		formUp.invalidateField( input )


		formUp.validate( form )
		isInvalid( input )
		formUp.validate( form )
		assert.equal( input.parentNode.textContent, "Value 'nope@nope.com' is not permitted" )

		input.dataset.invalidValueMessage = 'Email address already registered'
		formUp.invalidateField( input, 'Email address already registered' )
		formUp.validate( form )
		@@ -51,0 +54,0 @@ assert.equal( input.parentNode.textContent, "Email address already registered" )

New alerts