$(this).siblings('.js-pt-longRegistrationFormConfig') .formValidation({ autoFocus: false, framework: 'bootstrap', icon: { valid: null, invalid: null, validating: null }, fields: { 'values[longRegistrationFormDefinition_shippingAddress]': { trigger: 'change', validators: { notEmpty: { message: '\u003Cspan style=\'color:#ff0000;\'\u003Eerror.genericConfigurableForm.shippingAddress\u003C\/span\u003E', message_en: '\u003Cspan style=\'color:#ff0000;\'\u003Eerror.genericConfigurableForm.shippingAddress\u003C\/span\u003E' } } }, 'values[longRegistrationFormDefinition_title]': { trigger: 'change', validators: { notEmpty: { message: 'Elija un saludo', message_en: 'Please select a title' } } }, 'values[longRegistrationFormDefinition_firstName]': { trigger: 'blur', validators: { callback: { callback: function(value, validator, $field) { var messages = []; var messagesEN = []; var errorOccured = false; if (!value.trim().match("^([^.#=&%$§\\!~;:¶\\*\\?\\+]*[\\u00C0-\\u02b8A-Za-z \\\'-][^.#=&%$§\\!~;:¶\\*\\?\\+])?$")) { messages.push("Introducir solo letras (sin puntos)"); messagesEN.push("Only letters are allowed"); errorOccured |= true; } if (errorOccured) { return { valid: false, message: messages.join("<br/>"), message_en: messagesEN } } else { return true; } } }, notEmpty: { message: 'Introduzca su nombre.', message_en: 'Please enter your first name.' }, stringLength: { message: 'Ha excedido la longitud máxima de 40 caracteres en este campo', message_en: 'You have exceeded the maximum length of 40 characters for this field', max: 40 }, } }, 'values[longRegistrationFormDefinition_lastName]': { trigger: 'blur', validators: { callback: { callback: function(value, validator, $field) { var messages = []; var messagesEN = []; var errorOccured = false; if (!value.trim().match("^([^.#=&%$§\\!~;:¶\\*\\?\\+]*[\\u00C0-\\u02b8A-Za-z \\\'-][^.#=&%$§\\!~;:¶\\*\\?\\+])?$")) { messages.push("Introducir solo letras (sin puntos)"); messagesEN.push("Only letters are allowed"); errorOccured |= true; } if (errorOccured) { return { valid: false, message: messages.join("<br/>"), message_en: messagesEN } } else { return true; } } }, notEmpty: { message: 'Por favor introduzca su apellido.', message_en: 'Please enter your last name.' }, stringLength: { message: 'Ha excedido la longitud máxima de 40 caracteres en este campo', message_en: 'You have exceeded the maximum length of 40 characters for this field', max: 40 }, } }, 'values[longRegistrationFormDefinition_addressLine1]': { trigger: 'blur', validators: { callback: { callback: function(value, validator, $field) { var messages = []; var messagesEN = []; var errorOccured = false; if (!value.trim().match("^(?!(.*(mailbox|Postfach|postfach|post fach|Post Fach|Post fach|post Fach|Mailbox|PO Box|Post Box|Post Office Box|Postal Box|Packstation|packstation|pack station|Schließfach|schließfach|schliessfach|Boîte Postale|Casier postal|Case Postale|私書箱)))(.*)$")) { messages.push("Hinweis: Sonderzeichen ()\/,"); messagesEN.push("Your address is not valid. Please enter a valid address. Delivery to PO Box is not possible."); errorOccured |= true; } if (errorOccured) { return { valid: false, message: messages.join("<br/>"), message_en: messagesEN } } else { return true; } } }, notEmpty: { message: 'Introduzca su calle \/ número', message_en: 'Enter your street\/number' }, stringLength: { message: 'Ha excedido la longitud máxima de 40 caracteres en este campo', message_en: 'You have exceeded the maximum length of 40 characters for this field', max: 40 }, } }, 'values[longRegistrationFormDefinition_addressLine2]': { trigger: 'blur', validators: { callback: { callback: function(value, validator, $field) { var messages = []; var messagesEN = []; var errorOccured = false; if (!value.trim().match("^(?!(.*(mailbox|Postfach|postfach|post fach|Post Fach|Post fach|post Fach|Mailbox|PO Box|Post Box|Post Office Box|Postal Box|Packstation|packstation|pack station|Schließfach|schließfach|schliessfach|Boîte Postale|Casier postal|Case Postale|私書箱))).*$")) { messages.push("Hinweis: Sonderzeichen ()\/,"); messagesEN.push("Your address is not valid. Please enter a valid address. Delivery to PO Box is not possible."); errorOccured |= true; } if (errorOccured) { return { valid: false, message: messages.join("<br/>"), message_en: messagesEN } } else { return true; } } }, stringLength: { message: 'Ha excedido la longitud máxima de 40 caracteres en este campo', message_en: 'You have exceeded the maximum length of 40 characters for this field', max: 40 }, } }, 'values[longRegistrationFormDefinition_zip]': { trigger: 'blur', validators: { callback: { callback: function(value, validator, $field) { var messages = []; var messagesEN = []; var errorOccured = false; if (!value.trim().match("^\\d{4}(-\\d{3})?$")) { messages.push("Por favor corrija el código postal\/código ZIP. Ejemplo: 4835-553 Guimaríes (4 dídgitos seguidos de 1 guión y luego 3 dídgitos) o 4835 Guimaríes (4 dídgitos)"); messagesEN.push("please correct the postal\/ZIP code. e.g. 4835-553 Guimaríes (4 digits and then hyphen and then 3 digits) or 4835 Guimaríes (4 digits)"); errorOccured |= true; } if (errorOccured) { return { valid: false, message: messages.join("<br/>"), message_en: messagesEN } } else { return true; } } }, notEmpty: { message: 'Por favor introduzca su código postal\/ZIP.', message_en: 'Please enter your postal\/ZIP code.' }, stringLength: { message: 'Ha excedido la longitud máxima de 10 caracteres en este campo', message_en: 'You have exceeded the maximum length of 10 characters for this field', max: 10 }, } }, 'values[longRegistrationFormDefinition_town]': { trigger: 'blur', validators: { notEmpty: { message: 'Por favor introduzca su pueblo\/ciudad.', message_en: 'Please enter your town\/city.' }, stringLength: { message: 'Ha excedido la longitud máxima de 40 caracteres en este campo', message_en: 'You have exceeded the maximum length of 40 characters for this field', max: 40 }, } }, 'values[longRegistrationFormDefinition_country]': { trigger: 'change', validators: { notEmpty: { message: 'Introduzca su país\/región.', message_en: 'Please enter your country\/region.' } } }, 'values[longRegistrationFormDefinition_phone]': { trigger: 'blur', validators: { callback: { callback: function(value, validator, $field) { var messages = []; var messagesEN = []; var errorOccured = false; if (!value.trim().match("[\\\\+]{0,1}[0-9\\\\(\\\\)\\- \\\\.]*$")) { messages.push("Por favor introduzca su número de teléfono. (Solamente números, no se permiten espacios)"); messagesEN.push("please enter your phone number. (Numbers only, no spaces)"); errorOccured |= true; } if (errorOccured) { return { valid: false, message: messages.join("<br/>"), message_en: messagesEN } } else { return true; } } }, notEmpty: { message: 'Complete el campo teléfono', message_en: 'Please enter your telephone number' }, stringLength: { message: 'Ha excedido la longitud máxima de 20 caracteres en este campo', message_en: 'You have exceeded the maximum length of 20 characters for this field', }, callbackPhone: { alias: 'callback', message: 'Complete el campo teléfono', message_en: 'Please enter your telephone number', callback: function (value, validator, $field) { var matchesRegex = true; var regexList = []; regexList.push('[\\\\+]{0,1}[0-9\\\\(\\\\)\\- \\\\.]*$'); for (var i = 0; i < regexList.length; i++) { matchesRegex = matchesRegex && (value.match(regexList[i])[0] === value); } var prefixCountry = $field.siblings('.flag-container').children('.selected-flag').attr('title'); var isValidPrefix = prefixCountry !== undefined && prefixCountry !== "Unknown"; return value === '' || (matchesRegex && isValidPrefix); } }, } }, 'values[longRegistrationFormDefinition_email]': { trigger: 'blur', validators: { regexp: { regexp: /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+$/, message: 'Por favor introduzca su correo electrónico.', message_en: 'Please enter your email address.' }, notEmpty: { message: 'Por favor introduzca su correo electrónico.', message_en: 'Please enter your email address.' }, stringLength: { message: 'Este campo debe tener entre 0 y 70 caracteres', message_en: 'The number of characters for this field must be between 0 and 70', min: 0 , max: 70 }, } }, 'values[longRegistrationFormDefinition_emailConfirm]': { trigger: 'blur', validators: { regexp: { regexp: /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+$/, message: 'Por favor introduzca su correo electrónico.', message_en: 'Please enter your email address.' }, notEmpty: { message: 'Por favor introduzca su correo electrónico.', message_en: 'Please enter your email address.' }, stringLength: { message: 'Este campo debe tener entre 0 y 70 caracteres', message_en: 'The number of characters for this field must be between 0 and 70', min: 0 , max: 70 }, identical: { field: 'values[longRegistrationFormDefinition_email]', message: 'Los campos no coinciden.', message_en: 'The fields do not match.' } } }, 'values[longRegistrationFormDefinition_birthdate_day]': { err: "#longRegistrationFormDefinition_birthdate-date-error-messages", excluded: false, trigger: 'blur', validators: { callback: { message: 'Introduzca un día válido para la fecha de nacimiento', message_en: 'Introduzca un día válido para la fecha de nacimiento', callback: function(value, validator, $field) { var input = $('#longRegistrationFormDefinition_birthdate_day'); if (ACC.global.isDateFieldEmpty("longRegistrationFormDefinition_birthdate")) { if ($("small[data-fv-for='" + 'values[longRegistrationFormDefinition_birthdate_month]' +"']").attr('data-fv-result') == "INVALID") { $('.js-pt-longRegistrationFormConfig').formValidation('revalidateField', 'values[longRegistrationFormDefinition_birthdate_month'); } if ($("small[data-fv-for='" + 'values[longRegistrationFormDefinition_birthdate_year]' +"']").attr('data-fv-result') == "INVALID") { $('.js-pt-longRegistrationFormConfig').formValidation('revalidateField', 'values[longRegistrationFormDefinition_birthdate_year]'); } input.addClass('date-input-no-confirmation'); return true; } else { input.removeClass('date-input-no-confirmation'); } if ($field.val().match("^\\d+$") == null) { return false; } var value = parseInt($field.val()); var monthValue = $('#longRegistrationFormDefinition_birthdate_month').val(); var yearValue = $('#longRegistrationFormDefinition_birthdate_year').val(); if (monthValue == "" && yearValue == "") { return value >= 1 && value <= 31; } if (monthValue == "2" && yearValue == "") { return value >= 1 && value <= 29; } var month = parseInt(monthValue); var year = parseInt(yearValue); return value >= 1 && value <= ACC.global.numberOfDaysInMonth(month, year); } } } }, 'values[longRegistrationFormDefinition_birthdate_month]': { err: "#longRegistrationFormDefinition_birthdate-date-error-messages", excluded: false, trigger: 'blur', validators: { callback: { message: 'Introduzca un mes válido para la fecha de nacimiento', message_en: 'Introduzca un mes válido para la fecha de nacimiento', callback: function(value, validator, $field) { if (ACC.global.isDateFieldEmpty("longRegistrationFormDefinition_birthdate")) { if ($("small[data-fv-for='" + 'values[longRegistrationFormDefinition_birthdate_day]' +"']").attr('data-fv-result') == "INVALID") { $('.js-pt-longRegistrationFormConfig').formValidation('revalidateField', 'values[longRegistrationFormDefinition_birthdate_day]'); } if ($("small[data-fv-for='" + 'values[longRegistrationFormDefinition_birthdate_year]' +"']").attr('data-fv-result') == "INVALID") { $('.js-pt-longRegistrationFormConfig').formValidation('revalidateField', 'values[longRegistrationFormDefinition_birthdate_year]'); } $('#longRegistrationFormDefinition_birthdate_month').addClass('date-input-no-confirmation'); return true; } else { $('#longRegistrationFormDefinition_birthdate_month').removeClass('date-input-no-confirmation'); } if ($field.val().match("^\\d+$") == null){ return false; } var value = parseInt($field.val()); if ($('#longRegistrationFormDefinition_birthdate_day').val() != "") { $('.js-pt-longRegistrationFormConfig').formValidation('revalidateField', 'values[longRegistrationFormDefinition_birthdate_day]'); } return value >= 1 && value <= 12; } } } }, 'values[longRegistrationFormDefinition_birthdate_year]': { err: "#longRegistrationFormDefinition_birthdate-date-error-messages", excluded: false, trigger: 'blur', validators: { callback: { message: 'Introduzca un año válido para la fecha de nacimiento', message_en: 'Introduzca un año válido para la fecha de nacimiento', callback: function(value, validator, $field) { var value = $field.val(); if (ACC.global.isDateFieldEmpty("longRegistrationFormDefinition_birthdate")) { if ($("small[data-fv-for='" + 'values[longRegistrationFormDefinition_birthdate_day]' +"']").attr('data-fv-result') == "INVALID") { $('.js-pt-longRegistrationFormConfig').formValidation('revalidateField', 'values[longRegistrationFormDefinition_birthdate_day]'); } if ($("small[data-fv-for='" + 'values[longRegistrationFormDefinition_birthdate_month]' +"']").attr('data-fv-result') == "INVALID") { $('.js-pt-longRegistrationFormConfig').formValidation('revalidateField', 'values[longRegistrationFormDefinition_birthdate_month]'); } $('#longRegistrationFormDefinition_birthdate_year').addClass('date-input-no-confirmation'); return true; } else { $('#longRegistrationFormDefinition_birthdate_year').removeClass('date-input-no-confirmation'); } if (value.match("^\\d{4}$") != null) { if ($('#longRegistrationFormDefinition_birthdate_day').val() != "") { $('.js-pt-longRegistrationFormConfig').formValidation('revalidateField', 'values[longRegistrationFormDefinition_birthdate_day]'); } return true; } return false; } } } }, 'values[longRegistrationFormDefinition_password]': { trigger: 'blur', validators: { callback: { callback: function(value, validator, $field) { var messages = []; var messagesEN = []; var errorOccured = false; if (!value.trim().match("(^$|^(?=.*[0-9])(?=.*[A-Z]).{7,}$)")) { messages.push("La contraseña no se ajusta a nuestra política de contraseñas. Introduce una contraseña de 7 caracteres, con al menos un número y una letra mayúscula."); messagesEN.push("The password has to be at least 7 characters long as well as contain one number and one capital letter."); errorOccured |= true; } if (errorOccured) { return { valid: false, message: messages.join("<br/>"), message_en: messagesEN } } else { return true; } } }, notEmpty: { message: 'Introduzca una contraseña.', message_en: 'Please enter a password.' }, } }, 'values[longRegistrationFormDefinition_passwordConfirm]': { trigger: 'blur', validators: { callback: { callback: function(value, validator, $field) { var messages = []; var messagesEN = []; var errorOccured = false; if (!value.trim().match("(^$|^(?=.*[0-9])(?=.*[A-Z]).{7,}$)")) { messages.push("La contraseña no se ajusta a nuestra política de contraseñas. Introduce una contraseña de 7 caracteres, con al menos un número y una letra mayúscula."); messagesEN.push("The password has to be at least 7 characters long as well as contain one number and one capital letter."); errorOccured |= true; } if (errorOccured) { return { valid: false, message: messages.join("<br/>"), message_en: messagesEN } } else { return true; } } }, notEmpty: { message: 'Por favor confirme su contraseña.', message_en: 'Please confirm your password.' }, identical: { field: 'values[longRegistrationFormDefinition_password]', message: 'Los campos no coinciden.', message_en: 'The fields do not match.' } } }, 'values[longRegistrationFormDefinition_besMembershipRequest]': { trigger: 'change', validators: { } }, 'values[longRegistrationFormDefinition_besNewsletterRequest]': { trigger: 'change', validators: { } }, 'values[longRegistrationFormDefinition_newsletter]': { trigger: 'change', validators: { } } } }) .on('success.field.fv', function() { /* note: we need to check if there is an error in the form, as the plugin does a validation on field level. Validating the whole form on blur of a field is no option, as the customer does not want to see error messages on all fields when entering one field. In case of an error on at least one field we disable the submit button manually */ var $form = $(this).closest('form'); if ($form.find('.form-group.has-error').length > 0) { var $button = $form.find('.js-button'); if (!$button.hasClass('disabled')) { $button.addClass('disabled'); } } }) .on('err.field.fv', function(e, data) { if(data.element.closest('.form-combo-molecule').length){ /* Get the messages of field */ var messages = data.fv.getMessages(data.element); /* Get the error message content of the field */ var errorContent = data.element.closest('.form-combo-molecule').find('.errors'); /* Get the hidden error message of the field */ var errorField = errorContent.find('small[data-field="' + data.field + '"][style="display: none;"]'); /* Loop over the messages */ for (var i in messages) { if (errorField[1] == undefined) { var newErrorContainer = document.createElement("small"); $(newErrorContainer).attr("class", "help-block"); $(newErrorContainer).attr("data-field", data.field); $(newErrorContainer).attr("data-fv-validator", "callback"); $(newErrorContainer).attr("data-fv-for", $(data.element[0]).attr("name") ); $(newErrorContainer).attr("data-fv-result", "INVALID"); $(newErrorContainer).attr("data-tracked", "true"); $(newErrorContainer).html(messages[i]); if (errorContent.text().includes(messages[i])) { $(newErrorContainer).hide(); } errorContent.append(newErrorContainer); } } } }) .on('success.field.fv', function(e, data) { /* Remove the field messages */ $errorContent = data.element.closest('.form-combo-molecule').find('.errors'); $errorContent.find('small[data-field="' + data.field + '"]').remove(); $errorContent.find('small[data-fv-result="INVALID"]').removeAttr("style"); }) .on('success.form.fv', function() { var formId = 'registerNewCustomer'; if (!formId || formId === 'cfRequest' || formId === 'cfResponse') { formId = 'longRegistrationFormDefinition'; } ACC.tracking.pushFormSubmit(formId); }); var replaceDatePatternWithValue = function(mandatory, fieldConfigCode, fieldConfigPattern) { var date = fieldConfigPattern.toUpperCase(); var year = $("#" + fieldConfigCode + "_year").val(); var month = $("#" + fieldConfigCode + "_month").val(); var day = $("#" + fieldConfigCode + "_day").val(); date = date.replace(/[Y]+/, year); date = date.replace(/[M]+/, month); date = date.replace(/[D]+/, day); var hiddenDateField = $('.js-' + fieldConfigCode + '_hidden'); if (mandatory) { hiddenDateField.val(date); } else { hiddenDateField.val(date == "" ? "" : date); } }; var triggerFormValidation = function(fieldId, mandatory, fieldCode, dateFormat) { replaceDatePatternWithValue(mandatory, fieldCode, dateFormat); $('.js-fieldCode').formValidation('revalidateField', 'values[fieldCode_'+ fieldId + ']'); }; var removeDateMoleculeError = function(molecule) { if(molecule.hasClass('has-error')){ molecule.removeClass('has-error'); molecule.find('.help-block').find('span').remove(); } }; $('.js-longRegistrationFormDefinition_birthdate_day').blur(function() { removeDateMoleculeError($('.js-longRegistrationFormDefinition_birthdate').closest('.form-combo-molecule')); triggerFormValidation("day", false, "longRegistrationFormDefinition_birthdate", "dd.MM.yyyy"); }); $('.js-longRegistrationFormDefinition_birthdate_month').blur(function() { removeDateMoleculeError($('.js-longRegistrationFormDefinition_birthdate').closest('.form-combo-molecule')); triggerFormValidation("month", false, "longRegistrationFormDefinition_birthdate", "dd.MM.yyyy"); }); $('.js-longRegistrationFormDefinition_birthdate_year').blur(function() { removeDateMoleculeError($('.js-longRegistrationFormDefinition_birthdate').closest('.form-combo-molecule')); triggerFormValidation("year", false, "longRegistrationFormDefinition_birthdate", "dd.MM.yyyy"); });