/* RESET */.elq-form * {
margin: 0;
padding: 0;
}
.elq-form input,textarea {
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
box-sizing:content-box;
}
.elq-form input[type=text],.elq-form textarea,.elq-form select[multiple=multiple] {
border: 1px solid #A6A6A6;
}
.elq-form button,input[type=reset],input[type=button],input[type=submit],input[type=checkbox],input[type=radio],select {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
/* GENERIC */.elq-form input {
height: 16px;
line-height: 16px;
}
.elq-form .item-padding {
padding:6px 5px 9px 9px;
}
.elq-form .pp-group {
padding:0px 5px 0px 9px;
}
.elq-form .pp-field {
padding:6px 0px 9px 0px;
}
.elq-form .field-wrapper.individual {
float: left;
width: 100%;
clear: both;
}
.elq-form .field-p {
position: relative;
margin: 0;
padding: 0;
}
.elq-form .zIndex-fix {
position: absolute;
z-index: 1;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.elq-form .field-design {
position:absolute;
z-index:2;
top:0;
left:0;
right:0;
bottom:0;
margin:0;
padding:0;
}
.elq-form .no-fields-prompt {
float: left;
width: 100%;
height: 150px;
padding-top: 50px;
clear: both;
}
/* SECTION BREAKS */.elq-form .section-break {
float:left;
width: 97%;
margin-right:2%;
margin-left:1%;
padding-bottom:6px;
}
.elq-form .section-break .heading {
width:100%;
font-weight: bold;
margin:0;
padding:0;
}
/* LABEL */.elq-form .required {
color: red !important;
display: inline;
float: none;
font-weight: bold;
margin: 0pt 0pt 0pt;
padding: 0pt 0pt 0pt;
}
/* FIELD GROUP */.elq-form .field-group {
float: left;
clear: both;
}
.elq-form .field-group.large {
width:100%;
}
.elq-form .field-group.medium {
width:51%;
}
.elq-form .field-group.small {
width:31%;
}
.elq-form .field-group .label {
float:left;
width:97%;
margin-right:2%;
margin-left:1%;
padding-bottom:6px;
font-weight: bold;
}
.elq-form .field-group .field-style {
float: left;
}
.elq-form .progressive-profile .pp-inner {
float: left;
clear: both;
}
.elq-form .progressive-profile .pp-inner.large {
width:100%;
}
.elq-form .progressive-profile .pp-inner.medium {
width:51%;
}
.elq-form .progressive-profile .pp-inner.small {
width:31%;
}
/* RADIO */.elq-form .radio-option {
display: inline-block;
}
.elq-form .radio-option .label {
display:block;
float:left;
padding-right:10px;
padding-left:22px;
text-indent:-22px;
}
.elq-form .radio-option .input {
vertical-align:middle;
margin-right:7px;
}
.elq-form .radio-option .inner {
vertical-align:middle;
}
/* CHECKBOX */.elq-form .checkbox-span {
display:inline-block;
}
.elq-form .checkbox-label {
padding-left:7px;
position: relative;
bottom:3px;
}
/* INPUT */.elq-form .accept-default {
width:100%;
}
/* SIZING */.elq-form .field-style {
margin-right:2%;
margin-left:2%;
}
.elq-form .field-style._25 {
width:21%;
}
.elq-form .field-style._50 {
width:46%;
}
.elq-form .field-style._50_left {
clear:left;
width:46%;
}
.elq-form .field-style._75 {
width:71%;
}
.elq-form .field-style._100 {
width:96%;
}
.elq-form .field-size-top-small {
width:30%;
}
.elq-form .field-size-top-medium {
width:75%;
}
.elq-form .field-size-top-large {
width:100%;
}
.elq-form .field-size-left-small {
width:21%;
}
.elq-form .field-size-left-medium {
width:46%;
}
.elq-form .field-size-left-large {
width:60%;
}
/* INSTRUCTIONS */.elq-form .instructions.default {
color:#444444;
display:block;
font-size:10px;
padding:6px 0pt 3px;
}
.elq-form .instructions.group {
float:left;
width:97%;
margin-right:2%;
margin-left:2%;
padding:6px 0pt 3px;
color:#444444;
display:block;
font-size:10px;
}
.elq-form .instructions.left-single {
margin:0 0 0 33%;
}
.elq-form .instructions-other {
margin:0;
}
/* POSITIONING */.elq-form .label-position.left {
display:block;
line-height:150%;
padding:1px 0pt 3px;
float:left;
width:31%;
margin:0pt 15px 0pt 0pt;
word-wrap:break-word;
overflow-wrap: break-word;
}
.elq-form .label-position.top {
display:block;
line-height:150%;
padding:1px 0pt 3px;
white-space:normal;
}
.elq-form .label-position.alignment-left {
text-align: left;
}
.elq-form .label-position.alignment-right {
text-align: right;
}
/* LIST ORDER */.elq-form .list-order {
display:block;
}
.elq-form .list-order.oneColumn {
margin:0pt 7px 0pt 0pt;
width:100%;
clear:both;
}
.elq-form .list-order.twoColumn {
float:left;
margin:0pt 7px 0pt 0pt;
width:38%;
}
.elq-form .list-order.threeColumn {
float:left;
margin:0pt 7px 0pt 0pt;
width:30%;
}
.elq-form .list-order.oneColumnLeft {
float:left;
margin:0pt 7px 0pt 0pt;
width:100%;
}
.elq-form .list-order.twoColumnLeft {
float:left;
margin:0pt 7px 0pt 0pt;
width:38%;
}
.elq-form .list-order.threeColumnLeft {
float:left;
margin:0pt 7px 0pt 0pt;
width:30%;
}
/* GRID STYLE */.elq-form .grid-style {
display:inline;
float:left;
margin-left:2%;
margin-right:2%;
}
.elq-form .grid-style._25 {
width:21%;
}
.elq-form .grid-style._50 {
width:46%;
}
.elq-form .grid-style._75 {
width:71%;
}
.elq-form .grid-style._100 {
width:96%;
}
.elq-form #elq-FormLastRow {
position: absolute;
left: -80%;
top: -80%;
}
.elq-form .loader{
vertical-align: middle;
display: inline-block;
margin-left:10px;
border: 3px solid #f3f3f3;
border-radius: 50%;
border-top: 3px solid #3498db;
width: 20px;
height: 20px;
-webkit-animation: spin 2s linear infinite;
animation: spin 2s linear infinite;
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.LV_validation_message{
font-weight:bold;
margin: 0 0 0 5px;
}
.LV_valid{
color:#00CC00;
display:none;
}
.LV_invalid{
color:#CC0000;
font-size:10px;
}
.LV_valid_field, input.LV_valid_field:hover, input.LV_valid_field:active, textarea.LV_valid_field:hover, textarea.LV_valid_field:active {
outline: 1px solid #00CC00;
}
.LV_invalid_field, input.LV_invalid_field:hover, input.LV_invalid_field:active, textarea.LV_invalid_field:hover, textarea.LV_invalid_field:active {
outline: 1px solid #CC0000;
}
var dom0 = document.querySelector('#form122 #field0');
var field0 = new LiveValidation(dom0, {
validMessage: "", onlyOnBlur: false, wait: 300}
);
field0.add(Validate.Presence, {
failureMessage:"Se requiere el Nombre"}
);
var dom1 = document.querySelector('#form122 #field1');
var field1 = new LiveValidation(dom1, {
validMessage: "", onlyOnBlur: false, wait: 300}
);
field1.add(Validate.Presence, {
failureMessage:"Se requiere el Apellido"}
);
var dom2 = document.querySelector('#form122 #field2');
var field2 = new LiveValidation(dom2, {
validMessage: "", onlyOnBlur: false, wait: 300}
);
field2.add(Validate.Presence, {
failureMessage:"Se requiere un email valido"}
);
field2.add(Validate.Format, {
pattern: /(^[A-Z0-9!#\$%&'\*\+\-\/=\?\^_`\{\|\}~][A-Z0-9!#\$%&'\*\+\-\/=\?\^_`\{\|\}~\.]{0,62}@(([A-Z0-9](?:[A-Z0-9\-]{0,61}[A-Z0-9])?)(\.[A-Z0-9](?:[A-Z0-9\-]{0,61}[A-Z0-9])?)+)$)/i, failureMessage: "Se requiere un email valido"}
);
field2.add(Validate.Format, {
pattern: /\.\.|\.@/i, failureMessage: "Se requiere un email valido", negate: "true"}
);
var dom4 = document.querySelector('#form122 #field4');
var field4 = new LiveValidation(dom4, {
validMessage: "", onlyOnBlur: false, wait: 300}
);
field4.add(Validate.Custom, {
against: function(value) {
return !value.match(/(telnet|ftp|https?):\/\/(?:[a-z0-9][a-z0-9-]{0,61}[a-z0-9]\.|[a-z0-9]\.)+[a-z]{2,63}/i);
}
, failureMessage: "Value must not contain any URL's"}
);
field4.add(Validate.Custom, {
against: function(value) {
return !value.match(/(]+)>)/ig);
}
, failureMessage: "Value must not contain any HTML"}
);
field4.add(Validate.Length, {
tooShortMessage:"Invalid length for field value", tooLongMessage: "Invalid length for field value", minimum: 0, maximum: 35}
);
var dom5 = document.querySelector('#form122 #field5');
var field5 = new LiveValidation(dom5, {
validMessage: "", onlyOnBlur: false, wait: 300}
);
function handleFormSubmit(ele) {
var submitButton = ele.querySelector('input[type=submit]');
var spinner = document.createElement('span');
spinner.setAttribute('class', 'loader');
submitButton.setAttribute('disabled', true);
submitButton.style.cursor = 'wait';
submitButton.parentNode.appendChild(spinner);
return true;
}
function resetSubmitButton(e){
var submitButtons = e.target.form.getElementsByClassName('submit-button');
for(var i=0;i<submitButtons.length;i++){
submitButtons[i].disabled = false;
}
}
function addChangeHandler(elements){
for(var i=0; i<elements.length; i++){
elements[i].addEventListener('change', resetSubmitButton);
}
}
var form = document.getElementById('form122');
addChangeHandler(form.getElementsByTagName('input'));
addChangeHandler(form.getElementsByTagName('select'));
addChangeHandler(form.getElementsByTagName('textarea'));
var nodes = document.querySelectorAll('#form122 input[data-subscription]');
if (nodes) {
for (var i = 0, len = nodes.length; i < len; i++) {
var status = nodes[i].dataset ? nodes[i].dataset.subscription : nodes[i].getAttribute('data-subscription');
if(status ==='true') {
nodes[i].checked = true;
}
}
};
var nodes = document.querySelectorAll('#form122 select[data-value]');
if (nodes) {
for (var i = 0; i < nodes.length; i++) {
var node = nodes[i];
var selectedValue = node.dataset ? node.dataset.value : node.getAttribute('data-value');
if (selectedValue) {
for (var j = 0; j < node.options.length; j++) {
if(node.options[j].value === selectedValue) {
node.options[j].selected = 'selected';
break;
}
}
}
}
}