|
|
@ -40,18 +40,19 @@ $.fn.form = function(fields, parameters) { |
|
|
|
$allModules |
|
|
|
.each(function() { |
|
|
|
var |
|
|
|
$module = $(this), |
|
|
|
$field = $(this).find(selector.field), |
|
|
|
$group = $(this).find(selector.group), |
|
|
|
$message = $(this).find(selector.message), |
|
|
|
$prompt = $(this).find(selector.prompt), |
|
|
|
$submit = $(this).find(selector.submit), |
|
|
|
|
|
|
|
formErrors = [], |
|
|
|
keyStuckDown = false, |
|
|
|
|
|
|
|
element = this, |
|
|
|
instance = $module.data(moduleNamespace), |
|
|
|
$module = $(this), |
|
|
|
$field = $(this).find(selector.field), |
|
|
|
$group = $(this).find(selector.group), |
|
|
|
$message = $(this).find(selector.message), |
|
|
|
$prompt = $(this).find(selector.prompt), |
|
|
|
$submit = $(this).find(selector.submit), |
|
|
|
$reset = $(this).find(selector.reset), |
|
|
|
|
|
|
|
formErrors = [], |
|
|
|
keyHeldDown = false, |
|
|
|
|
|
|
|
element = this, |
|
|
|
instance = $module.data(moduleNamespace), |
|
|
|
module |
|
|
|
; |
|
|
|
|
|
|
@ -60,6 +61,7 @@ $.fn.form = function(fields, parameters) { |
|
|
|
initialize: function() { |
|
|
|
module.verbose('Initializing form validation', $module, validation, settings); |
|
|
|
module.bindEvents(); |
|
|
|
module.set.field.defaults(); |
|
|
|
module.instantiate(); |
|
|
|
}, |
|
|
|
|
|
|
@ -102,7 +104,6 @@ $.fn.form = function(fields, parameters) { |
|
|
|
}, |
|
|
|
|
|
|
|
bindEvents: function() { |
|
|
|
|
|
|
|
if(settings.keyboardShortcuts) { |
|
|
|
$field |
|
|
|
.on('keydown' + eventNamespace, module.event.field.keydown) |
|
|
@ -114,9 +115,9 @@ $.fn.form = function(fields, parameters) { |
|
|
|
$field |
|
|
|
.on('blur' + eventNamespace, module.event.field.blur) |
|
|
|
; |
|
|
|
// attach submit events
|
|
|
|
// attach events to common elements
|
|
|
|
module.attachEvents($submit, 'submit'); |
|
|
|
|
|
|
|
module.attachEvents($reset, 'reset'); |
|
|
|
$field |
|
|
|
.each(function() { |
|
|
|
var |
|
|
@ -130,6 +131,69 @@ $.fn.form = function(fields, parameters) { |
|
|
|
; |
|
|
|
}, |
|
|
|
|
|
|
|
reset: function() { |
|
|
|
$field |
|
|
|
.each(function () { |
|
|
|
var |
|
|
|
$field = $(this), |
|
|
|
$element = $field.parent(), |
|
|
|
$fieldGroup = $field.closest($group), |
|
|
|
defaultValue = $field.data(metadata.defaultValue), |
|
|
|
isCheckbox = $element.is(selector.uiCheckbox), |
|
|
|
isDropdown = $element.is(selector.uiDropdown), |
|
|
|
isErrored = $fieldGroup.hasClass(className.error) |
|
|
|
; |
|
|
|
if(isDropdown) { |
|
|
|
module.verbose('Resetting dropdown value', $element, defaultValue); |
|
|
|
$element.dropdown('restore defaults'); |
|
|
|
} |
|
|
|
else if(isCheckbox) { |
|
|
|
module.verbose('Resetting checkbox value', $element, defaultValue); |
|
|
|
if(defaultValue === true) { |
|
|
|
$element.checkbox('check'); |
|
|
|
} |
|
|
|
else { |
|
|
|
$element.checkbox('uncheck'); |
|
|
|
} |
|
|
|
} |
|
|
|
else { |
|
|
|
module.verbose('Resetting field value', $field, defaultValue); |
|
|
|
$field.val(defaultValue); |
|
|
|
} |
|
|
|
if(isErrored) { |
|
|
|
module.verbose('Resetting error on field', $fieldGroup); |
|
|
|
$fieldGroup.removeClass(className.error); |
|
|
|
} |
|
|
|
}) |
|
|
|
; |
|
|
|
}, |
|
|
|
|
|
|
|
serialize: function () { |
|
|
|
var |
|
|
|
data = {} |
|
|
|
; |
|
|
|
$field |
|
|
|
.each(function () { |
|
|
|
var |
|
|
|
$field = $(this), |
|
|
|
type = $field.prop('type'), |
|
|
|
name = $field.prop('name') |
|
|
|
; |
|
|
|
switch(type) { |
|
|
|
case 'checkbox': |
|
|
|
case 'radio': |
|
|
|
if($field.is(':checked')) { |
|
|
|
data[name] = $field.val(); |
|
|
|
} |
|
|
|
break; |
|
|
|
default: |
|
|
|
data[name] = $field.val(); |
|
|
|
} |
|
|
|
}) |
|
|
|
; |
|
|
|
return data; |
|
|
|
}, |
|
|
|
|
|
|
|
removeEvents: function() { |
|
|
|
$module |
|
|
|
.off(eventNamespace) |
|
|
@ -166,18 +230,18 @@ $.fn.form = function(fields, parameters) { |
|
|
|
$submit |
|
|
|
.addClass(className.pressed) |
|
|
|
; |
|
|
|
if(!keyStuckDown) { |
|
|
|
if(!keyHeldDown) { |
|
|
|
$field |
|
|
|
.one('keyup' + eventNamespace, module.event.field.keyup) |
|
|
|
; |
|
|
|
module.submit(); |
|
|
|
module.debug('Enter pressed on input submitting form'); |
|
|
|
} |
|
|
|
keyStuckDown = true; |
|
|
|
keyHeldDown = true; |
|
|
|
} |
|
|
|
}, |
|
|
|
keyup: function() { |
|
|
|
keyStuckDown = false; |
|
|
|
keyHeldDown = false; |
|
|
|
$submit.removeClass(className.pressed); |
|
|
|
}, |
|
|
|
blur: function() { |
|
|
@ -362,6 +426,70 @@ $.fn.form = function(fields, parameters) { |
|
|
|
.removeClass(className.success) |
|
|
|
.addClass(className.error) |
|
|
|
; |
|
|
|
}, |
|
|
|
field: { |
|
|
|
defaults: function () { |
|
|
|
$field |
|
|
|
.each(function () { |
|
|
|
var |
|
|
|
$field = $(this), |
|
|
|
isCheckbox = ($field.filter(selector.checkbox).length > 0), |
|
|
|
value = (isCheckbox) |
|
|
|
? $field.is(':checked') |
|
|
|
: $field.val() |
|
|
|
; |
|
|
|
$field.data(metadata.defaultValue, value); |
|
|
|
}) |
|
|
|
; |
|
|
|
}, |
|
|
|
value: function (field, value) { |
|
|
|
var |
|
|
|
data = {} |
|
|
|
; |
|
|
|
data[field] = value; |
|
|
|
return module.set.field.values.call(element, data); |
|
|
|
}, |
|
|
|
values: function (data) { |
|
|
|
if($.isEmptyObject(data)) { |
|
|
|
return; |
|
|
|
} |
|
|
|
$.each(data, function(key, value) { |
|
|
|
var |
|
|
|
$field = module.get.field(key), |
|
|
|
$element = $field.parent(), |
|
|
|
isCheckbox = $element.is(selector.uiCheckbox), |
|
|
|
isDropdown = $element.is(selector.uiDropdown), |
|
|
|
isRadio = $field.is(selector.radio), |
|
|
|
fieldExists = ($field.length > 0) |
|
|
|
; |
|
|
|
if(fieldExists) { |
|
|
|
if(isRadio && isCheckbox) { |
|
|
|
module.verbose('Selecting radio value', value, $field); |
|
|
|
$field.filter('[value="' + value + '"]') |
|
|
|
.parent(selector.uiCheckbox) |
|
|
|
.checkbox('check') |
|
|
|
; |
|
|
|
} |
|
|
|
else if(isCheckbox) { |
|
|
|
module.verbose('Setting checkbox value', value, $element); |
|
|
|
if(value === true) { |
|
|
|
$element.checkbox('check'); |
|
|
|
} |
|
|
|
else { |
|
|
|
$element.checkbox('uncheck'); |
|
|
|
} |
|
|
|
} |
|
|
|
else if(isDropdown) { |
|
|
|
module.verbose('Setting dropdown value', value, $element); |
|
|
|
$element.dropdown('set selected', value); |
|
|
|
} |
|
|
|
else { |
|
|
|
module.verbose('Setting field value', value, $field); |
|
|
|
$field.val(value); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
@ -374,7 +502,7 @@ $.fn.form = function(fields, parameters) { |
|
|
|
; |
|
|
|
|
|
|
|
// input keydown event will fire submit repeatedly by browser default
|
|
|
|
if(keyStuckDown) { |
|
|
|
if(keyHeldDown) { |
|
|
|
return false; |
|
|
|
} |
|
|
|
|
|
|
@ -606,7 +734,7 @@ $.fn.form = function(fields, parameters) { |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
if ( $.isFunction( found ) ) { |
|
|
|
if( $.isFunction( found ) ) { |
|
|
|
response = found.apply(context, passedArguments); |
|
|
|
} |
|
|
|
else if(found !== undefined) { |
|
|
@ -673,24 +801,29 @@ $.fn.form.settings = { |
|
|
|
onFailure : function() { return false; }, |
|
|
|
|
|
|
|
metadata : { |
|
|
|
defaultValue: 'default', |
|
|
|
validate: 'validate' |
|
|
|
}, |
|
|
|
|
|
|
|
selector : { |
|
|
|
message : '.error.message', |
|
|
|
field : 'input, textarea, select', |
|
|
|
group : '.field', |
|
|
|
checkbox: 'input[type="checkbox"], input[type="radio"]', |
|
|
|
input : 'input', |
|
|
|
prompt : '.prompt.label', |
|
|
|
submit : '.submit' |
|
|
|
checkbox : 'input[type="checkbox"], input[type="radio"]', |
|
|
|
field : 'input, textarea, select', |
|
|
|
group : '.field', |
|
|
|
input : 'input', |
|
|
|
message : '.error.message', |
|
|
|
prompt : '.prompt.label', |
|
|
|
radio : 'input[type="radio"]', |
|
|
|
reset : '.reset', |
|
|
|
submit : '.submit', |
|
|
|
uiCheckbox : '.ui.checkbox', |
|
|
|
uiDropdown : '.ui.dropdown' |
|
|
|
}, |
|
|
|
|
|
|
|
className : { |
|
|
|
error : 'error', |
|
|
|
success : 'success', |
|
|
|
label : 'ui prompt label', |
|
|
|
pressed : 'down', |
|
|
|
label : 'ui prompt label' |
|
|
|
success : 'success' |
|
|
|
}, |
|
|
|
|
|
|
|
error: { |
|
|
@ -698,6 +831,8 @@ $.fn.form.settings = { |
|
|
|
}, |
|
|
|
|
|
|
|
templates: { |
|
|
|
|
|
|
|
// template that produces error message
|
|
|
|
error: function(errors) { |
|
|
|
var |
|
|
|
html = '<ul class="list">' |
|
|
@ -708,6 +843,8 @@ $.fn.form.settings = { |
|
|
|
html += '</ul>'; |
|
|
|
return $(html); |
|
|
|
}, |
|
|
|
|
|
|
|
// template that produces label
|
|
|
|
prompt: function(errors) { |
|
|
|
return $('<div/>') |
|
|
|
.addClass('ui red pointing prompt label') |
|
|
@ -750,20 +887,20 @@ $.fn.form.settings = { |
|
|
|
max, |
|
|
|
parts |
|
|
|
; |
|
|
|
if (range === undefined || range === '' || range === '..') { |
|
|
|
if(range === undefined || range === '' || range === '..') { |
|
|
|
// do nothing
|
|
|
|
} |
|
|
|
else if (range.indexOf('..') == -1) { |
|
|
|
if (intRegExp.test(range)) { |
|
|
|
else if(range.indexOf('..') == -1) { |
|
|
|
if(intRegExp.test(range)) { |
|
|
|
min = max = range - 0; |
|
|
|
} |
|
|
|
} |
|
|
|
else { |
|
|
|
parts = range.split('..', 2); |
|
|
|
if (intRegExp.test(parts[0])) { |
|
|
|
if(intRegExp.test(parts[0])) { |
|
|
|
min = parts[0] - 0; |
|
|
|
} |
|
|
|
if (intRegExp.test(parts[1])) { |
|
|
|
if(intRegExp.test(parts[1])) { |
|
|
|
max = parts[1] - 0; |
|
|
|
} |
|
|
|
} |
|
|
|