Skip to content
Permalink
Browse files

Added validation for required fields

  • Loading branch information...
seb86 committed May 10, 2019
1 parent bf1a228 commit 761f7e9a90973c0972b318d219febb5bc26eb899
Showing with 74 additions and 9 deletions.
  1. +74 −9 assets/js/admin/settings.js
@@ -1,11 +1,13 @@
/* global alnp_settings_params */
( function( $, params ) {
var changed = false,
need_help = $('.need-help').data('tab'),
help_tabs = $('.contextual-help-tabs'),
help_contents = $('.contextual-help-tabs-wrap'),
panel = $('#' + $('#screen-meta-links').find('.show-settings').attr('aria-controls') ),
rtl = params.is_rtl;
var changed = false,
validated = true,
$settings_form = $( 'form' ),
need_help = $('.need-help').data('tab'),
help_tabs = $('.contextual-help-tabs'),
help_contents = $('.contextual-help-tabs-wrap'),
panel = $('#' + $('#screen-meta-links').find('.show-settings').attr('aria-controls') ),
rtl = params.is_rtl;

if ( rtl == 'rtl' ) {
rtl = true;
@@ -60,9 +62,72 @@
}
});

// Clears any warnings previously set
$('.submit :input').click( function() {
changed = false;
// Validate required fields.
$settings_form.on('input validate change', 'input, number, email, textarea, select, checkbox, radio', function(e) {
var $this = $( this ),
required = $this.hasClass( 'required' ),
validate_email = $this.hasClass( 'validate-email' ),
event_type = e.type;

if ( 'input' === event_type ) {
$this.removeClass( 'validated' );
}

if ( 'validate' === event_type || 'change' === event_type ) {

if ( required ) {
if ( 'checkbox' === $this.attr( 'type' ) && ! $this.is( ':checked' ) ) {
$this.removeClass( 'validated' ).addClass( 'invalid invalid-required-field' );
validated = false;
} else if ( $this.val().length == 0 ) {
$this.removeClass( 'validated' ).addClass( 'invalid invalid-required-field' );
validated = false;
}
}

if ( validate_email ) {
if ( $this.val() ) {
var pattern = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i);

if ( ! pattern.test( $this.val() ) ) {
$this.removeClass( 'validated' ).addClass( 'invalid invalid-email' );
validated = false;
}
}
}

if ( validated ) {
$this.removeClass( 'invalid invalid-required-field invalid-email' ).addClass( 'validated' );
}
}
});

// Clears any warnings previously set or warns the user of fields required.
$('.submit :input').click( function(e) {
if ( ! validated ) {
e.preventDefault();

$.confirm({
icon: 'dashicons dashicons-warning',
title: params.i18n_warning,
content: 'There are required settings that need your attention before saving.',
rtl: rtl,
type: 'red',
buttons: {
close: {
keys: ['n', 'esc', 'enter'],
action: function () {
}
},
},
draggable: false,
boxWidth: '500px',
useBootstrap: false,
});

} else {
changed = false;
}
});

// Reset button - If pressed will warn the user that all settings will be reset if they continue.

0 comments on commit 761f7e9

Please sign in to comment.
You can’t perform that action at this time.