PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 5.5
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v5.5
6.35 6.34 6.33.1 6.33 6.32.1 6.32 6.31 6.25 6.25.1 6.26 6.26.1 6.27 6.28 6.29 6.3 6.3.1 6.3.2 6.30 6.4 6.4.1 6.4.2 6.5 6.5.1 6.5.2 6.5.3 All 141 releases
← All changes | js/formidable.js +868 -1711 6.345.5 View file →
@@ -1,58 +1,77 @@
1 -/* exported frmRecaptcha, frmAfterRecaptcha */
1 +/* exported frmRecaptcha, frmAfterRecaptcha, frmUpdateField, frmDeleteEntry, frmOnSubmit, frm_resend_email */
2 2
3 +var frmFrontForm;
4 +
3 5 function frmFrontFormJS() {
4 6 'use strict';
5 7
6 - let jsErrors = [];
8 + /*global jQuery:false, frm_js, grecaptcha, frmProForm, tinyMCE */
9 + /*global frmThemeOverride_jsErrors, frmThemeOverride_frmPlaceError, frmThemeOverride_frmAfterSubmit */
7 10
11 + var action = '';
12 + var jsErrors = [];
13 +
8 14 /**
9 - * Triggers custom JS event.
15 + * Maybe add polyfills.
10 16 *
11 - * @since 5.5.3
12 - *
13 - * @param {HTMLElement} el The HTML element.
14 - * @param {string} eventName Event name.
15 - * @param {*} data The passed data.
17 + * @since 5.4
16 18 */
17 - function triggerCustomEvent( el, eventName, data ) {
18 - if ( typeof window.CustomEvent !== 'function' ) {
19 - return;
19 + function maybeAddPolyfills() {
20 + if ( ! Element.prototype.matches ) {
21 + // IE9 supports matches but as msMatchesSelector instead.
22 + Element.prototype.matches = Element.prototype.msMatchesSelector;
20 23 }
21 24
22 - const event = new CustomEvent( eventName );
23 - event.frmData = data;
25 + if ( ! Element.prototype.closest ) {
26 + Element.prototype.closest = function( s ) {
27 + var el = this;
24 28
25 - el.dispatchEvent( event );
29 + do {
30 + if ( el.matches( s ) ) {
31 + return el;
32 + }
33 + el = el.parentElement || el.parentNode;
34 + } while ( el !== null && el.nodeType === 1 );
35 +
36 + return null;
37 + };
38 + }
39 +
40 + // NodeList.forEach().
41 + if ( window.NodeList && ! NodeList.prototype.forEach ) {
42 + NodeList.prototype.forEach = function( callback, thisArg ) {
43 + thisArg = thisArg || window;
44 + for ( var i = 0; i < this.length; i++ ) {
45 + callback.call( thisArg, this[ i ], i, this );
46 + }
47 + };
48 + }
26 49 }
27 50
28 - /**
29 - * Get the ID of the field that changed.
30 - *
31 - * @param {HTMLElement|jQuery} field
32 - * @param {boolean} fullID
33 - * @return {string|number} Field ID.
34 - */
51 + /* Get the ID of the field that changed*/
35 52 function getFieldId( field, fullID ) {
36 - let nameParts;
37 - let fieldId;
38 - let isRepeating = false;
39 - let fieldName = '';
40 -
53 + var nameParts, fieldId,
54 + isRepeating = false,
55 + fieldName = '';
41 56 if ( field instanceof jQuery ) {
42 - field = field.get( 0 );
57 + fieldName = field.attr( 'name' );
58 + } else {
59 + fieldName = field.name;
43 60 }
44 61
45 - fieldName = field.name;
46 -
47 - if ( fieldName === undefined ) {
62 + if ( typeof fieldName === 'undefined' ) {
48 63 fieldName = '';
49 64 }
50 65
51 66 if ( fieldName === '' ) {
52 - fieldName = field.getAttribute( 'data-name' );
67 + if ( field instanceof jQuery ) {
68 + fieldName = field.data( 'name' );
69 + } else {
70 + fieldName = field.getAttribute( 'data-name' );
71 + }
53 72
54 - if ( fieldName === undefined ) {
73 + if ( typeof fieldName === 'undefined' ) {
55 74 fieldName = '';
56 75 }
57 76
58 77 if ( fieldName !== '' && fieldName ) {
@@ -67,24 +86,25 @@
67 86 return 0;
68 87 }
69 88 nameParts = nameParts.filter( function( n ) {
70 89 return n !== '';
71 - } );
90 + });
72 91
73 - fieldId = nameParts[ 0 ];
92 + fieldId = nameParts[0];
74 93
75 94 if ( nameParts.length === 1 ) {
76 95 return fieldId;
77 96 }
78 97
79 - if ( nameParts[ 1 ] === '[form' || nameParts[ 1 ] === '[row_ids' ) {
98 + if ( nameParts[1] === '[form' || nameParts[1] === '[row_ids' ) {
80 99 return 0;
81 100 }
82 101
83 102 // Check if 'this' is in a repeating section
84 - if ( document.querySelector( `input[name="item_meta[${ fieldId }][form]"]` ) ) {
103 + if ( jQuery( 'input[name="item_meta[' + fieldId + '][form]"]' ).length ) {
104 +
85 105 // this is a repeatable section with name: item_meta[repeating-section-id][row-id][field-id]
86 - fieldId = nameParts[ 2 ].replace( '[', '' );
106 + fieldId = nameParts[2].replace( '[', '' );
87 107 isRepeating = true;
88 108 }
89 109
90 110 // Check if 'this' is an other text field and get field ID for it
@@ -90,21 +110,21 @@
90 110 // Check if 'this' is an other text field and get field ID for it
91 111 if ( 'other' === fieldId ) {
92 112 if ( isRepeating ) {
93 113 // name for other fields: item_meta[370][0][other][414]
94 - fieldId = nameParts[ 3 ].replace( '[', '' );
114 + fieldId = nameParts[3].replace( '[', '' );
95 115 } else {
96 116 // Other field name: item_meta[other][370]
97 - fieldId = nameParts[ 1 ].replace( '[', '' );
117 + fieldId = nameParts[1].replace( '[', '' );
98 118 }
99 119 }
100 120
101 121 if ( fullID === true ) {
102 122 // For use in the container div id
103 - if ( fieldId === nameParts[ 0 ] ) {
104 - fieldId = `${ fieldId }-${ nameParts[ 1 ].replace( '[', '' ) }`;
123 + if ( fieldId === nameParts[0]) {
124 + fieldId = fieldId + '-' + nameParts[1].replace( '[', '' );
105 125 } else {
106 - fieldId = `${ fieldId }-${ nameParts[ 0 ] }-${ nameParts[ 1 ].replace( '[', '' ) }`;
126 + fieldId = fieldId + '-' + nameParts[0] + '-' + nameParts[1].replace( '[', '' );
107 127 }
108 128 }
109 129
110 130 return fieldId;
@@ -114,18 +134,12 @@
114 134 * Disable the submit button for a given jQuery form object
115 135 *
116 136 * @since 2.03.02
117 137 *
118 - * @param {Object} $form
119 - */
138 + * @param {object} $form
139 + */
120 140 function disableSubmitButton( $form ) {
121 - const form = $form instanceof jQuery ? $form.get( 0 ) : $form;
122 - if ( ! form ) {
123 - return;
124 - }
125 - form.querySelectorAll( 'input[type="submit"], input[type="button"], button[type="submit"], button.frm_save_draft' ).forEach(
126 - button => button.disabled = true
127 - );
141 + $form.find( 'input[type="submit"], input[type="button"], button[type="submit"]' ).attr( 'disabled', 'disabled' );
128 142 }
129 143
130 144 /**
131 145 * Enable the submit button for a given jQuery form object
@@ -131,16 +145,12 @@
131 145 * Enable the submit button for a given jQuery form object
132 146 *
133 147 * @since 2.03.02
134 148 *
135 - * @param {HTMLElement} form
136 - *
137 - * @return {void}
138 - */
139 - function enableSubmitButton( form ) {
140 - form.querySelectorAll( 'input[type="submit"], input[type="button"], button[type="submit"]' ).forEach(
141 - button => button.disabled = false
142 - );
149 + * @param {object} $form
150 + */
151 + function enableSubmitButton( $form ) {
152 + $form.find( 'input[type="submit"], input[type="button"], button[type="submit"]' ).prop( 'disabled', false );
143 153 }
144 154
145 155 /**
146 156 * Disable the save draft link for a given jQuery form object
@@ -146,259 +156,136 @@
146 156 * Disable the save draft link for a given jQuery form object
147 157 *
148 158 * @since 4.04.03
149 159 *
150 - * @param {Object} $form
160 + * @param {object} $form
151 161 */
152 162 function disableSaveDraft( $form ) {
153 - const form = $form instanceof jQuery ? $form.get( 0 ) : $form;
154 - if ( ! form ) {
155 - return;
156 - }
157 - form.querySelectorAll( 'a.frm_save_draft' ).forEach(
158 - link => link.style.pointerEvents = 'none'
159 - );
163 + $form.find( 'a.frm_save_draft' ).css( 'pointer-events', 'none' );
160 164 }
161 165
162 166 /**
163 - * Enable the save draft link for a given form object.
167 + * Enable the save draft link for a given jQuery form object
164 168 *
165 169 * @since 4.04.03
166 170 *
167 - * @param {jQuery|HTMLElement} $form
171 + * @param {object} $form
168 172 */
169 173 function enableSaveDraft( $form ) {
170 - const form = $form instanceof jQuery ? $form.get( 0 ) : $form;
171 - if ( ! form ) {
172 - return;
173 - }
174 - form.querySelectorAll( '.frm_save_draft' ).forEach( saveDraftButton => {
175 - saveDraftButton.disabled = false;
176 - saveDraftButton.style.pointerEvents = '';
177 - } );
174 + $form.find( 'a.frm_save_draft' ).css( 'pointer-events', '' );
178 175 }
179 176
180 - /**
181 - * Validate form with JS.
182 - *
183 - * @param {HTMLElement|jQuery} object
184 - * @return {Array} Errors.
185 - */
186 177 function validateForm( object ) {
187 - let errors = [];
178 + var r, rl, n, nl, fields, field, value, requiredFields,
179 + errors = [];
188 180
189 - const vanillaJsObject = 'function' === typeof object.get ? object.get( 0 ) : object;
190 -
191 - // Required field validation.
192 - vanillaJsObject?.querySelectorAll( '.frm_required_field' ).forEach(
193 - requiredField => {
194 - const isVisible = requiredField.offsetParent !== null;
195 - if ( ! isVisible ) {
196 - return;
181 + // Make sure required text field is filled in
182 + requiredFields = jQuery( object ).find(
183 + '.frm_required_field:visible input, .frm_required_field:visible select, .frm_required_field:visible textarea'
184 + ).filter( ':not(.frm_optional)' );
185 + if ( requiredFields.length ) {
186 + for ( r = 0, rl = requiredFields.length; r < rl; r++ ) {
187 + if ( hasClass( requiredFields[r], 'ed_button' ) ) {
188 + // skip rich text field buttons.
189 + continue;
197 190 }
198 -
199 - requiredField.querySelectorAll( 'input, select, textarea' ).forEach(
200 - requiredInput => {
201 - if ( hasClass( requiredInput, 'frm_optional' ) || hasClass( requiredInput, 'ed_button' ) ) {
202 - // skip rich text field buttons.
203 - return;
204 - }
205 -
206 - errors = checkRequiredField( requiredInput, errors );
207 - }
208 - );
191 + errors = checkRequiredField( requiredFields[r], errors );
209 192 }
210 - );
193 + }
211 194
212 - vanillaJsObject?.querySelectorAll( 'input,select,textarea' ).forEach(
213 - field => {
214 - if ( '' === field.value ) {
215 - if ( 'number' === field.type ) {
216 - // A number field will return an empty string when it is invalid.
217 - checkValidity( field, errors );
195 + fields = jQuery( object ).find( 'input,select,textarea' );
196 + if ( fields.length ) {
197 + for ( n = 0, nl = fields.length; n < nl; n++ ) {
198 + field = fields[n];
199 + value = field.value;
200 + if ( value !== '' ) {
201 + if ( field.type === 'hidden' ) {
202 + // don't validate
203 + } else if ( field.type === 'number' ) {
204 + errors = checkNumberField( field, errors );
205 + } else if ( field.type === 'email' ) {
206 + errors = checkEmailField( field, errors );
207 + } else if ( field.type === 'password' ) {
208 + errors = checkPasswordField( field, errors );
209 + } else if ( field.type === 'url' ) {
210 + errors = checkUrlField( field, errors );
211 + } else if ( field.pattern !== null ) {
212 + errors = checkPatternField( field, errors );
218 213 }
219 -
220 - const isConfirmationField = field.name && 0 === field.name.indexOf( 'item_meta[conf_' );
221 - if ( ! isConfirmationField ) {
222 - // Allow a blank confirmation field to still call validateFieldValue.
223 - // If we continue for a confirmation field there are issues with forms submitting with a blank confirmation field.
224 - return;
225 - }
226 214 }
227 -
228 - validateFieldValue( field, errors, true );
229 - checkValidity( field, errors );
230 215 }
231 - );
216 + }
232 217
233 - // Invisible captchas are processed after validation.
234 - // We only want to validate a visible captcha on submit.
235 - if ( ! hasInvisibleRecaptcha( object ) ) {
236 - errors = validateRecaptcha( object, errors );
237 - }
218 + errors = validateRecaptcha( object, errors );
238 219
239 220 return errors;
240 221 }
241 222
242 223 /**
243 - * Check the ValidityState interface for the field.
244 - * If it is invalid, show an error for it.
245 - *
246 - * @param {HTMLElement} field
247 - * @param {Array} errors
248 - * @return {void}
249 - */
250 - function checkValidity( field, errors ) {
251 - if ( 'object' !== typeof field.validity || false !== field.validity.valid ) {
252 - return;
253 - }
254 -
255 - const fieldID = getFieldId( field, true );
256 - if ( errors[ fieldID ] === undefined ) {
257 - errors[ fieldID ] = getFieldValidationMessage( field, 'data-invmsg' );
258 - }
259 -
260 - if ( 'function' === typeof field.reportValidity ) {
261 - // This triggers an error pop up.
262 - field.reportValidity();
263 - }
264 - }
265 -
266 - /**
267 224 * @since 5.0.10
268 225 *
269 - * @param {Object} element
226 + * @param {object} element
270 227 * @param {string} targetClass
271 - * @return {boolean} True if the element has the target class.
228 + * @returns {boolean}
272 229 */
273 230 function hasClass( element, targetClass ) {
274 - return element.classList && element.classList.contains( targetClass );
231 + var className = ' ' + element.className + ' ';
232 + return -1 !== className.indexOf( ' ' + targetClass + ' ' );
275 233 }
276 234
277 - /**
278 - * @param {HTMLElement} field
279 - */
280 235 function maybeValidateChange( field ) {
281 236 if ( field.type === 'url' ) {
282 - maybeAddHttpsToUrl( field );
237 + maybeAddHttpToUrl( field );
283 238 }
284 - const form = field.closest( 'form' );
285 - if ( ! form ) {
286 - return;
239 + if ( jQuery( field ).closest( 'form' ).hasClass( 'frm_js_validate' ) ) {
240 + validateField( field );
287 241 }
288 -
289 - // Removing stale errors is universal. Adding errors only happens when JS validation is enabled.
290 - validateField( field, hasClass( form, 'frm_js_validate' ) );
291 242 }
292 243
293 - /**
294 - * @param {HTMLElement} field
295 - */
296 - function maybeAddHttpsToUrl( field ) {
297 - const url = field.value;
298 - const matches = url.match( /^(https?|ftps?|mailto|news|feed|telnet):/ );
244 + function maybeAddHttpToUrl( field ) {
245 + var url = field.value;
246 + var matches = url.match( /^(https?|ftps?|mailto|news|feed|telnet):/ );
299 247 if ( field.value !== '' && matches === null ) {
300 - field.value = `https://${ url }`;
248 + field.value = 'http://' + url;
301 249 }
302 250 }
303 251
304 - /**
305 - * Validate a field with JS.
306 - *
307 - * Removing stale errors is universal. Adding errors only happens when JS validation is enabled.
308 - *
309 - * @since 6.32 Added the `addErrors` parameter.
310 - *
311 - * @param {HTMLElement} field
312 - * @param {boolean} addErrors Whether to add new errors. Defaults to `true`.
313 - *
314 - * @return {void}
315 - */
316 - function validateField( field, addErrors = true ) {
317 - let errors;
318 - let key;
252 + function validateField( field ) {
253 + var key,
254 + errors = [],
255 + $fieldCont = jQuery( field ).closest( '.frm_form_field' );
319 256
320 - errors = [];
321 - const fieldContainer = field.closest( '.frm_form_field' );
322 -
323 - if ( ! fieldContainer ) {
324 - // Hidden fields do not have a field container and do not require JS validation.
325 - return;
326 - }
327 -
328 - if ( hasClass( fieldContainer, 'frm_required_field' ) && ! hasClass( field, 'frm_optional' ) ) {
257 + if ( $fieldCont.hasClass( 'frm_required_field' ) && ! jQuery( field ).hasClass( 'frm_optional' ) ) {
329 258 errors = checkRequiredField( field, errors );
330 259 }
331 260
332 261 if ( errors.length < 1 ) {
333 - validateFieldValue( field, errors, false );
262 + if ( field.type === 'email' ) {
263 + errors = checkEmailField( field, errors );
264 + } else if ( field.type === 'password' ) {
265 + errors = checkPasswordField( field, errors );
266 + } else if ( field.type === 'number' ) {
267 + errors = checkNumberField( field, errors );
268 + } else if ( field.type === 'url' ) {
269 + errors = checkUrlField( field, errors );
270 + } else if ( field.pattern !== null ) {
271 + errors = checkPatternField( field, errors );
272 + }
334 273 }
335 274
336 - const hasErrors = Object.keys( errors ).length > 0;
337 -
338 - if ( addErrors ) {
339 - removeFieldError( fieldContainer );
340 - if ( hasErrors ) {
341 - for ( key in errors ) {
342 - addFieldError( fieldContainer, key, errors );
343 - }
275 + removeFieldError( $fieldCont );
276 + if ( Object.keys( errors ).length > 0 ) {
277 + for ( key in errors ) {
278 + addFieldError( $fieldCont, key, errors );
344 279 }
345 - } else if ( ! hasErrors ) {
346 - // JS validation is off, so only remove existing errors once the field passes validation.
347 - removeFieldError( fieldContainer );
348 280 }
349 281 }
350 282
351 - /**
352 - * Validates a field value.
353 - *
354 - * @since 6.15 Added `onSubmit` parameter.
355 - *
356 - * @param {HTMLElement} field Field input.
357 - * @param {Object} errors Errors data.
358 - * @param {boolean} onSubmit Is `true` if the form is being submitted.
359 - */
360 - function validateFieldValue( field, errors, onSubmit ) {
361 - if ( field.type === 'hidden' ) {
362 - // don't validate
363 - } else if ( field.type === 'number' ) {
364 - checkNumberField( field, errors );
365 - } else if ( field.type === 'email' ) {
366 - checkEmailField( field, errors, onSubmit );
367 - } else if ( field.type === 'password' ) {
368 - checkPasswordField( field, errors, onSubmit );
369 - } else if ( field.type === 'url' ) {
370 - checkUrlField( field, errors );
371 - } else if ( field.pattern !== null ) {
372 - checkPatternField( field, errors );
373 - }
374 -
375 - if ( 'tel' === field.type && shouldCheckConfirmField( field, onSubmit ) ) {
376 - confirmField( field, errors );
377 - }
378 -
379 - /**
380 - * @since 6.15 Added `onSubmit` to the data.
381 - */
382 - triggerCustomEvent( document, 'frm_validate_field_value', {
383 - field,
384 - errors,
385 - onSubmit
386 - } );
387 - }
388 -
389 - /**
390 - * @param {HTMLElement} field
391 - * @param {Array} errors
392 - * @return {Array} Errors
393 - */
394 283 function checkRequiredField( field, errors ) {
395 - let tempVal;
396 - let i;
397 - let placeholder;
398 - let val = '';
399 - let fieldID = '';
400 - let fileID = field.getAttribute( 'data-frmfile' );
284 + var checkGroup, tempVal, i, placeholder,
285 + val = '',
286 + fieldID = '',
287 + fileID = field.getAttribute( 'data-frmfile' );
401 288
402 289 if ( field.type === 'hidden' && fileID === null && ! isAppointmentField( field ) && ! isInlineDatepickerField( field ) ) {
403 290 return errors;
404 291 }
@@ -403,26 +290,19 @@
403 290 return errors;
404 291 }
405 292
406 293 if ( field.type === 'checkbox' || field.type === 'radio' ) {
407 - document.querySelectorAll( `input[name="${ field.name }"]` ).forEach( function( input ) {
408 - const requiredField = input.closest( '.frm_required_field' );
409 - if ( ! requiredField ) {
410 - return;
411 - }
412 -
413 - const checkedInputs = requiredField.querySelectorAll( 'input:checked' );
414 - checkedInputs.forEach( function( checkedInput ) {
415 - val = checkedInput.value;
416 - } );
417 - } );
294 + checkGroup = jQuery( 'input[name="' + field.name + '"]' ).closest( '.frm_required_field' ).find( 'input:checked' );
295 + jQuery( checkGroup ).each( function() {
296 + val = this.value;
297 + });
418 298 } else if ( field.type === 'file' || fileID ) {
419 - if ( fileID === undefined ) {
299 + if ( typeof fileID === 'undefined' ) {
420 300 fileID = getFieldId( field, true );
421 301 fileID = fileID.replace( 'file', '' );
422 302 }
423 303
424 - if ( errors[ fileID ] === undefined ) {
304 + if ( typeof errors[ fileID ] === 'undefined' ) {
425 305 val = getFileVals( fileID );
426 306 }
427 307 fieldID = fileID;
428 308 } else {
@@ -430,10 +310,9 @@
430 310 // skip hidden other fields
431 311 return errors;
432 312 }
433 313
434 - val = jQuery( field ).val(); // eslint-disable-line no-jquery/no-val
435 -
314 + val = jQuery( field ).val();
436 315 if ( val === null ) {
437 316 val = '';
438 317 } else if ( typeof val !== 'string' ) {
439 318 tempVal = val;
@@ -438,10 +317,10 @@
438 317 } else if ( typeof val !== 'string' ) {
439 318 tempVal = val;
440 319 val = '';
441 320 for ( i = 0; i < tempVal.length; i++ ) {
442 - if ( tempVal[ i ] !== '' ) {
443 - val = tempVal[ i ];
321 + if ( tempVal[i] !== '' ) {
322 + val = tempVal[i];
444 323 }
445 324 }
446 325 }
447 326
@@ -454,22 +333,14 @@
454 333 } else {
455 334 fieldID = getFieldId( field, true );
456 335 }
457 336
458 - // Make sure fieldID is a string.
459 - // fieldID may be a number which doesn't include a .replace function.
460 - if ( 'function' !== typeof fieldID.replace ) {
461 - fieldID = fieldID.toString();
462 - }
463 -
464 337 if ( hasClass( field, 'frm_time_select' ) ) {
465 338 // set id for time field
466 339 fieldID = fieldID.replace( '-H', '' ).replace( '-m', '' );
467 340 } else if ( isSignatureField( field ) ) {
468 341 if ( val === '' ) {
469 - const fieldContainer = field.closest( '.frm_form_field' );
470 - const outputField = fieldContainer ? fieldContainer.querySelector( `[name="${ field.getAttribute( 'name' ).replace( '[typed]', '[output]' ) }"]` ) : null;
471 - val = outputField ? outputField.value : '';
342 + val = jQuery( field ).closest( '.frm_form_field' ).find( '[name="' + field.getAttribute( 'name' ).replace( '[typed]', '[output]' ) + '"]' ).val();
472 343 }
473 344 fieldID = fieldID.replace( '-typed', '' );
474 345 }
475 346
@@ -490,57 +361,36 @@
490 361
491 362 return errors;
492 363 }
493 364
494 - /**
495 - * @param {HTMLElement} field
496 - * @return {boolean} True if the input is a typed signature input.
497 - */
498 365 function isSignatureField( field ) {
499 - const name = field.getAttribute( 'name' );
366 + var name = field.getAttribute( 'name' );
500 367 return 'string' === typeof name && '[typed]' === name.substr( -7 );
501 368 }
502 369
503 - /**
504 - * @param {HTMLElement} field
505 - * @return {boolean} True if the field is a SSA appointment field.
506 - */
507 370 function isAppointmentField( field ) {
508 371 return hasClass( field, 'ssa_appointment_form_field_appointment_id' );
509 372 }
510 373
511 - /**
512 - * @param {HTMLElement} field
513 - * @return {boolean} True if the field is inline datepicker field.
514 - */
515 374 function isInlineDatepickerField( field ) {
516 375 return 'hidden' === field.type && '_alt' === field.id.substr( -4 ) && hasClass( field.nextElementSibling, 'frm_date_inline' );
517 376 }
518 377
519 - /**
520 - * @param {string|number} fileID
521 - * @return {string} File input value.
522 - */
523 378 function getFileVals( fileID ) {
524 - let val = '';
525 - const fileFields = document.querySelectorAll( `input[name="file${ fileID }"], input[name="file${ fileID }[]"], input[name^="item_meta[${ fileID }]"]` );
379 + var val = '',
380 + fileFields = jQuery( 'input[name="file' + fileID + '"], input[name="file' + fileID + '[]"], input[name^="item_meta[' + fileID + ']"]' );
526 381
527 - fileFields.forEach( function( field ) {
382 + fileFields.each( function() {
528 383 if ( val === '' ) {
529 - val = field.value;
384 + val = this.value;
530 385 }
531 - } );
386 + });
532 387 return val;
533 388 }
534 389
535 - /**
536 - * @param {HTMLElement} field
537 - * @param {Array} errors
538 - * @return {void}
539 - */
540 390 function checkUrlField( field, errors ) {
541 - let fieldID;
542 - const url = field.value;
391 + var fieldID,
392 + url = field.value;
543 393
544 394 if ( url !== '' && ! /^http(s)?:\/\/(?:localhost|(?:[\da-z\.-]+\.[\da-z\.-]+))/i.test( url ) ) {
545 395 fieldID = getFieldId( field, true );
546 396 if ( ! ( fieldID in errors ) ) {
@@ -546,92 +396,46 @@
546 396 if ( ! ( fieldID in errors ) ) {
547 397 errors[ fieldID ] = getFieldValidationMessage( field, 'data-invmsg' );
548 398 }
549 399 }
400 + return errors;
550 401 }
551 402
552 - /**
553 - * Checks if the confirm field should be checked.
554 - *
555 - * @since 6.15
556 - *
557 - * @param {HTMLElement} field Field input.
558 - * @param {boolean} onSubmit Is `true` if the form is being submitted.
559 - * @return {boolean} True if we should confirm the field.
560 - */
561 - function shouldCheckConfirmField( field, onSubmit ) {
562 - if ( onSubmit ) {
563 - // Always check on submitting.
564 - return true;
565 - }
403 + function checkEmailField( field, errors ) {
404 + var fieldID = getFieldId( field, true ),
405 + pattern = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/i;
566 406
567 - if ( 0 === field.id.indexOf( 'field_conf_' ) ) {
568 - // Always check if it's the confirm field.
569 - return true;
570 - }
571 -
572 - return false;
573 - }
574 -
575 - /**
576 - * Check the email field for errors.
577 - *
578 - * @since 6.15 Added `onSubmit` parameter.
579 - *
580 - * @param {HTMLElement} field Field input.
581 - * @param {Object} errors Errors data.
582 - * @param {boolean} onSubmit Is `true` if the form is being submitted.
583 - */
584 - function checkEmailField( field, errors, onSubmit ) {
585 - const fieldID = getFieldId( field, true );
586 - const pattern = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/i;
587 -
588 407 // validate the current field we're editing first
589 408 if ( '' !== field.value && pattern.test( field.value ) === false ) {
590 409 errors[ fieldID ] = getFieldValidationMessage( field, 'data-invmsg' );
591 410 }
592 411
593 - if ( shouldCheckConfirmField( field, onSubmit ) ) {
594 - confirmField( field, errors );
595 - }
412 + confirmField( field, errors );
413 + return errors;
596 414 }
597 415
598 - /**
599 - * Check the password field for errors.
600 - *
601 - * @since 6.15 Added `onSubmit` parameter.
602 - *
603 - * @param {HTMLElement} field Field input.
604 - * @param {Object} errors Errors data.
605 - * @param {boolean} onSubmit Is `true` if the form is being submitted.
606 - */
607 - function checkPasswordField( field, errors, onSubmit ) {
608 - if ( shouldCheckConfirmField( field, onSubmit ) ) {
609 - confirmField( field, errors );
610 - }
416 + function checkPasswordField( field, errors ) {
417 + confirmField( field, errors );
418 + return errors;
611 419 }
612 420
613 - /**
614 - * @param {HTMLElement} field
615 - * @param {Array} errors
616 - * @return {void}
617 - */
618 421 function confirmField( field, errors ) {
619 - const fieldID = getFieldId( field, true );
620 - const strippedId = field.id.replace( 'conf_', '' );
621 - const strippedFieldID = fieldID.replace( 'conf_', '' );
622 - const confirmField = document.getElementById( strippedId.replace( 'field_', 'field_conf_' ) );
422 + var value, confirmValue, firstField,
423 + fieldID = getFieldId( field, true ),
424 + strippedId = field.id.replace( 'conf_', '' ),
425 + strippedFieldID = fieldID.replace( 'conf_', '' ),
426 + confirmField = document.getElementById( strippedId.replace( 'field_', 'field_conf_' ) );
623 427
624 - if ( ! confirmField || errors[ `conf_${ strippedFieldID }` ] !== undefined ) {
428 + if ( confirmField === null || typeof errors[ 'conf_' + strippedFieldID ] !== 'undefined' ) {
625 429 return;
626 430 }
627 431
628 432 if ( fieldID !== strippedFieldID ) {
629 - const firstField = document.getElementById( strippedId );
630 - const { value } = firstField;
631 - const confirmValue = confirmField.value;
632 - if ( value !== confirmValue ) {
633 - errors[ `conf_${ strippedFieldID }` ] = getFieldValidationMessage( confirmField, 'data-confmsg' );
433 + firstField = document.getElementById( strippedId );
434 + value = firstField.value;
435 + confirmValue = confirmField.value;
436 + if ( '' !== value && '' !== confirmValue && value !== confirmValue ) {
437 + errors[ 'conf_' + strippedFieldID ] = getFieldValidationMessage( confirmField, 'data-confmsg' );
634 438 }
635 439 } else {
636 440 validateField( confirmField );
637 441 }
@@ -636,16 +440,11 @@
636 440 validateField( confirmField );
637 441 }
638 442 }
639 443
640 - /**
641 - * @param {HTMLElement} field
642 - * @param {Array} errors
643 - * @return {void}
644 - */
645 444 function checkNumberField( field, errors ) {
646 - let fieldID;
647 - const number = field.value;
445 + var fieldID,
446 + number = field.value;
648 447
649 448 if ( number !== '' && isNaN( number / 1 ) !== false ) {
650 449 fieldID = getFieldId( field, true );
651 450 if ( ! ( fieldID in errors ) ) {
@@ -651,200 +450,106 @@
651 450 if ( ! ( fieldID in errors ) ) {
652 451 errors[ fieldID ] = getFieldValidationMessage( field, 'data-invmsg' );
653 452 }
654 453 }
454 + return errors;
655 455 }
656 456
657 - /**
658 - * @param {HTMLElement} field
659 - * @param {Array} errors
660 - * @return {void}
661 - */
662 457 function checkPatternField( field, errors ) {
663 - let fieldID;
664 - const text = field.value;
665 - let format = getFieldValidationMessage( field, 'pattern' );
458 + var fieldID,
459 + text = field.value,
460 + format = getFieldValidationMessage( field, 'pattern' );
666 461
667 462 if ( format !== '' && text !== '' ) {
668 463 fieldID = getFieldId( field, true );
669 464 if ( ! ( fieldID in errors ) ) {
670 - if ( 'object' === typeof window.frmProForm && 'function' === typeof window.frmProForm.isIntlPhoneInput && window.frmProForm.isIntlPhoneInput( field ) ) {
671 - if ( ! window.frmProForm.validateIntlPhoneInput( field ) ) {
672 - errors[ fieldID ] = getFieldValidationMessage( field, 'data-invmsg' );
673 - }
674 - } else {
675 - format = new RegExp( `^${ format }$`, 'i' );
676 - if ( format.test( text ) === false ) {
677 - errors[ fieldID ] = getFieldValidationMessage( field, 'data-invmsg' );
678 - }
465 + format = new RegExp( '^' + format + '$', 'i' );
466 + if ( format.test( text ) === false ) {
467 + errors[ fieldID ] = getFieldValidationMessage( field, 'data-invmsg' );
679 468 }
680 469 }
681 470 }
471 + return errors;
682 472 }
683 473
684 - /**
685 - * Set color for select placeholders.
686 - *
687 - * @since 6.5.1
688 - */
689 - function setSelectPlaceholderColor() {
690 - const selects = document.querySelectorAll( '.form-field select' );
691 - const styleElement = document.querySelector( '.with_frm_style' );
692 - const textColorDisabled = styleElement ? getComputedStyle( styleElement ).getPropertyValue( '--text-color-disabled' ).trim() : '';
693 - // Exit if there are no select elements or the textColorDisabled property is missing
694 - if ( ! selects.length || ! textColorDisabled ) {
695 - return;
696 - }
474 + function hasInvisibleRecaptcha( object ) {
475 + var recaptcha, recaptchaID, alreadyChecked;
697 476
698 - // Function to change the color of a select element
699 - const changeSelectColor = function( select ) {
700 - if ( select.options[ select.selectedIndex ] && hasClass( select.options[ select.selectedIndex ], 'frm-select-placeholder' ) ) {
701 - select.style.setProperty( 'color', textColorDisabled, 'important' );
702 - } else {
703 - select.style.color = '';
704 - }
705 - };
706 -
707 - // Use a loop to iterate through each select element
708 - Array.prototype.forEach.call( selects, function( select ) {
709 - // Apply the color change to each select element
710 - changeSelectColor( select );
711 -
712 - // Add an event listener for future changes
713 - select.addEventListener( 'change', function() {
714 - changeSelectColor( select );
715 - } );
716 - } );
717 - }
718 -
719 - /**
720 - * @param {HTMLElement|jQuery} object
721 - *
722 - * @return {HTMLElement|false} Captcha element if there is an invisible recaptcha.
723 - */
724 - function hasInvisibleRecaptcha( object ) {
725 477 if ( isGoingToPrevPage( object ) ) {
726 478 return false;
727 479 }
728 480
729 - const form = object instanceof jQuery ? object.get( 0 ) : object;
730 - if ( ! form ) {
731 - return false;
732 - }
733 -
734 - const recaptcha = form.querySelector( '.frm-g-recaptcha[data-size="invisible"], .g-recaptcha[data-size="invisible"]' );
735 - if ( recaptcha ) {
736 - const recaptchaID = recaptcha.dataset.rid;
737 - const alreadyChecked = grecaptcha.getResponse( recaptchaID );
481 + recaptcha = jQuery( object ).find( '.frm-g-recaptcha[data-size="invisible"], .g-recaptcha[data-size="invisible"]' );
482 + if ( recaptcha.length ) {
483 + recaptchaID = recaptcha.data( 'rid' );
484 + alreadyChecked = grecaptcha.getResponse( recaptchaID );
738 485 if ( alreadyChecked.length === 0 ) {
739 486 return recaptcha;
487 + } else {
488 + return false;
740 489 }
490 + } else {
491 + return false;
741 492 }
742 -
743 - return false;
744 493 }
745 494
746 - /**
747 - * @param {HTMLElement} invisibleRecaptcha
748 - *
749 - * @return {void}
750 - */
751 495 function executeInvisibleRecaptcha( invisibleRecaptcha ) {
752 - const recaptchaID = invisibleRecaptcha.dataset.rid;
496 + var recaptchaID = invisibleRecaptcha.data( 'rid' );
753 497 grecaptcha.reset( recaptchaID );
754 498 grecaptcha.execute( recaptchaID );
755 499 }
756 500
757 501 function validateRecaptcha( form, errors ) {
758 - const formEl = form instanceof jQuery ? form.get( 0 ) : form;
759 - if ( ! formEl ) {
760 - return errors;
761 - }
502 + var recaptchaID, response, fieldContainer, fieldID,
503 + $recaptcha = jQuery( form ).find( '.frm-g-recaptcha' );
504 + if ( $recaptcha.length ) {
505 + recaptchaID = $recaptcha.data( 'rid' );
762 506
763 - const recaptcha = formEl.querySelector( '.frm-g-recaptcha' );
764 - if ( ! recaptcha ) {
765 - return errors;
766 - }
767 -
768 - const recaptchaID = recaptcha.dataset.rid;
769 - let response;
770 -
771 - try {
772 - response = grecaptcha.getResponse( recaptchaID );
773 - } catch ( e ) {
774 - if ( formEl.querySelector( 'input[name="recaptcha_checked"]' ) ) {
775 - return errors;
507 + try {
508 + response = grecaptcha.getResponse( recaptchaID );
509 + } catch ( e ) {
510 + if ( jQuery( form ).find( 'input[name="recaptcha_checked"]' ).length ) {
511 + return errors;
512 + } else {
513 + response = '';
514 + }
776 515 }
777 - response = '';
778 - }
779 516
780 - if ( response.length === 0 ) {
781 - const fieldContainer = recaptcha.closest( '.frm_form_field' );
782 - if ( fieldContainer?.id ) {
783 - const fieldID = fieldContainer.id.replace( 'frm_field_', '' ).replace( '_container', '' );
517 + if ( response.length === 0 ) {
518 + fieldContainer = $recaptcha.closest( '.frm_form_field' );
519 + fieldID = fieldContainer.attr( 'id' ).replace( 'frm_field_', '' ).replace( '_container', '' );
784 520 errors[ fieldID ] = '';
785 521 }
786 522 }
787 -
788 523 return errors;
789 524 }
790 525
791 - /**
792 - * @param {HTMLElement} field
793 - * @param {string} messageType
794 - * @return {string} The error message to display.
795 - */
796 526 function getFieldValidationMessage( field, messageType ) {
797 - let msg = field.getAttribute( messageType );
527 + var msg, errorHtml;
528 +
529 + msg = field.getAttribute( messageType );
798 530 if ( null === msg ) {
799 531 msg = '';
800 532 }
801 533
802 534 if ( '' !== msg && shouldWrapErrorHtmlAroundMessageType( messageType ) ) {
803 - msg = wrapErrorHtml( msg, field );
535 + errorHtml = field.getAttribute( 'data-error-html' );
536 + if ( null !== errorHtml ) {
537 + errorHtml = errorHtml.replace( /\+/g, '%20' );
538 + msg = decodeURIComponent( errorHtml ).replace( '[error]', msg );
539 + msg = msg.replace( '[key]', getFieldId( field, false ) );
540 + }
804 541 }
805 542
806 543 return msg;
807 544 }
808 545
809 - /**
810 - * @param {string} msg
811 - * @param {HTMLElement} field
812 - * @return {string} The error HTML to use.
813 - */
814 - function wrapErrorHtml( msg, field ) {
815 - let errorHtml = field.getAttribute( 'data-error-html' );
816 - if ( null === errorHtml ) {
817 - return msg;
818 - }
819 -
820 - errorHtml = errorHtml.replace( /\+/g, '%20' );
821 - msg = decodeURIComponent( errorHtml ).replace( '[error]', msg );
822 - const fieldId = getFieldId( field, false );
823 - const split = fieldId.split( '-' );
824 - const fieldIdParts = field.id.split( '_' );
825 - fieldIdParts.shift(); // Drop the "field" value from the front.
826 - split[ 0 ] = fieldIdParts.join( '_' );
827 - const errorKey = split.join( '-' );
828 - return msg.replace( '[key]', errorKey );
829 - }
830 -
831 546 function shouldWrapErrorHtmlAroundMessageType( type ) {
832 547 return 'pattern' !== type;
833 548 }
834 549
835 - /**
836 - * Check if JS validation should happen.
837 - *
838 - * @param {HTMLElement|Object} object Form object.
839 - * @return {boolean} True if validation is enabled and we are not saving a draft or going to a previous page.
840 - */
841 550 function shouldJSValidate( object ) {
842 - if ( 'function' === typeof object.get ) {
843 - // Get the HTMLElement from a jQuery object.
844 - object = object.get( 0 );
845 - }
846 - let validate = hasClass( object, 'frm_js_validate' );
551 + var validate = jQuery( object ).hasClass( 'frm_js_validate' );
847 552 if ( validate && typeof frmProForm !== 'undefined' && ( frmProForm.savingDraft( object ) || frmProForm.goingToPreviousPage( object ) ) ) {
848 553 validate = false;
849 554 }
850 555
@@ -850,97 +555,54 @@
850 555
851 556 return validate;
852 557 }
853 558
854 - /**
855 - * @param {HTMLElement} object
856 - * @param {string} action
857 - * @return {void}
858 - */
859 559 function getFormErrors( object, action ) {
860 - const fieldsets = object.querySelectorAll( '.frm_form_field' );
861 - fieldsets.forEach( field => field.classList.add( 'frm_doing_ajax' ) );
560 + var fieldset, data, success, error;
862 561
863 - const data = `${ jQuery( object ).serialize() }&action=frm_entries_${ action }&nonce=${ frm_js.nonce }`; // eslint-disable-line no-jquery/no-serialize
864 - const shouldTriggerEvent = object.classList.contains( 'frm_trigger_event_on_submit' );
562 + if ( typeof action === 'undefined' ) {
563 + jQuery( object ).find( 'input[name="frm_action"]' ).val();
564 + }
865 565
866 - const doRedirect = response => {
867 - jQuery( document ).trigger( 'frmBeforeFormRedirect', [ object, response ] );
566 + fieldset = jQuery( object ).find( '.frm_form_field' );
567 + fieldset.addClass( 'frm_doing_ajax' );
868 568
869 - if ( ! response.openInNewTab ) {
870 - // We return here because we're redirecting there is no need to update content.
871 - window.location = response.redirect;
872 - return;
873 - }
569 + data = jQuery( object ).serialize() + '&action=frm_entries_' + action + '&nonce=' + frm_js.nonce;
874 570
875 - // We don't return here because we're opening in a new tab, the old tab will still update.
876 - const newTab = window.open( response.redirect, '_blank' );
877 - if ( ! newTab && response.fallbackMsg && response.content ) {
878 - response.content = response.content.trim().replace( /(<\/div><\/div>)$/, ` ${ response.fallbackMsg }</div></div>` );
879 - }
880 - };
881 -
882 - const success = function( response ) {
883 - const defaultResponse = {
884 - content: '',
885 - errors: {},
886 - pass: false
887 - };
888 -
571 + success = function( response ) {
572 + var formID, replaceContent, pageOrder, formReturned, contSubmit, delay,
573 + $fieldCont, key, inCollapsedSection, frmTrigger,
574 + defaultResponse = { 'content': '', 'errors': {}, 'pass': false };
889 575 if ( response === null ) {
890 576 response = defaultResponse;
891 - } else {
892 - // Response is a string. Convert it to an object.
893 - response = response.replace( /^\s+|\s+$/g, '' );
894 - if ( response.indexOf( '{' ) === 0 ) {
895 - response = JSON.parse( response );
896 - } else {
897 - response = defaultResponse;
898 - }
899 577 }
900 578
901 - let willRedirect = false;
902 -
903 - if ( response.redirect !== undefined ) {
904 - if ( shouldTriggerEvent ) {
905 - triggerCustomEvent( object, 'frmSubmitEvent' );
906 - return;
907 - }
908 -
909 - if ( response.delay ) {
910 - setTimeout( function() {
911 - doRedirect( response );
912 - }, 1000 * response.delay );
913 - } else {
914 - doRedirect( response );
915 - }
916 -
917 - willRedirect = true;
579 + response = response.replace( /^\s+|\s+$/g, '' );
580 + if ( response.indexOf( '{' ) === 0 ) {
581 + response = JSON.parse( response );
582 + } else {
583 + response = defaultResponse;
918 584 }
919 585
920 - if ( 'string' === typeof response.content && response.content !== '' ) {
586 + if ( typeof response.redirect !== 'undefined' ) {
587 + jQuery( document ).trigger( 'frmBeforeFormRedirect', [ object, response ]);
588 + window.location = response.redirect;
589 + } else if ( response.content !== '' ) {
921 590 // the form or success message was returned
922 591
923 - if ( shouldTriggerEvent ) {
924 - triggerCustomEvent( object, 'frmSubmitEvent', { content: response.content } );
925 - return;
926 - }
927 -
928 592 removeSubmitLoading( jQuery( object ) );
929 593 if ( frm_js.offset != -1 ) {
930 594 frmFrontForm.scrollMsg( jQuery( object ), false );
931 595 }
932 -
933 - const formIdInput = object.querySelector( 'input[name="form_id"]' );
934 - const formID = formIdInput ? formIdInput.value : '';
596 + formID = jQuery( object ).find( 'input[name="form_id"]' ).val();
935 597 response.content = response.content.replace( / frm_pro_form /g, ' frm_pro_form frm_no_hide ' );
936 - const replaceContent = jQuery( object ).closest( '.frm_forms' ); // eslint-disable-line no-jquery/no-closest
598 + replaceContent = jQuery( object ).closest( '.frm_forms' );
937 599 removeAddedScripts( replaceContent, formID );
938 - const delay = maybeSlideOut( replaceContent, response.content );
600 + delay = maybeSlideOut( replaceContent, response.content );
939 601
940 602 setTimeout(
941 603 function() {
942 - afterFormSubmittedBeforeReplace( object, response );
604 + var container, input, previousInput;
943 605
944 606 replaceContent.replaceWith( response.content );
945 607
946 608 addUrlParam( response );
@@ -945,41 +607,49 @@
945 607
946 608 addUrlParam( response );
947 609
948 610 if ( typeof frmThemeOverride_frmAfterSubmit === 'function' ) { // eslint-disable-line camelcase
949 - const pageOrderInput = document.querySelector( `input[name="frm_page_order_${ formID }"]` );
950 - const pageOrder = pageOrderInput ? pageOrderInput.value : '';
951 - const tempDiv = document.createElement( 'div' );
952 - tempDiv.innerHTML = response.content;
953 - const formReturnedInput = tempDiv.querySelector( 'input[name="form_id"]' );
954 - const formReturned = formReturnedInput ? formReturnedInput.value : '';
611 + pageOrder = jQuery( 'input[name="frm_page_order_' + formID + '"]' ).val();
612 + formReturned = jQuery( response.content ).find( 'input[name="form_id"]' ).val();
955 613 frmThemeOverride_frmAfterSubmit( formReturned, pageOrder, response.content, object );
956 614 }
957 615
616 + if ( typeof response.recaptcha !== 'undefined' ) {
617 + container = jQuery( '#frm_form_' + formID + '_container' ).find( '.frm_fields_container' );
618 + input = '<input type="hidden" name="recaptcha_checked" value="' + response.recaptcha + '">';
619 + previousInput = container.find( 'input[name="recaptcha_checked"]' );
620 +
621 + if ( previousInput.length ) {
622 + previousInput.replaceWith( input );
623 + } else {
624 + container.append( input );
625 + }
626 + }
627 +
958 628 afterFormSubmitted( object, response );
959 629 },
960 630 delay
961 631 );
962 - } else if ( response.errors !== undefined && Object.keys( response.errors ).length ) {
632 + } else if ( Object.keys( response.errors ).length ) {
963 633 // errors were returned
634 +
964 635 removeSubmitLoading( jQuery( object ), 'enable' );
965 636
966 637 //show errors
967 - let contSubmit = true;
638 + contSubmit = true;
968 639 removeAllErrors();
969 640
970 - let $fieldCont = null;
641 + $fieldCont = null;
971 642
972 - for ( const key in response.errors ) {
973 - const fieldContEl = object.querySelector( `#frm_field_${ key }_container` );
974 - $fieldCont = fieldContEl ? jQuery( fieldContEl ) : jQuery();
643 + for ( key in response.errors ) {
644 + $fieldCont = jQuery( object ).find( '#frm_field_' + key + '_container' );
975 645
976 646 if ( $fieldCont.length ) {
977 - if ( ! $fieldCont.is( ':visible' ) ) { // eslint-disable-line no-jquery/no-is
978 - const inCollapsedSection = $fieldCont.closest( '.frm_toggle_container' ); // eslint-disable-line no-jquery/no-closest, formidable/no-jquery-variable-methods
647 + if ( ! $fieldCont.is( ':visible' ) ) {
648 + inCollapsedSection = $fieldCont.closest( '.frm_toggle_container' );
979 649 if ( inCollapsedSection.length ) {
980 - let frmTrigger = inCollapsedSection.prev();
981 - if ( ! frmTrigger.hasClass( 'frm_trigger' ) ) { // eslint-disable-line formidable/no-jquery-variable-methods
650 + frmTrigger = inCollapsedSection.prev();
651 + if ( ! frmTrigger.hasClass( 'frm_trigger' ) ) {
982 652 // If the frmTrigger object is the section description, check to see if the previous element is the trigger
983 653 frmTrigger = frmTrigger.prev( '.frm_trigger' );
984 654 }
985 655 frmTrigger.trigger( 'click' );
@@ -985,9 +655,9 @@
985 655 frmTrigger.trigger( 'click' );
986 656 }
987 657 }
988 658
989 - if ( $fieldCont.is( ':visible' ) ) { // eslint-disable-line no-jquery/no-is
659 + if ( $fieldCont.is( ':visible' ) ) {
990 660 addFieldError( $fieldCont, key, response.errors );
991 661 contSubmit = false;
992 662 }
993 663 }
@@ -992,10 +662,11 @@
992 662 }
993 663 }
994 664 }
995 665
996 - object.querySelectorAll( '.frm-g-recaptcha, .g-recaptcha, .h-captcha' ).forEach( function( captchaEl ) {
997 - const recaptchaID = captchaEl.dataset.rid;
666 + jQuery( object ).find( '.frm-g-recaptcha, .g-recaptcha' ).each( function() {
667 + var $recaptcha = jQuery( this ),
668 + recaptchaID = $recaptcha.data( 'rid' );
998 669
999 670 if ( typeof grecaptcha !== 'undefined' && grecaptcha ) {
1000 671 if ( recaptchaID ) {
1001 672 grecaptcha.reset( recaptchaID );
@@ -1002,33 +673,23 @@
1002 673 } else {
1003 674 grecaptcha.reset();
1004 675 }
1005 676 }
677 + });
1006 678
1007 - if ( typeof hcaptcha !== 'undefined' && hcaptcha ) {
1008 - hcaptcha.reset();
1009 - }
1010 - } );
679 + jQuery( document ).trigger( 'frmFormErrors', [ object, response ]);
1011 680
1012 - if ( window.turnstile ) {
1013 - object.querySelectorAll( '.frm-cf-turnstile' ).forEach(
1014 - turnstileField => turnstileField.dataset.rid && turnstile.reset( turnstileField.dataset.rid )
1015 - );
1016 - }
1017 -
1018 - jQuery( document ).trigger( 'frmFormErrors', [ object, response ] );
1019 -
1020 - fieldsets.forEach( field => field.classList.remove( 'frm_doing_ajax' ) );
681 + fieldset.removeClass( 'frm_doing_ajax' );
1021 682 scrollToFirstField( object );
1022 683
1023 684 if ( contSubmit ) {
1024 685 object.submit();
1025 686 } else {
1026 - object.insertAdjacentHTML( 'afterbegin', response.error_message );
687 + jQuery( object ).prepend( response.error_message );
1027 688 checkForErrorsAndMaybeSetFocus();
1028 689 }
1029 - } else if ( ! willRedirect ) { // Avoid double submission if redirecting to a page.
1030 - // There may have been a plugin conflict, or the form is not set to submit with ajax.
690 + } else {
691 + // there may have been a plugin conflict, or the form is not set to submit with ajax
1031 692
1032 693 showFileLoading( object );
1033 694
1034 695 object.submit();
@@ -1034,12 +695,10 @@
1034 695 object.submit();
1035 696 }
1036 697 };
1037 698
1038 - const error = function() {
1039 - object.querySelectorAll( 'input[type="submit"], input[type="button"]' ).forEach(
1040 - button => button.disabled = false
1041 - );
699 + error = function() {
700 + jQuery( object ).find( 'input[type="submit"], input[type="button"]' ).prop( 'disabled', false );
1042 701 object.submit();
1043 702 };
1044 703
1045 704 postToAjaxUrl( object, data, success, error );
@@ -1045,20 +704,22 @@
1045 704 postToAjaxUrl( object, data, success, error );
1046 705 }
1047 706
1048 707 function postToAjaxUrl( form, data, success, error ) {
1049 - let ajaxUrl = frm_js.ajax_url;
1050 - const action = form.getAttribute( 'action' );
708 + var ajaxUrl, action, ajaxParams;
1051 709
1052 - if ( 'string' === typeof action && action.includes( '?action=frm_forms_preview' ) ) {
1053 - ajaxUrl = action.split( '?action=frm_forms_preview' )[ 0 ];
710 + ajaxUrl = frm_js.ajax_url;
711 + action = form.getAttribute( 'action' );
712 +
713 + if ( 'string' === typeof action && -1 !== action.indexOf( '?action=frm_forms_preview' ) ) {
714 + ajaxUrl = action.split( '?action=frm_forms_preview' )[0];
1054 715 }
1055 716
1056 - const ajaxParams = {
717 + ajaxParams = {
1057 718 type: 'POST',
1058 719 url: ajaxUrl,
1059 - data,
1060 - success
720 + data: data,
721 + success: success
1061 722 };
1062 723
1063 724 if ( 'function' === typeof error ) {
1064 725 ajaxParams.error = error;
@@ -1063,54 +724,34 @@
1063 724 if ( 'function' === typeof error ) {
1064 725 ajaxParams.error = error;
1065 726 }
1066 727
1067 - jQuery.ajax( ajaxParams ); // eslint-disable-line no-jquery/no-ajax
728 + jQuery.ajax( ajaxParams );
1068 729 }
1069 730
1070 731 function afterFormSubmitted( object, response ) {
1071 - const tempDiv = document.createElement( 'div' );
1072 - tempDiv.innerHTML = response.content;
1073 - const formCompleted = tempDiv.querySelector( '.frm_message' );
1074 - if ( formCompleted ) {
1075 - jQuery( document ).trigger( 'frmFormComplete', [ object, response ] );
732 + var formCompleted = jQuery( response.content ).find( '.frm_message' );
733 + if ( formCompleted.length ) {
734 + jQuery( document ).trigger( 'frmFormComplete', [ object, response ]);
1076 735 } else {
1077 - jQuery( document ).trigger( 'frmPageChanged', [ object, response ] );
736 + jQuery( document ).trigger( 'frmPageChanged', [ object, response ]);
1078 737 }
1079 738 }
1080 739
1081 - /**
1082 - * Trigger an event before the form is replaced with a success message.
1083 - *
1084 - * @since 6.9
1085 - *
1086 - * @param {HTMLElement} object The form.
1087 - * @param {Object} response The response from submitting the form with AJAX.
1088 - * @return {void}
1089 - */
1090 - function afterFormSubmittedBeforeReplace( object, response ) {
1091 - const tempDiv = document.createElement( 'div' );
1092 - tempDiv.innerHTML = response.content;
1093 - const formCompleted = tempDiv.querySelector( '.frm_message' );
1094 - if ( formCompleted ) {
1095 - triggerCustomEvent( document, 'frmFormCompleteBeforeReplace', { object, response } );
1096 - }
1097 - }
1098 -
1099 740 function removeAddedScripts( formContainer, formID ) {
1100 - const endReplace = document.querySelectorAll( `.frm_end_ajax_${ formID }` );
741 + var endReplace = jQuery( '.frm_end_ajax_' + formID );
1101 742 if ( endReplace.length ) {
1102 - formContainer.nextUntil( `.frm_end_ajax_${ formID }` ).remove();
1103 - endReplace.forEach( el => el.remove() );
743 + formContainer.nextUntil( '.frm_end_ajax_' + formID ).remove();
744 + endReplace.remove();
1104 745 }
1105 746 }
1106 747
1107 748 function maybeSlideOut( oldContent, newContent ) {
1108 - let c;
1109 - let newClass = 'frm_slideout';
1110 - if ( newContent.includes( ' frm_slide' ) ) {
749 + var c,
750 + newClass = 'frm_slideout';
751 + if ( newContent.indexOf( ' frm_slide' ) !== -1 ) {
1111 752 c = oldContent.children();
1112 - if ( newContent.includes( ' frm_going_back' ) ) {
753 + if ( newContent.indexOf( ' frm_going_back' ) !== -1 ) {
1113 754 newClass += ' frm_going_back';
1114 755 }
1115 756 c.removeClass( 'frm_going_back' );
1116 757 c.addClass( newClass );
@@ -1119,28 +760,30 @@
1119 760 return 0;
1120 761 }
1121 762
1122 763 function addUrlParam( response ) {
1123 - let url;
1124 - if ( history.pushState && response.page !== undefined ) {
764 + var url;
765 + if ( history.pushState && typeof response.page !== 'undefined' ) {
1125 766 url = addQueryVar( 'frm_page', response.page );
1126 - window.history.pushState( { html: response.html }, '', `?${ url }` );
767 + window.history.pushState({ 'html': response.html }, '', '?' + url );
1127 768 }
1128 769 }
1129 770
1130 771 function addQueryVar( key, value ) {
772 + var kvp, i, x;
773 +
1131 774 key = encodeURI( key );
1132 775 value = encodeURI( value );
1133 776
1134 - const kvp = document.location.search.substr( 1 ).split( '&' );
777 + kvp = document.location.search.substr( 1 ).split( '&' );
1135 778
1136 - let i = kvp.length;
779 + i = kvp.length;
1137 780 while ( i-- ) {
1138 - const x = kvp[ i ].split( '=' );
781 + x = kvp[i].split( '=' );
1139 782
1140 - if ( x[ 0 ] == key ) {
1141 - x[ 1 ] = value;
1142 - kvp[ i ] = x.join( '=' );
783 + if ( x[0] == key ) {
784 + x[1] = value;
785 + kvp[i] = x.join( '=' );
1143 786 break;
1144 787 }
1145 788 }
1146 789
@@ -1151,159 +794,73 @@
1151 794 return kvp.join( '&' );
1152 795 }
1153 796
1154 797 function addFieldError( $fieldCont, key, jsErrors ) {
1155 - const container = $fieldCont instanceof jQuery ? $fieldCont.get( 0 ) : $fieldCont;
798 + var input, id, describedBy, roleString;
799 + if ( $fieldCont.length && $fieldCont.is( ':visible' ) ) {
800 + $fieldCont.addClass( 'frm_blank_field' );
801 + input = $fieldCont.find( 'input, select, textarea' );
802 + id = 'frm_error_field_' + key;
803 + describedBy = input.attr( 'aria-describedby' );
1156 804
1157 - if ( ! container || container.offsetParent === null ) {
1158 - return;
1159 - }
805 + if ( typeof frmThemeOverride_frmPlaceError === 'function' ) { // eslint-disable-line camelcase
806 + frmThemeOverride_frmPlaceError( key, jsErrors );
807 + } else {
808 + if ( -1 !== jsErrors[key].indexOf( '<div' ) ) {
809 + $fieldCont.append(
810 + jsErrors[key]
811 + );
812 + } else {
813 + roleString = frm_js.include_alert_role ? 'role="alert"' : '';
814 + $fieldCont.append( '<div class="frm_error" ' + roleString + ' id="' + id + '">' + jsErrors[key] + '</div>' );
815 + }
1160 816
1161 - container.classList.add( 'frm_blank_field' );
1162 - const inputs = container.querySelectorAll( 'input, select, textarea' );
1163 - const id = getErrorElementId( key, inputs[ 0 ] );
1164 -
1165 - let describedBy;
1166 -
1167 - if ( typeof frmThemeOverride_frmPlaceError === 'function' ) { // eslint-disable-line camelcase
1168 - frmThemeOverride_frmPlaceError( key, jsErrors );
1169 - } else {
1170 - let errorHtml;
1171 - if ( jsErrors[ key ].includes( '<div' ) ) {
1172 - errorHtml = jsErrors[ key ];
1173 - } else {
1174 - const roleString = frm_js.include_alert_role ? 'role="alert"' : '';
1175 - errorHtml = `<div class="frm_error" ${ roleString } id="${ id }">${ jsErrors[ key ] }</div>`;
1176 - }
1177 - container.insertAdjacentHTML( 'beforeend', errorHtml );
1178 - inputs.forEach( input => {
1179 - describedBy = input.getAttribute( 'aria-describedby' );
1180 - if ( ! describedBy ) {
817 + if ( typeof describedBy === 'undefined' ) {
1181 818 describedBy = id;
1182 - } else if ( ! describedBy.includes( id ) && ! describedBy.includes( 'frm_error_field_' ) ) {
1183 - const { errorFirst } = input.dataset;
1184 - if ( errorFirst === '0' ) {
1185 - describedBy = `${ describedBy } ${ id }`;
819 + } else if ( describedBy.indexOf( id ) === -1 && describedBy.indexOf( 'frm_error_field_' ) === -1 ) {
820 + if ( input.data( 'error-first' ) === 0 ) {
821 + describedBy = describedBy + ' ' + id;
1186 822 } else {
1187 - describedBy = `${ id } ${ describedBy }`;
823 + describedBy = id + ' ' + describedBy;
1188 824 }
1189 825 }
1190 - input.setAttribute( 'aria-describedby', describedBy );
1191 - } );
1192 - }
1193 826
1194 - inputs.forEach( input => {
1195 - if ( [ 'radio', 'checkbox' ].includes( input.type ) ) {
1196 - const group = input.closest( '[role="radiogroup"], [role="group"]' );
1197 - if ( group ) {
1198 - group.setAttribute( 'aria-invalid', 'true' );
1199 - }
1200 - } else {
1201 - input.setAttribute( 'aria-invalid', 'true' );
827 + input.attr( 'aria-describedby', describedBy );
1202 828 }
1203 - } );
829 + input.attr( 'aria-invalid', true );
1204 830
1205 - jQuery( document ).trigger( 'frmAddFieldError', [ jQuery( container ), key, jsErrors ] );
1206 - }
1207 -
1208 - /**
1209 - * Get the ID to use for an error element added when submitting with AJAX.
1210 - *
1211 - * @param {string} key
1212 - * @param {HTMLElement} input
1213 - * @return {string} The ID to use for the error element.
1214 - */
1215 - function getErrorElementId( key, input ) {
1216 - if ( isNaN( key ) || ! input || ! input.id ) {
1217 - // If key isn't a number, assume it's already in the right format.
1218 - return `frm_error_field_${ key }`;
831 + jQuery( document ).trigger( 'frmAddFieldError', [ $fieldCont, key, jsErrors ]);
1219 832 }
1220 - return `frm_error_${ input.id }`;
1221 833 }
1222 834
1223 - /**
1224 - * Removes errors before validating with JS.
1225 - * This prevents issues with stale errors that has since been fixed.
1226 - *
1227 - * @param {HTMLElement|jQuery} fieldCont Field container element.
1228 - * @return {void}
1229 - */
1230 - function removeFieldError( fieldCont ) {
1231 - const container = fieldCont instanceof jQuery ? fieldCont.get( 0 ) : fieldCont;
1232 - if ( ! container ) {
1233 - return;
1234 - }
835 + function removeFieldError( $fieldCont ) {
836 + var errorMessage = $fieldCont.find( '.frm_error' ),
837 + errorId = errorMessage.attr( 'id' ),
838 + input = $fieldCont.find( 'input, select, textarea' ),
839 + describedBy = input.attr( 'aria-describedby' );
1235 840
1236 - const errorMessage = container.querySelector( '.frm_error' );
1237 - const input = container.querySelector( 'input, select, textarea' );
841 + $fieldCont.removeClass( 'frm_blank_field has-error' );
842 + errorMessage.remove();
843 + input.attr( 'aria-invalid', false );
844 + input.removeAttr( 'aria-describedby' );
1238 845
1239 - container.classList.remove( 'frm_blank_field', 'has-error' );
1240 -
1241 - if ( input ) {
1242 - if ( 'true' === input.getAttribute( 'aria-invalid' ) ) {
1243 - input.setAttribute( 'aria-invalid', 'false' );
1244 - } else if ( [ 'radio', 'checkbox' ].includes( input.type ) ) {
1245 - const group = input.closest( '[role="radiogroup"], [role="group"]' );
1246 - if ( group ) {
1247 - group.setAttribute( 'aria-invalid', 'false' );
1248 - }
1249 - }
846 + if ( typeof describedBy !== 'undefined' ) {
847 + describedBy = describedBy.replace( errorId, '' );
848 + input.attr( 'aria-describedby', describedBy );
1250 849 }
1251 -
1252 - if ( errorMessage ) {
1253 - removeElementFromInputDescribedBy( errorMessage );
1254 - errorMessage.remove();
1255 - }
1256 850 }
1257 851
1258 - /**
1259 - * Updates the aria-describedby attribute, removing the target element ID.
1260 - *
1261 - * @since 6.32
1262 - *
1263 - * @param {HTMLElement} el The target element that is removed from the aria-describedby data.
1264 - * @return {void}
1265 - */
1266 - function removeElementFromInputDescribedBy( el ) {
1267 - document.querySelectorAll( `[aria-describedby*="${ el.id }"]` ).forEach( input => {
1268 - let ariaDescribedBy = input.getAttribute( 'aria-describedby' ).split( ' ' );
1269 - ariaDescribedBy = ariaDescribedBy.filter( value => {
1270 - const trimmedValue = value.trim();
1271 - return trimmedValue && trimmedValue !== el.id;
1272 - } );
1273 -
1274 - if ( ariaDescribedBy.length ) {
1275 - input.setAttribute( 'aria-describedby', ariaDescribedBy.join( ' ' ) );
1276 - return;
1277 - }
1278 - input.removeAttribute( 'aria-describedby' );
1279 - } );
1280 - }
1281 -
1282 852 function removeAllErrors() {
1283 - document.querySelectorAll( '.form-field' ).forEach( field => {
1284 - field.classList.remove( 'frm_blank_field', 'has-error' );
1285 - } );
1286 - document.querySelectorAll( '.form-field .frm_error' ).forEach( el => {
1287 - removeElementFromInputDescribedBy( el );
1288 - el.remove();
1289 - } );
1290 - document.querySelectorAll( '.frm_error_style' ).forEach( error => error.remove() );
853 + jQuery( '.form-field' ).removeClass( 'frm_blank_field has-error' );
854 + jQuery( '.form-field .frm_error' ).replaceWith( '' );
855 + jQuery( '.frm_error_style' ).remove();
1291 856 }
1292 857
1293 - /**
1294 - * @param {HTMLElement|Object} object Form object.
1295 - * @return {void}
1296 - */
1297 858 function scrollToFirstField( object ) {
1298 - if ( 'function' === typeof object.get ) {
1299 - // Get the HTMLElement from a jQuery object.
1300 - object = object.get( 0 );
859 + var field = jQuery( object ).find( '.frm_blank_field' ).first();
860 + if ( field.length ) {
861 + frmFrontForm.scrollMsg( field, object, true );
1301 862 }
1302 - const field = object.querySelector( '.frm_blank_field' );
1303 - if ( field ) {
1304 - frmFrontForm.scrollMsg( jQuery( field ), object, true );
1305 - }
1306 863 }
1307 864
1308 865 function showSubmitLoading( $object ) {
1309 866 showLoadingIndicator( $object );
@@ -1311,9 +868,9 @@
1311 868 disableSaveDraft( $object );
1312 869 }
1313 870
1314 871 function showLoadingIndicator( $object ) {
1315 - if ( ! $object.hasClass( 'frm_loading_form' ) && ! $object.hasClass( 'frm_loading_prev' ) ) { // eslint-disable-line no-jquery/no-class, formidable/no-jquery-variable-methods
872 + if ( ! $object.hasClass( 'frm_loading_form' ) && ! $object.hasClass( 'frm_loading_prev' ) ) {
1316 873 addLoadingClass( $object );
1317 874 $object.trigger( 'frmStartFormLoading' );
1318 875 }
1319 876 }
@@ -1318,48 +875,110 @@
1318 875 }
1319 876 }
1320 877
1321 878 function addLoadingClass( $object ) {
1322 - const loadingClass = isGoingToPrevPage( $object ) ? 'frm_loading_prev' : 'frm_loading_form';
879 + var loadingClass = isGoingToPrevPage( $object ) ? 'frm_loading_prev' : 'frm_loading_form';
1323 880
1324 - $object.addClass( loadingClass ); // eslint-disable-line no-jquery/no-class, formidable/no-jquery-variable-methods
881 + $object.addClass( loadingClass );
1325 882 }
1326 883
1327 884 function isGoingToPrevPage( $object ) {
1328 - return typeof frmProForm !== 'undefined' && frmProForm.goingToPreviousPage( $object );
885 + return ( typeof frmProForm !== 'undefined' && frmProForm.goingToPreviousPage( $object ) );
1329 886 }
1330 887
1331 - function removeSubmitLoading( _, enable, processesRunning ) {
888 + function removeSubmitLoading( $object, enable, processesRunning ) {
889 + var loadingForm;
890 +
1332 891 if ( processesRunning > 0 ) {
1333 892 return;
1334 893 }
1335 894
1336 - document.querySelectorAll( '.frm_loading_form' ).forEach( function( form ) {
1337 - form.classList.remove( 'frm_loading_form', 'frm_loading_prev' );
1338 - jQuery( form ).trigger( 'frmEndFormLoading' );
895 + loadingForm = jQuery( '.frm_loading_form' );
896 + loadingForm.removeClass( 'frm_loading_form' );
897 + loadingForm.removeClass( 'frm_loading_prev' );
1339 898
1340 - if ( enable === 'enable' ) {
1341 - enableSubmitButton( form );
1342 - enableSaveDraft( form );
899 + loadingForm.trigger( 'frmEndFormLoading' );
900 +
901 + if ( enable === 'enable' ) {
902 + enableSubmitButton( loadingForm );
903 + enableSaveDraft( loadingForm );
904 + }
905 + }
906 +
907 + function showFileLoading( object ) {
908 + var fileval,
909 + loading = document.getElementById( 'frm_loading' );
910 + if ( loading !== null ) {
911 + fileval = jQuery( object ).find( 'input[type=file]' ).val();
912 + if ( typeof fileval !== 'undefined' && fileval !== '' ) {
913 + setTimeout( function() {
914 + jQuery( loading ).fadeIn( 'slow' );
915 + }, 2000 );
1343 916 }
1344 - } );
917 + }
1345 918 }
1346 919
1347 - function showFileLoading( object ) {
1348 - const loading = document.getElementById( 'frm_loading' );
1349 - if ( ! loading ) {
1350 - return;
920 + function clearDefault() {
921 + /*jshint validthis:true */
922 + toggleDefault( jQuery( this ), 'clear' );
923 + }
924 +
925 + function replaceDefault() {
926 + /*jshint validthis:true */
927 + toggleDefault( jQuery( this ), 'replace' );
928 + }
929 +
930 + function toggleDefault( $thisField, e ) {
931 + // TODO: Fix this for a default value that is a number or array
932 + var thisVal,
933 + v = $thisField.data( 'frmval' ).replace( /(\n|\r\n)/g, '\r' );
934 + if ( v === '' || typeof v === 'undefined' ) {
935 + return false;
1351 936 }
937 + thisVal = $thisField.val().replace( /(\n|\r\n)/g, '\r' );
1352 938
1353 - const fileInput = object.querySelector( 'input[type=file]' );
1354 - const fileval = fileInput ? fileInput.value : '';
1355 - if ( fileval !== '' ) {
1356 - setTimeout( function() {
1357 - jQuery( loading ).fadeIn( 'slow' ); // eslint-disable-line no-jquery/no-fade
1358 - }, 2000 );
939 + if ( 'replace' === e ) {
940 + if ( thisVal === '' ) {
941 + $thisField.addClass( 'frm_default' ).val( v );
942 + }
943 + } else if ( thisVal == v ) {
944 + $thisField.removeClass( 'frm_default' ).val( '' );
1359 945 }
1360 946 }
1361 947
948 + function resendEmail() {
949 + /*jshint validthis:true */
950 + var $link = jQuery( this ),
951 + entryId = this.getAttribute( 'data-eid' ),
952 + formId = this.getAttribute( 'data-fid' ),
953 + label = $link.find( '.frm_link_label' );
954 + if ( label.length < 1 ) {
955 + label = $link;
956 + }
957 + label.append( '<span class="frm-wait"></span>' );
958 +
959 + jQuery.ajax({
960 + type: 'POST',
961 + url: frm_js.ajax_url,
962 + data: {
963 + action: 'frm_entries_send_email',
964 + entry_id: entryId,
965 + form_id: formId,
966 + nonce: frm_js.nonce
967 + },
968 + success: function( msg ) {
969 + var admin = document.getElementById( 'wpbody' );
970 + if ( admin === null ) {
971 + label.html( msg );
972 + } else {
973 + label.html( '' );
974 + $link.after( msg );
975 + }
976 + }
977 + });
978 + return false;
979 + }
980 +
1362 981 /**********************************************
1363 982 * General Helpers
1364 983 *********************************************/
1365 984
@@ -1364,12 +983,109 @@
1364 983 *********************************************/
1365 984
1366 985 function confirmClick() {
1367 986 /*jshint validthis:true */
1368 - const message = this.dataset.frmconfirm;
987 + var message = jQuery( this ).data( 'frmconfirm' );
1369 988 return confirm( message );
1370 989 }
1371 990
991 + function toggleDiv() {
992 + /*jshint validthis:true */
993 + var div = jQuery( this ).data( 'frmtoggle' );
994 + if ( jQuery( div ).is( ':visible' ) ) {
995 + jQuery( div ).slideUp( 'fast' );
996 + } else {
997 + jQuery( div ).slideDown( 'fast' );
998 + }
999 + return false;
1000 + }
1001 +
1002 + /**********************************************
1003 + * Fallback functions
1004 + *********************************************/
1005 +
1006 + function addIndexOfFallbackForIE8() {
1007 + var len, from;
1008 +
1009 + if ( ! Array.prototype.indexOf ) {
1010 + Array.prototype.indexOf = function( elt /*, from*/ ) {
1011 + len = this.length >>> 0;
1012 +
1013 + from = Number( arguments[1]) || 0;
1014 + from = ( from < 0 ) ? Math.ceil( from ) : Math.floor( from );
1015 + if ( from < 0 ) {
1016 + from += len;
1017 + }
1018 +
1019 + for ( ; from < len; from++ ) {
1020 + if ( from in this && this[from] === elt ) {
1021 + return from;
1022 + }
1023 + }
1024 + return -1;
1025 + };
1026 + }
1027 + }
1028 +
1029 + function addTrimFallbackForIE8() {
1030 + if ( typeof String.prototype.trim !== 'function' ) {
1031 + String.prototype.trim = function() {
1032 + return this.replace( /^\s+|\s+$/g, '' );
1033 + };
1034 + }
1035 + }
1036 +
1037 + function addFilterFallbackForIE8() {
1038 + var t, len, res, thisp, i, val;
1039 +
1040 + if ( ! Array.prototype.filter ) {
1041 +
1042 + Array.prototype.filter = function( fun /*, thisp */ ) {
1043 +
1044 + if ( this === void 0 || this === null ) {
1045 + throw new TypeError();
1046 + }
1047 +
1048 + t = Object( this );
1049 + len = t.length >>> 0;
1050 + if ( typeof fun !== 'function' ) {
1051 + throw new TypeError();
1052 + }
1053 +
1054 + res = [];
1055 + thisp = arguments[1];
1056 + for ( i = 0; i < len; i++ ) {
1057 + if ( i in t ) {
1058 + val = t[i]; // in case fun mutates this
1059 + if ( fun.call( thisp, val, i, t ) ) {
1060 + res.push( val );
1061 + }
1062 + }
1063 + }
1064 +
1065 + return res;
1066 + };
1067 + }
1068 + }
1069 +
1070 + function addKeysFallbackForIE8() {
1071 + var keys, i;
1072 +
1073 + if ( ! Object.keys ) {
1074 + Object.keys = function( obj ) {
1075 + keys = [];
1076 +
1077 + for ( i in obj ) {
1078 + if ( obj.hasOwnProperty( i ) ) {
1079 + keys.push( i );
1080 + }
1081 + }
1082 +
1083 + return keys;
1084 + };
1085 + }
1086 + }
1087 +
1372 1088 /**
1373 1089 * Check for -webkit-box-shadow css value for input:-webkit-autofill selector.
1374 1090 * If this is a match, the User is autofilling the input on a Webkit browser.
1375 1091 * We want to delete the Honeypot field, otherwise it will get triggered as spam on autocomplete.
@@ -1374,12 +1090,11 @@
1374 1090 * If this is a match, the User is autofilling the input on a Webkit browser.
1375 1091 * We want to delete the Honeypot field, otherwise it will get triggered as spam on autocomplete.
1376 1092 */
1377 1093 function onHoneypotFieldChange() {
1378 - /*jshint validthis:true */
1379 - const css = window.getComputedStyle( this ).boxShadow;
1380 - if ( css?.match( /inset/ ) ) {
1381 - this.remove();
1094 + var css = jQuery( this ).css( 'box-shadow' );
1095 + if ( css.match( /inset/ ) ) {
1096 + this.parentNode.removeChild( this );
1382 1097 }
1383 1098 }
1384 1099
1385 1100 /**
@@ -1400,64 +1115,38 @@
1400 1115 if ( ! label ) {
1401 1116 return;
1402 1117 }
1403 1118
1404 - label.addEventListener( 'click', function() {
1119 + label.addEventListener( 'click', function( e ) {
1405 1120 inputsContainer.querySelector( '.frm_form_field:first-child input, .frm_form_field:first-child select, .frm_form_field:first-child textarea' ).focus();
1406 - } );
1407 - } );
1121 + });
1122 + });
1408 1123 }
1409 1124
1410 - /**
1411 - * Sets focus on a the first subfield of a combo field that has an error.
1412 - *
1413 - * @since 6.16.3
1414 - *
1415 - * @param {HTMLElement} element
1416 - * @return {boolean} True if the focus was set on a combo field.
1417 - */
1418 - function maybeFocusOnComboSubField( element ) {
1419 - if ( 'FIELDSET' !== element.nodeName ) {
1420 - return false;
1421 - }
1422 - if ( ! element.querySelector( '.frm_combo_inputs_container' ) ) {
1423 - return false;
1424 - }
1425 - const comboSubfield = element.querySelector( '[aria-invalid="true"]' );
1426 - if ( comboSubfield ) {
1427 - focusInput( comboSubfield );
1428 - return true;
1429 - }
1430 - return false;
1431 - }
1125 + function checkForErrorsAndMaybeSetFocus() {
1126 + var errors, element, timeoutCallback;
1432 1127
1433 - function checkForErrorsAndMaybeSetFocus() {
1434 1128 if ( ! frm_js.focus_first_error ) {
1435 1129 return;
1436 1130 }
1437 1131
1438 - const errors = document.querySelectorAll( '.frm_form_field .frm_error' );
1132 + errors = document.querySelectorAll( '.frm_form_field .frm_error' );
1439 1133 if ( ! errors.length ) {
1440 1134 return;
1441 1135 }
1442 1136
1443 - let element = errors[ 0 ];
1444 - let timeoutCallback;
1137 + element = errors[0];
1445 1138 do {
1446 1139 element = element.previousSibling;
1447 - if ( [ 'input', 'select', 'textarea' ].includes( element.nodeName.toLowerCase() ) ) {
1448 - focusInput( element );
1140 + if ( -1 !== [ 'input', 'select', 'textarea' ].indexOf( element.nodeName.toLowerCase() ) ) {
1141 + element.focus();
1449 1142 break;
1450 1143 }
1451 1144
1452 - if ( maybeFocusOnComboSubField( element ) ) {
1453 - break;
1454 - }
1455 -
1456 - if ( element.classList !== undefined ) {
1145 + if ( 'undefined' !== typeof element.classList ) {
1457 1146 if ( element.classList.contains( 'html-active' ) ) {
1458 1147 timeoutCallback = function() {
1459 - const textarea = element.querySelector( 'textarea' );
1148 + var textarea = element.querySelector( 'textarea' );
1460 1149 if ( null !== textarea ) {
1461 1150 textarea.focus();
1462 1151 }
1463 1152 };
@@ -1464,14 +1153,8 @@
1464 1153 } else if ( element.classList.contains( 'tmce-active' ) ) {
1465 1154 timeoutCallback = function() {
1466 1155 tinyMCE.activeEditor.focus();
1467 1156 };
1468 - } else if ( element.classList.contains( 'frm_opt_container' ) ) {
1469 - const firstInput = element.querySelector( 'input' );
1470 - if ( firstInput ) {
1471 - focusInput( firstInput );
1472 - break;
1473 - }
1474 1157 }
1475 1158
1476 1159 if ( 'function' === typeof timeoutCallback ) {
1477 1160 setTimeout( timeoutCallback, 0 );
@@ -1481,21 +1164,16 @@
1481 1164 } while ( element.previousSibling );
1482 1165 }
1483 1166
1484 1167 /**
1485 - * Focus a visible input, or possibly delay the focus event until the form has faded in.
1168 + * Checks if is on IE browser.
1486 1169 *
1487 - * @since 6.16.3
1170 + * @since 5.4
1488 1171 *
1489 - * @param {HTMLElement} input
1490 - * @return {void}
1172 + * @return {Boolean}
1491 1173 */
1492 - function focusInput( input ) {
1493 - if ( input.offsetParent !== null ) {
1494 - input.focus();
1495 - } else {
1496 - triggerCustomEvent( document, 'frmMaybeDelayFocus', { input } );
1497 - }
1174 + function isIE() {
1175 + return navigator.userAgent.indexOf( 'MSIE' ) > -1 || navigator.userAgent.indexOf( 'Trident' ) > -1;
1498 1176 }
1499 1177
1500 1178 /**
1501 1179 * Does the same as jQuery( document ).on( 'event', 'selector', handler ).
@@ -1501,24 +1179,24 @@
1501 1179 * Does the same as jQuery( document ).on( 'event', 'selector', handler ).
1502 1180 *
1503 1181 * @since 5.4
1504 1182 *
1505 - * @param {string} event Event name.
1506 - * @param {string} selector Selector.
1507 - * @param {Function} handler Handler.
1508 - * @param {boolean | Object} options Options to be added to `addEventListener()` method. Default is `false`.
1183 + * @param {String} event Event name.
1184 + * @param {String} selector Selector.
1185 + * @param {Function} handler Handler.
1186 + * @param {Boolean|Object} options Options to be added to `addEventListener()` method. Default is `false`.
1509 1187 */
1510 1188 function documentOn( event, selector, handler, options ) {
1511 - if ( options === undefined ) {
1189 + if ( 'undefined' === typeof options ) {
1512 1190 options = false;
1513 1191 }
1514 1192
1515 1193 document.addEventListener( event, function( e ) {
1516 - let target;
1194 + var target;
1517 1195
1518 1196 // loop parent nodes from the target to the delegation node.
1519 1197 for ( target = e.target; target && target != this; target = target.parentNode ) {
1520 - if ( target.matches && target.matches( selector ) ) {
1198 + if ( target.matches( selector ) ) {
1521 1199 handler.call( target, e );
1522 1200 break;
1523 1201 }
1524 1202 }
@@ -1525,23 +1203,27 @@
1525 1203 }, options );
1526 1204 }
1527 1205
1528 1206 function initFloatingLabels() {
1529 - const selector = '.frm-show-form .frm_inside_container input, .frm-show-form .frm_inside_container select, .frm-show-form .frm_inside_container textarea';
1530 - const floatClass = 'frm_label_float_top';
1207 + var checkFloatLabel, checkDropdownLabel, checkPlaceholderIE, runOnLoad, selector, floatClass;
1531 1208
1532 - const checkFloatLabel = function( input ) {
1533 - const container = input.closest( '.frm_inside_container' );
1209 + selector = '.frm-show-form .frm_inside_container input, .frm-show-form .frm_inside_container select, .frm-show-form .frm_inside_container textarea';
1210 + floatClass = 'frm_label_float_top';
1211 +
1212 + checkFloatLabel = function( input ) {
1213 + var container, shouldFloatTop, firstOpt;
1214 +
1215 + container = input.closest( '.frm_inside_container' );
1534 1216 if ( ! container ) {
1535 1217 return;
1536 1218 }
1537 1219
1538 - const shouldFloatTop = input.value || document.activeElement === input;
1220 + shouldFloatTop = input.value || document.activeElement === input;
1539 1221
1540 1222 container.classList.toggle( floatClass, shouldFloatTop );
1541 1223
1542 1224 if ( 'SELECT' === input.tagName ) {
1543 - const firstOpt = input.querySelector( 'option:first-child' );
1225 + firstOpt = input.querySelector( 'option:first-child' );
1544 1226
1545 1227 if ( shouldFloatTop ) {
1546 1228 if ( firstOpt.hasAttribute( 'data-label' ) ) {
1547 1229 firstOpt.textContent = firstOpt.getAttribute( 'data-label' );
@@ -1546,26 +1228,49 @@
1546 1228 if ( firstOpt.hasAttribute( 'data-label' ) ) {
1547 1229 firstOpt.textContent = firstOpt.getAttribute( 'data-label' );
1548 1230 firstOpt.removeAttribute( 'data-label' );
1549 1231 }
1550 - } else if ( firstOpt.textContent ) {
1551 - firstOpt.setAttribute( 'data-label', firstOpt.textContent );
1552 - firstOpt.textContent = '';
1232 + } else {
1233 + if ( firstOpt.textContent ) {
1234 + firstOpt.setAttribute( 'data-label', firstOpt.textContent );
1235 + firstOpt.textContent = '';
1236 + }
1553 1237 }
1238 + } else if ( isIE() ) {
1239 + checkPlaceholderIE( input );
1554 1240 }
1555 1241 };
1556 1242
1557 - const checkDropdownLabel = function() {
1558 - document.querySelectorAll( `.frm-show-form .frm_inside_container:not(.${ floatClass }) select` ).forEach( function( input ) {
1559 - const firstOpt = input.querySelector( 'option:first-child' );
1243 + checkDropdownLabel = function() {
1244 + document.querySelectorAll( '.frm-show-form .frm_inside_container:not(.' + floatClass + ') select' ).forEach( function( input ) {
1245 + var firstOpt = input.querySelector( 'option:first-child' );
1560 1246
1561 1247 if ( firstOpt.textContent ) {
1562 1248 firstOpt.setAttribute( 'data-label', firstOpt.textContent );
1563 1249 firstOpt.textContent = '';
1564 1250 }
1565 - } );
1251 + });
1566 1252 };
1567 1253
1254 + checkPlaceholderIE = function( input ) {
1255 + if ( input.value ) {
1256 + // Don't need to handle this case because placeholder isn't shown.
1257 + return;
1258 + }
1259 +
1260 + if ( document.activeElement === input ) {
1261 + if ( input.hasAttribute( 'data-placeholder' ) ) {
1262 + input.placeholder = input.getAttribute( 'data-placeholder' );
1263 + input.removeAttribute( 'data-placeholder' );
1264 + }
1265 + } else {
1266 + if ( input.placeholder ) {
1267 + input.setAttribute( 'data-placeholder', input.placeholder );
1268 + input.placeholder = '';
1269 + }
1270 + }
1271 + };
1272 +
1568 1273 [ 'focus', 'blur', 'change' ].forEach( function( eventName ) {
1569 1274 documentOn(
1570 1275 eventName,
1571 1276 selector,
@@ -1573,17 +1278,21 @@
1573 1278 checkFloatLabel( event.target );
1574 1279 },
1575 1280 true
1576 1281 );
1577 - } );
1282 + });
1578 1283
1579 - const runOnLoad = function( firstLoad ) {
1580 - if ( firstLoad && document.activeElement && [ 'INPUT', 'SELECT', 'TEXTAREA' ].includes( document.activeElement.tagName ) ) {
1284 + jQuery( document ).on( 'change', selector, function( event ) {
1285 + checkFloatLabel( event.target );
1286 + });
1287 +
1288 + runOnLoad = function( firstLoad ) {
1289 + if ( firstLoad && document.activeElement && -1 !== [ 'INPUT', 'SELECT', 'TEXTAREA' ].indexOf( document.activeElement.tagName ) ) {
1581 1290 checkFloatLabel( document.activeElement );
1582 1291 } else if ( firstLoad ) {
1583 1292 document.querySelectorAll( '.frm_inside_container' ).forEach(
1584 1293 function( container ) {
1585 - const input = container.querySelector( 'input, select, textarea' );
1294 + var input = container.querySelector( 'input, select, textarea' );
1586 1295 if ( input && '' !== input.value ) {
1587 1296 checkFloatLabel( input );
1588 1297 }
1589 1298 }
@@ -1590,9 +1299,14 @@
1590 1299 );
1591 1300 }
1592 1301
1593 1302 checkDropdownLabel();
1594 - calcProductsTotal();
1303 +
1304 + if ( isIE() ) {
1305 + document.querySelectorAll( selector ).forEach( function( input ) {
1306 + checkPlaceholderIE( input );
1307 + });
1308 + }
1595 1309 };
1596 1310
1597 1311 runOnLoad( true );
1598 1312
@@ -1597,610 +1311,40 @@
1597 1311 runOnLoad( true );
1598 1312
1599 1313 jQuery( document ).on( 'frmPageChanged', function( event ) {
1600 1314 runOnLoad();
1601 - } );
1315 + });
1602 1316
1603 1317 document.addEventListener( 'frm_after_start_over', function( event ) {
1604 1318 runOnLoad();
1605 - } );
1319 + });
1606 1320 }
1607 1321
1608 - function shouldUpdateValidityMessage( target ) {
1609 - if ( 'INPUT' !== target.nodeName ) {
1610 - return false;
1611 - }
1322 + return {
1323 + init: function() {
1324 + maybeAddPolyfills();
1612 1325
1613 - if ( ! target.dataset.invmsg ) {
1614 - return false;
1615 - }
1326 + jQuery( document ).off( 'submit.formidable', '.frm-show-form' );
1327 + jQuery( document ).on( 'submit.formidable', '.frm-show-form', frmFrontForm.submitForm );
1616 1328
1617 - if ( 'text' !== target.getAttribute( 'type' ) ) {
1618 - return false;
1619 - }
1620 -
1621 - if ( target.classList.contains( 'frm_verify' ) ) {
1622 - return false;
1623 - }
1624 -
1625 - return true;
1626 - }
1627 -
1628 - function maybeClearCustomValidityMessage( event, field ) {
1629 - let key;
1630 - let isInvalid = false;
1631 -
1632 - if ( ! shouldUpdateValidityMessage( field ) ) {
1633 - return;
1634 - }
1635 -
1636 - for ( key in field.validity ) {
1637 - if ( 'customError' === key ) {
1638 - continue;
1639 - }
1640 - if ( 'valid' !== key && field.validity[ key ] === true ) {
1641 - isInvalid = true;
1642 - break;
1643 - }
1644 - }
1645 -
1646 - if ( ! isInvalid ) {
1647 - field.setCustomValidity( '' );
1648 - }
1649 - }
1650 -
1651 - function maybeShowNewTabFallbackMessage() {
1652 - if ( ! window.frmShowNewTabFallback ) {
1653 - return;
1654 - }
1655 -
1656 - const messageEl = document.querySelector( `#frm_form_${ frmShowNewTabFallback.formId }_container .frm_message` );
1657 - if ( ! messageEl ) {
1658 - return;
1659 - }
1660 -
1661 - messageEl.insertAdjacentHTML( 'beforeend', ` ${ frmShowNewTabFallback.message }` );
1662 - }
1663 -
1664 - function setCustomValidityMessage() {
1665 - const forms = document.getElementsByClassName( 'frm-show-form' );
1666 - const { length } = forms;
1667 -
1668 - for ( let index = 0; index < length; ++index ) {
1669 - forms[ index ].addEventListener(
1670 - 'invalid',
1671 - function( event ) {
1672 - const { target } = event;
1673 -
1674 - if ( shouldUpdateValidityMessage( target ) ) {
1675 - target.setCustomValidity( target.dataset.invmsg );
1676 - }
1677 - },
1678 - true
1679 - );
1680 - }
1681 - }
1682 -
1683 - function enableSubmitButtonOnBackButtonPress() {
1684 - window.addEventListener( 'pageshow', function( event ) {
1685 - if ( event.persisted ) {
1686 - document.querySelectorAll( '.frm_loading_form' ).forEach(
1687 - function( form ) {
1688 - enableSubmitButton( form );
1689 - }
1690 - );
1691 - removeSubmitLoading();
1692 - }
1693 - } );
1694 - }
1695 -
1696 - /**
1697 - * Destroys the formidable generated global hcaptcha object since it wouldn't otherwise render.
1698 - */
1699 - function destroyhCaptcha() {
1700 - if ( ! window.hasOwnProperty( 'hcaptcha' ) || ! document.querySelector( '.frm-show-form .h-captcha' ) ) {
1701 - return;
1702 - }
1703 - window.hcaptcha = null;
1704 - }
1705 -
1706 - /**
1707 - * @since 6.16.3
1708 - *
1709 - * @return {string} Unique key, used for duplicate checks.
1710 - */
1711 - function getUniqueKey() {
1712 - const uniqueKey = Array.from( window.crypto.getRandomValues( new Uint8Array( 8 ) ) )
1713 - .map( b => b.toString( 16 ).padStart( 2, '0' ) )
1714 - .join( '' );
1715 - const timestamp = Date.now().toString( 16 );
1716 - return `${ uniqueKey }-${ timestamp }`;
1717 - }
1718 -
1719 - /**
1720 - * Animates the scroll position of the document.
1721 - *
1722 - * @since 6.20
1723 - *
1724 - * @param {number} start
1725 - * @param {number} end
1726 - * @param {number} duration
1727 - * @return {void}
1728 - */
1729 - function animateScroll( start, end, duration ) {
1730 - if ( ! window.hasOwnProperty( 'performance' ) || ! window.hasOwnProperty( 'requestAnimationFrame' ) ) {
1731 - document.documentElement.scrollTop = end;
1732 - return;
1733 - }
1734 -
1735 - const startTime = performance.now();
1736 - const step = currentTime => {
1737 - const progress = Math.min( ( currentTime - startTime ) / duration, 1 );
1738 - document.documentElement.scrollTop = start + ( ( end - start ) * progress );
1739 - if ( progress < 1 ) {
1740 - requestAnimationFrame( step );
1741 - }
1742 - };
1743 - requestAnimationFrame( step );
1744 - }
1745 -
1746 - /**
1747 - * Make sure that the captcha label for a reCAPTCHA or Turnstile field matches the response input ID.
1748 - * This is determined dynamically, so we check for the ID after the input is rendered.
1749 - * hCaptcha is handled separately, in the frmCaptcha function as it is not rendered explicitly.
1750 - *
1751 - * @since 6.25.1
1752 - *
1753 - * @param {HTMLElement} captcha
1754 - * @return {void}
1755 - */
1756 - function maybeFixCaptchaLabel( captcha ) {
1757 - const form = captcha.closest( 'form' );
1758 - if ( ! form ) {
1759 - return;
1760 - }
1761 -
1762 - const label = form.querySelector( 'label[for="g-recaptcha-response"], label[for="cf-turnstile-response"]' );
1763 - const captchaResponse = form.querySelector( '[name="g-recaptcha-response"], [name="cf-turnstile-response"]' );
1764 -
1765 - if ( label && captchaResponse ) {
1766 - label.htmlFor = captchaResponse.id;
1767 - }
1768 - }
1769 -
1770 - /**
1771 - * Check to make sure the quantity field value is within the min and max values.
1772 - *
1773 - * @param {HTMLElement} input
1774 - * @return {number} The quantity value.
1775 - */
1776 - function checkQuantityFieldMinMax( input ) {
1777 - if ( '' === input.value ) {
1778 - // Leave the value if it is empty.
1779 - return 0;
1780 - }
1781 -
1782 - const val = parseFloat( input.value ? input.value.trim() : 0 );
1783 - if ( isNaN( val ) ) {
1784 - return 0;
1785 - }
1786 -
1787 - let max = input.hasAttribute( 'max' ) ? parseFloat( input.getAttribute( 'max' ) ) : 0;
1788 - let min = input.hasAttribute( 'min' ) ? parseFloat( input.getAttribute( 'min' ) ) : 0;
1789 -
1790 - max = isNaN( max ) ? 0 : max;
1791 - min = isNaN( min ) ? 0 : Math.max( 0, min );
1792 -
1793 - if ( val < min ) {
1794 - input.value = min;
1795 - return min;
1796 - }
1797 -
1798 - if ( 0 !== max && val > max ) {
1799 - input.value = max;
1800 - return max;
1801 - }
1802 -
1803 - return val;
1804 - }
1805 -
1806 - function triggerChange( input, fieldKey ) {
1807 - if ( fieldKey === undefined ) {
1808 - fieldKey = 'dependent';
1809 - }
1810 -
1811 - jQuery( input ).trigger( { type: 'change', selfTriggered: true, frmTriggered: fieldKey } );
1812 - }
1813 -
1814 - /**
1815 - * Calculates the total price.
1816 - *
1817 - * @param {Event|undefined} e The event object.
1818 - * @return {void}
1819 - */
1820 - function calcProductsTotal( e ) {
1821 - if ( 'object' === typeof frmProForm ) {
1822 - // Pro is installed, use the Pro JS.
1823 - return;
1824 - }
1825 -
1826 - if ( typeof __FRMCURR === 'undefined' ) {
1827 - return;
1828 - }
1829 -
1830 - const totalFields = document.querySelectorAll( '[data-frmtotal]' );
1831 - if ( ! totalFields.length ) {
1832 - return;
1833 - }
1834 -
1835 - const formTotals = [];
1836 -
1837 - totalFields.forEach( totalField => {
1838 - let total = 0;
1839 - const form = totalField.closest( 'form' );
1840 -
1841 - if ( ! form ) {
1842 - return;
1843 - }
1844 -
1845 - const formId = form.querySelector( 'input[name="form_id"]' ).value;
1846 - const currency = getCurrency( formId );
1847 -
1848 - if ( undefined !== formTotals[ formId ] ) {
1849 - total = formTotals[ formId ];
1850 - } else {
1851 - form.querySelectorAll( 'input[data-frmprice],select:has([data-frmprice])' ).forEach( function( input ) {
1852 - let quantity = 0;
1853 - let price = 0;
1854 - const isSingle = 'hidden' === input.type;
1855 -
1856 - if ( input.tagName === 'SELECT' ) {
1857 - if ( input.selectedIndex !== -1 ) {
1858 - price = input.options[ input.selectedIndex ].getAttribute( 'data-frmprice' );
1859 - }
1860 - } else {
1861 - if ( ! isSingle && ! input.matches( ':checked' ) ) {
1862 - return;
1863 - }
1864 - price = input.getAttribute( 'data-frmprice' );
1865 - }
1866 -
1867 - if ( ! price ) {
1868 - price = 0;
1869 - } else {
1870 - price = preparePrice( price, currency );
1871 - quantity = getQuantity( input );
1872 - price = parseFloat( quantity ) * parseFloat( price );
1873 - }
1874 -
1875 - if ( 'true' === input.getAttribute( 'data-frmdiscount' ) ) {
1876 - price = price * -1;
1877 - }
1878 -
1879 - total += price;
1880 - } );
1881 -
1882 - formTotals[ formId ] = total;
1883 - }
1884 -
1885 - total = isNaN( total ) ? 0 : total;
1886 -
1887 - // Set a decimal separator for currency if no default for it
1888 - currency.decimal_separator = currency.decimal_separator.trim(); // first remove unnecessary space(s)
1889 - if ( ! currency.decimal_separator.length ) {
1890 - currency.decimal_separator = '.';
1891 - }
1892 -
1893 - totalField.value = roundTotal( total, currency );
1894 - total = normalizeTotal( total, currency );
1895 -
1896 - // because of e.g. fields that might be using this field for calculations
1897 - triggerChange( totalField );
1898 -
1899 - total = formatCurrency( total, currency );
1900 - const formatted = totalField.previousElementSibling;
1901 - if ( formatted?.matches( '.frm_total_formatted' ) ) {
1902 - // Use innerHTML so that currency symbols like Euros can render and not their encoded string value.
1903 - formatted.innerHTML = total;
1904 - return;
1905 - }
1906 -
1907 - const formattedEls = totalField.closest( '.frm_form_field' ).querySelectorAll( '.frm_total_formatted' );
1908 - formattedEls.forEach( formattedEl => {
1909 - // Use innerHTML so that currency symbols like Euros can render and not their encoded string value.
1910 - formattedEl.innerHTML = total;
1911 - } );
1912 - } );
1913 - }
1914 -
1915 - /**
1916 - * Round total and maybe add trailing zeros so formatCurrency has a proper format to work with.
1917 - *
1918 - * @param {number} total The total amount to normalize.
1919 - * @param {Object} currency The currency object containing decimal information.
1920 - * @return {string} The normalized total amount.
1921 - */
1922 - function normalizeTotal( total, currency ) {
1923 - const isLargeTotal = total > Number.MAX_SAFE_INTEGER;
1924 -
1925 - total = roundTotal( total, currency );
1926 -
1927 - return maybeAddTrailingZeroToPrice( total, currency, isLargeTotal );
1928 - }
1929 -
1930 - function roundTotal( total, currency ) {
1931 - const isLargeTotal = total > Number.MAX_SAFE_INTEGER;
1932 -
1933 - if ( ! isLargeTotal ) {
1934 - const { decimals } = currency;
1935 - total = decimals > 0 ? round10( total, decimals ) : Math.ceil( total );
1936 - }
1937 -
1938 - return total;
1939 - }
1940 -
1941 - function round10( value, decimals ) {
1942 - return Number( `${ Math.round( `${ value }e${ decimals }` ) }e-${ decimals }` );
1943 - }
1944 -
1945 - /**
1946 - * Format a numeric value according to the specified currency format settings.
1947 - *
1948 - * @param {string} total The numeric value to format.
1949 - * @param {Object} currency The currency formatting configuration.
1950 - * @return {string} The formatted currency string.
1951 - */
1952 - function formatCurrency( total, currency ) {
1953 - total = maybeAddTrailingZeroToPrice( total, currency );
1954 - if ( total.length && ( total[ total.length - 1 ] === '.' || total[ total.length - 1 ] === currency.decimal_separator ) ) {
1955 - total = total.substr( 0, total.length - 1 );
1956 - }
1957 -
1958 - total = maybeRemoveTrailingZerosFromPrice( total, currency );
1959 - total = addThousands( total, currency );
1960 -
1961 - const leftSymbol = currency.symbol_left ? ( currency.symbol_left + currency.symbol_padding ) : '';
1962 - const rightSymbol = currency.symbol_right ? ( currency.symbol_padding + currency.symbol_right ) : '';
1963 -
1964 - return `${ leftSymbol }${ total }${ rightSymbol }`;
1965 - }
1966 -
1967 - /**
1968 - * Gets currency from form id.
1969 - *
1970 - * @param {number} formId Form ID.
1971 - * @return {Object} Currency object.
1972 - */
1973 - function getCurrency( formId ) {
1974 - if ( undefined !== window.__FRMCURR && undefined !== window.__FRMCURR[ formId ] ) {
1975 - return window.__FRMCURR[ formId ];
1976 - }
1977 -
1978 - return {
1979 - symbol_left: '$',
1980 - symbol_right: '',
1981 - symbol_padding: '',
1982 - thousand_separator: ',',
1983 - decimal_separator: '.',
1984 - decimals: 2,
1985 - };
1986 - }
1987 -
1988 - /**
1989 - * Gets quantity.
1990 - *
1991 - * @param {HTMLElement} field The field element.
1992 - * @return {number} The quantity.
1993 - */
1994 - function getQuantity( field ) {
1995 - const fieldID = frmFrontForm.getFieldId( field, false );
1996 - if ( ! fieldID ) {
1997 - return 0;
1998 - }
1999 -
2000 - const quantityField = getQuantityField( field, fieldID );
2001 - if ( ! quantityField ) {
2002 - // If there is no quantity field, assume 1.
2003 - return 1;
2004 - }
2005 -
2006 - return checkQuantityFieldMinMax( quantityField );
2007 - }
2008 -
2009 - /**
2010 - * Gets quantity field.
2011 - *
2012 - * @param {HTMLElement} element The element.
2013 - * @param {number} fieldID The field ID.
2014 - * @return {HTMLElement|null} The quantity field.
2015 - */
2016 - function getQuantityField( element, fieldID ) {
2017 - const quantityFields = element.closest( 'form' ).querySelectorAll( '[data-frmproduct]' );
2018 - if ( ! quantityFields.length ) {
2019 - return null;
2020 - }
2021 -
2022 - fieldID = fieldID.toString();
2023 -
2024 - return Array.from( quantityFields ).find( element => {
2025 - let ids;
2026 -
2027 - ids = JSON.parse( element.getAttribute( 'data-frmproduct' ).trim() );
2028 - if ( '' === ids ) {
2029 - return false;
2030 - }
2031 -
2032 - // Convert to array if necessary because of existing fields that are already using single product fields.
2033 - ids = 'string' === typeof ids ? [ ids ] : ids;
2034 - return ids.includes( fieldID );
2035 - } );
2036 - }
2037 -
2038 - /**
2039 - * Prepare a price for calculation.
2040 - *
2041 - * @param {number|string} price The price to prepare.
2042 - * @param {Object} currency The currency object containing decimal information.
2043 - * @return {string} The prepared price.
2044 - */
2045 - function preparePrice( price, currency ) {
2046 - if ( ! price ) {
2047 - return 0;
2048 - }
2049 - price = `${ price }`; // convert to string just to be sure
2050 -
2051 - const regex = getRegexForPrice( currency );
2052 -
2053 - const matches = price.match( regex );
2054 - if ( null === matches ) {
2055 - return 0;
2056 - }
2057 -
2058 - price = matches.length ? matches[ matches.length - 1 ] : 0;
2059 - price = price.trim();
2060 -
2061 - // Fix issues with parsing Fr.15.00. The regex catches .15.00.
2062 - // This checks for the leading decimal and removes it.
2063 - if ( currency.decimal_separator === '.' && 3 === price.split( '.' ).length && price[ 0 ] === '.' ) {
2064 - price = price.substr( 1 );
2065 - }
2066 -
2067 - if ( price ) {
2068 - price = maybeUseDecimal( price, currency );
2069 - price = price.split( currency.thousand_separator ).join( '' ).replace( currency.decimal_separator, '.' );
2070 - }
2071 -
2072 - return price;
2073 - }
2074 -
2075 - /**
2076 - * @param {Object} currency The currency object.
2077 - * @return {RegExp} The regular expression object.
2078 - */
2079 - function getRegexForPrice( currency ) {
2080 - let regexString = '[0-9,.';
2081 -
2082 - if ( currency.thousand_separator !== '.' && currency.thousand_separator !== ',' ) {
2083 - regexString += currency.thousand_separator;
2084 - }
2085 - if ( currency.decimal_separator !== '.' && currency.decimal_separator !== ',' ) {
2086 - regexString += currency.decimal_separator;
2087 - }
2088 -
2089 - regexString += ']*\\.?\\,?[0-9]+';
2090 -
2091 - return new RegExp( regexString, 'g' );
2092 - }
2093 -
2094 - /**
2095 - * Maybe replace the decimal separator with the currency's decimal separator.
2096 - *
2097 - * @param {string} price The price string.
2098 - * @param {Object} currency The currency object.
2099 - * @return {string} The modified price string.
2100 - */
2101 - function maybeUseDecimal( price, currency ) {
2102 - let usedForDecimal;
2103 - let priceParts;
2104 - if ( '.' === currency.thousand_separator ) {
2105 - priceParts = price.split( '.' );
2106 - usedForDecimal = 2 === priceParts.length && 2 === priceParts[ 1 ].length;
2107 - if ( usedForDecimal ) {
2108 - price = price.replace( '.', currency.decimal_separator );
2109 - }
2110 - }
2111 - return price;
2112 - }
2113 -
2114 - /**
2115 - * Add trailing zeros to a price if necessary and replace the decimal separator.
2116 - *
2117 - * @param {number|string} price The price to format.
2118 - * @param {Object} currency The currency object containing the decimal separator.
2119 - * @param {boolean} [force=false] Whether to force processing even if the price is not a number.
2120 - * @return {string} The formatted price string.
2121 - */
2122 - function maybeAddTrailingZeroToPrice( price, currency, force = false ) {
2123 - if ( 'number' !== typeof price && ! force ) {
2124 - return price;
2125 - }
2126 -
2127 - price = String( price ); // first convert to string
2128 - const pos = price.indexOf( '.' );
2129 -
2130 - if ( pos === -1 ) {
2131 - price = `${ price }.`;
2132 -
2133 - for ( let n = 0; n < currency.decimals; ++n ) {
2134 - price += '0';
2135 - }
2136 - } else {
2137 - const decimalsString = price.substring( pos + 1 );
2138 - if ( decimalsString.length < currency.decimals ) {
2139 - if ( decimalsString.length < 2 ) {
2140 - price += '0';
1329 + jQuery( '.frm-show-form input[onblur], .frm-show-form textarea[onblur]' ).each( function() {
1330 + if ( jQuery( this ).val() === '' ) {
1331 + jQuery( this ).trigger( 'blur' );
2141 1332 }
1333 + });
2142 1334
2143 - for ( let n = 2; n < currency.decimals; ++n ) {
2144 - price += '0';
2145 - }
2146 - }
2147 - }
1335 + jQuery( document ).on( 'focus', '.frm_toggle_default', clearDefault );
1336 + jQuery( document ).on( 'blur', '.frm_toggle_default', replaceDefault );
1337 + jQuery( '.frm_toggle_default' ).trigger( 'blur' );
2148 1338
2149 - return price.replace( '.', currency.decimal_separator );
2150 - }
1339 + jQuery( document.getElementById( 'frm_resend_email' ) ).on( 'click', resendEmail );
2151 1340
2152 - /**
2153 - * Format a numeric string by adding thousand separators.
2154 - *
2155 - * @param {string|number} price The numeric value to format.
2156 - * @param {Object} options Formatting options.
2157 - * @param {string} options.decimal_separator Character used as decimal separator.
2158 - * @param {string} options.thousand_separator Character used as thousand separator.
2159 - *
2160 - * @return {string} The price string with thousand separators.
2161 - */
2162 - function addThousands( price, options ) {
2163 - const split = options.decimal_separator === ''
2164 - ? [ price.toString() ]
2165 - : price.split( options.decimal_separator );
2166 -
2167 - if ( options.thousand_separator ) {
2168 - split[ 0 ] = split[ 0 ].replace( /\B(?=(\d{3})+(?!\d))/g, options.thousand_separator );
2169 - }
2170 -
2171 - return split.join( options.decimal_separator );
2172 - }
2173 -
2174 - /**
2175 - * Maybe remove trailing zeros from a price string.
2176 - *
2177 - * @param {string} price The price string.
2178 - * @param {Object} currency The currency data.
2179 - *
2180 - * @return {string} The price string with trailing zeros removed.
2181 - */
2182 - function maybeRemoveTrailingZerosFromPrice( price, currency ) {
2183 - const split = price.split( currency.decimal_separator );
2184 - if ( 2 !== split.length || split[ 1 ].length <= currency.decimals ) {
2185 - return price;
2186 - }
2187 - if ( 0 === currency.decimals ) {
2188 - return split[ 0 ];
2189 - }
2190 - return `${ split[ 0 ] }${ currency.decimal_separator }${ split[ 1 ].substr( 0, currency.decimals ) }`;
2191 - }
2192 -
2193 - return {
2194 - init() {
2195 - jQuery( document ).off( 'submit.formidable', '.frm-show-form' );
2196 - jQuery( document ).on( 'submit.formidable', '.frm-show-form', frmFrontForm.submitForm );
2197 -
2198 1341 jQuery( document ).on( 'change', '.frm-show-form input[name^="item_meta"], .frm-show-form select[name^="item_meta"], .frm-show-form textarea[name^="item_meta"]', frmFrontForm.fieldValueChanged );
2199 1342
2200 - jQuery( document ).on( 'change', '.frm_verify[id^=field_]', onHoneypotFieldChange );
1343 + jQuery( document ).on( 'change', '[id^=frm_email_]', onHoneypotFieldChange );
2201 1344
2202 1345 jQuery( document ).on( 'click', 'a[data-frmconfirm]', confirmClick );
1346 + jQuery( 'a[data-frmtoggle]' ).on( 'click', toggleDiv );
2203 1347
2204 1348 checkForErrorsAndMaybeSetFocus();
2205 1349
2206 1350 // Focus on the first sub field when clicking to the primary label of combo field.
@@ -2205,128 +1349,104 @@
2205 1349
2206 1350 // Focus on the first sub field when clicking to the primary label of combo field.
2207 1351 changeFocusWhenClickComboFieldLabel();
2208 1352
1353 + // Add fallbacks for the beloved IE8
1354 + addIndexOfFallbackForIE8();
1355 + addTrimFallbackForIE8();
1356 + addFilterFallbackForIE8();
1357 + addKeysFallbackForIE8();
1358 +
2209 1359 initFloatingLabels();
2210 - maybeShowNewTabFallbackMessage();
1360 + },
2211 1361
2212 - jQuery( document ).on( 'frmAfterAddRow', setCustomValidityMessage );
2213 - setCustomValidityMessage();
2214 - jQuery( document ).on( 'frmFieldChanged', maybeClearCustomValidityMessage );
2215 -
2216 - setSelectPlaceholderColor();
2217 -
2218 - // Elementor popup show event. Fix Elementor Popup && FF Captcha field conflicts
2219 - jQuery( document ).on( 'elementor/popup/show', frmRecaptcha );
2220 -
2221 - enableSubmitButtonOnBackButtonPress();
2222 - jQuery( document ).on(
2223 - 'frmPageChanged',
2224 - destroyhCaptcha
2225 - );
2226 -
2227 - jQuery( document ).on( 'frmAfterAddRow frmAfterRemoveRow', calcProductsTotal );
2228 - jQuery( document ).on( 'change', '[type="checkbox"][data-frmprice],[type="radio"][data-frmprice],[type="hidden"][data-frmprice],select:has([data-frmprice])', calcProductsTotal );
2229 - jQuery( document ).on( 'keyup change', '[data-frmproduct],[type="text"][data-frmprice]', calcProductsTotal );
2230 - calcProductsTotal();
1362 + getFieldId: function( field, fullID ) {
1363 + return getFieldId( field, fullID );
2231 1364 },
2232 1365
2233 - getFieldId,
1366 + renderRecaptcha: function( captcha ) {
1367 + var formID, recaptchaID,
1368 + size = captcha.getAttribute( 'data-size' ),
1369 + rendered = captcha.getAttribute( 'data-rid' ) !== null,
1370 + params = {
1371 + 'sitekey': captcha.getAttribute( 'data-sitekey' ),
1372 + 'size': size,
1373 + 'theme': captcha.getAttribute( 'data-theme' )
1374 + };
2234 1375
2235 - /**
2236 - * Render a captcha field.
2237 - *
2238 - * @param {HTMLElement} captcha
2239 - * @param {string} captchaSelector
2240 - * @return {void}
2241 - */
2242 - renderCaptcha( captcha, captchaSelector ) {
2243 - const rendered = captcha.getAttribute( 'data-rid' ) !== null;
2244 1376 if ( rendered ) {
2245 1377 return;
2246 1378 }
2247 1379
2248 - const size = captcha.getAttribute( 'data-size' );
2249 - const params = {
2250 - sitekey: captcha.getAttribute( 'data-sitekey' ),
2251 - size,
2252 - theme: captcha.getAttribute( 'data-theme' )
2253 - };
2254 -
2255 1380 if ( size === 'invisible' ) {
2256 - const formID = captcha.closest( 'form' )?.querySelector( 'input[name="form_id"]' )?.value;
2257 -
2258 - const captchaLabel = captcha.closest( '.frm_form_field' )?.querySelector( '.frm_primary_label' );
2259 - if ( captchaLabel ) {
2260 - captchaLabel.style.display = 'none';
2261 - }
2262 -
1381 + formID = jQuery( captcha ).closest( 'form' ).find( 'input[name="form_id"]' ).val();
1382 + jQuery( captcha ).closest( '.frm_form_field .frm_primary_label' ).hide();
2263 1383 params.callback = function( token ) {
2264 1384 frmFrontForm.afterRecaptcha( token, formID );
2265 1385 };
2266 1386 }
2267 1387
2268 - const activeCaptcha = getSelectedCaptcha( captchaSelector );
2269 - const captchaContainer = typeof turnstile !== 'undefined' && turnstile === activeCaptcha ? `#${ captcha.id }` : captcha.id;
2270 - const captchaID = activeCaptcha.render( captchaContainer, params );
1388 + recaptchaID = grecaptcha.render( captcha.id, params );
2271 1389
2272 - captcha.setAttribute( 'data-rid', captchaID );
2273 -
2274 - maybeFixCaptchaLabel( captcha );
1390 + captcha.setAttribute( 'data-rid', recaptchaID );
2275 1391 },
2276 1392
2277 - afterSingleRecaptcha() {
2278 - const recaptcha = document.querySelector( '.frm-show-form .g-recaptcha' );
2279 - const object = recaptcha ? recaptcha.closest( 'form' ) : null;
1393 + afterSingleRecaptcha: function() {
1394 + var object = jQuery( '.frm-show-form .g-recaptcha' ).closest( 'form' )[0];
2280 1395 frmFrontForm.submitFormNow( object );
2281 1396 },
2282 1397
2283 - afterRecaptcha( _, formID ) {
2284 - const object = document.querySelector( `#frm_form_${ formID }_container form` );
1398 + afterRecaptcha: function( token, formID ) {
1399 + var object = jQuery( '#frm_form_' + formID + '_container form' )[0];
2285 1400 frmFrontForm.submitFormNow( object );
2286 1401 },
2287 1402
2288 - submitForm( e ) {
1403 + submitForm: function( e ) {
2289 1404 frmFrontForm.submitFormManual( e, this );
2290 1405 },
2291 1406
2292 - /**
2293 - * @param {Event} e
2294 - * @param {HTMLElement} object The form object that is being submitted.
2295 - * @return {void}
2296 - */
2297 - submitFormManual( e, object ) {
2298 - if ( document.body.classList.contains( 'wp-admin' ) && ! object.closest( '.frmapi-form' ) ) {
1407 + submitFormManual: function( e, object ) {
1408 + var isPro, errors,
1409 + invisibleRecaptcha = hasInvisibleRecaptcha( object ),
1410 + classList = object.className.trim().split( /\s+/gi );
1411 +
1412 + if ( classList && invisibleRecaptcha.length < 1 ) {
1413 + isPro = classList.indexOf( 'frm_pro_form' ) > -1;
1414 + if ( ! isPro ) {
1415 + return;
1416 + }
1417 + }
1418 +
1419 + if ( jQuery( 'body' ).hasClass( 'wp-admin' ) && jQuery( object ).closest( '.frmapi-form' ).length < 1 ) {
2299 1420 return;
2300 1421 }
2301 1422
2302 1423 e.preventDefault();
2303 1424
2304 - if ( typeof frmProForm !== 'undefined' && typeof frmProForm.submitAllowed === 'function' && ! frmProForm.submitAllowed( object ) ) {
2305 - return;
1425 + if ( typeof frmProForm !== 'undefined' && typeof frmProForm.submitAllowed === 'function' ) {
1426 + if ( ! frmProForm.submitAllowed( object ) ) {
1427 + return;
1428 + }
2306 1429 }
2307 1430
2308 - const errors = frmFrontForm.validateFormSubmit( object );
2309 - if ( Object.keys( errors ).length !== 0 ) {
2310 - return;
2311 - }
2312 -
2313 - const invisibleRecaptcha = hasInvisibleRecaptcha( object );
2314 -
2315 - if ( invisibleRecaptcha ) {
1431 + if ( invisibleRecaptcha.length ) {
2316 1432 showLoadingIndicator( jQuery( object ) );
2317 1433 executeInvisibleRecaptcha( invisibleRecaptcha );
2318 1434 } else {
2319 - showSubmitLoading( jQuery( object ) );
2320 1435
2321 - frmFrontForm.submitFormNow( object );
1436 + errors = frmFrontForm.validateFormSubmit( object );
1437 +
1438 + if ( Object.keys( errors ).length === 0 ) {
1439 + showSubmitLoading( jQuery( object ) );
1440 +
1441 + frmFrontForm.submitFormNow( object, classList );
1442 + }
2322 1443 }
2323 1444 },
2324 1445
2325 - submitFormNow( object ) {
2326 - let hasFileFields;
2327 - let antispamInput;
2328 - const classList = object.className.trim().split( /\s+/gi );
1446 + submitFormNow: function( object ) {
1447 + var hasFileFields, antispamInput,
1448 + classList = object.className.trim().split( /\s+/gi );
2329 1449
2330 1450 if ( object.hasAttribute( 'data-token' ) && null === object.querySelector( '[name="antispam_token"]' ) ) {
2331 1451 // include the antispam token on form submit.
2332 1452 antispamInput = document.createElement( 'input' );
@@ -2332,24 +1452,17 @@
2332 1452 antispamInput = document.createElement( 'input' );
2333 1453 antispamInput.type = 'hidden';
2334 1454 antispamInput.name = 'antispam_token';
2335 1455 antispamInput.value = object.getAttribute( 'data-token' );
2336 - object.append( antispamInput );
1456 + object.appendChild( antispamInput );
2337 1457 }
2338 1458
2339 - // Add a unique ID, used for duplicate checks.
2340 - const uniqueIDInput = document.createElement( 'input' );
2341 - uniqueIDInput.type = 'hidden';
2342 - uniqueIDInput.name = 'unique_id';
2343 - uniqueIDInput.value = getUniqueKey();
2344 - object.append( uniqueIDInput );
2345 -
2346 - if ( classList.includes( 'frm_ajax_submit' ) ) {
2347 - const fileInputs = object.querySelectorAll( 'input[type="file"]' );
2348 - hasFileFields = Array.from( fileInputs ).filter( input => !! input.value ).length;
1459 + if ( classList.indexOf( 'frm_ajax_submit' ) > -1 ) {
1460 + hasFileFields = jQuery( object ).find( 'input[type="file"]' ).filter( function() {
1461 + return !! this.value;
1462 + }).length;
2349 1463 if ( hasFileFields < 1 ) {
2350 - const actionInput = object.querySelector( 'input[name="frm_action"]' );
2351 - const action = actionInput ? actionInput.value : '';
1464 + action = jQuery( object ).find( 'input[name="frm_action"]' ).val();
2352 1465 frmFrontForm.checkFormErrors( object, action );
2353 1466 } else {
2354 1467 object.submit();
2355 1468 }
@@ -2357,16 +1470,10 @@
2357 1470 object.submit();
2358 1471 }
2359 1472 },
2360 1473
2361 - /**
2362 - * @param {HTMLElement|Object} object Form object. This might be a jQuery object.
2363 - *
2364 - * @return {Array} List of errors.
2365 - */
2366 - validateFormSubmit( object ) {
2367 - const form = object instanceof jQuery ? object.get( 0 ) : object;
2368 - if ( typeof tinyMCE !== 'undefined' && form?.querySelector( '.wp-editor-wrap' ) ) {
1474 + validateFormSubmit: function( object ) {
1475 + if ( typeof tinyMCE !== 'undefined' && jQuery( object ).find( '.wp-editor-wrap' ).length ) {
2369 1476 tinyMCE.triggerSave();
2370 1477 }
2371 1478
2372 1479 jsErrors = [];
@@ -2381,23 +1488,16 @@
2381 1488
2382 1489 return jsErrors;
2383 1490 },
2384 1491
2385 - /**
2386 - * @param {HTMLElement|Object} object Form object. This might be a jQuery object.
2387 - * @return {Array} List of errors.
2388 - */
2389 - getAjaxFormErrors( object ) {
2390 - let customErrors;
2391 - let key;
2392 - const form = object instanceof jQuery ? object.get( 0 ) : object;
1492 + getAjaxFormErrors: function( object ) {
1493 + var customErrors, key;
2393 1494
2394 1495 jsErrors = validateForm( object );
2395 1496 if ( typeof frmThemeOverride_jsErrors === 'function' ) { // eslint-disable-line camelcase
2396 - const actionInput = form ? form.querySelector( 'input[name="frm_action"]' ) : null;
2397 - const action = actionInput ? actionInput.value : '';
1497 + action = jQuery( object ).find( 'input[name="frm_action"]' ).val();
2398 1498 customErrors = frmThemeOverride_jsErrors( action, object );
2399 - if ( Object.keys( customErrors ).length ) {
1499 + if ( Object.keys( customErrors ).length ) {
2400 1500 for ( key in customErrors ) {
2401 1501 jsErrors[ key ] = customErrors[ key ];
2402 1502 }
2403 1503 }
@@ -2402,30 +1502,20 @@
2402 1502 }
2403 1503 }
2404 1504 }
2405 1505
2406 - triggerCustomEvent( document, 'frm_get_ajax_form_errors', {
2407 - formEl: object,
2408 - errors: jsErrors
2409 - } );
2410 -
2411 1506 return jsErrors;
2412 1507 },
2413 1508
2414 - /**
2415 - * @param {HTMLElement|Object} object Form object. This might be a jQuery object.
2416 - * @return {void}
2417 - */
2418 - addAjaxFormErrors( object ) {
2419 - let key;
2420 - const form = object instanceof jQuery ? object.get( 0 ) : object;
1509 + addAjaxFormErrors: function( object ) {
1510 + var key, $fieldCont;
2421 1511 removeAllErrors();
2422 1512
2423 1513 for ( key in jsErrors ) {
2424 - const fieldCont = form ? form.querySelector( `#frm_field_${ key }_container` ) : null;
1514 + $fieldCont = jQuery( object ).find( '#frm_field_' + key + '_container' );
2425 1515
2426 - if ( fieldCont ) {
2427 - addFieldError( fieldCont, key, jsErrors );
1516 + if ( $fieldCont.length ) {
1517 + addFieldError( $fieldCont, key, jsErrors );
2428 1518 } else {
2429 1519 // we are unable to show the error, so remove it
2430 1520 delete jsErrors[ key ];
2431 1521 }
@@ -2434,33 +1524,39 @@
2434 1524 scrollToFirstField( object );
2435 1525 checkForErrorsAndMaybeSetFocus();
2436 1526 },
2437 1527
2438 - checkFormErrors: getFormErrors,
2439 - checkRequiredField,
2440 - showSubmitLoading,
2441 - removeSubmitLoading,
1528 + checkFormErrors: function( object, action ) {
1529 + getFormErrors( object, action );
1530 + },
2442 1531
2443 - scrollToID( id ) {
2444 - const object = jQuery( document.getElementById( id ) );
2445 - frmFrontForm.scrollMsg( object, false );
1532 + checkRequiredField: function( field, errors ) {
1533 + return checkRequiredField( field, errors );
2446 1534 },
2447 1535
2448 - scrollMsg( id, object, animate ) {
2449 - let newPos;
2450 - let screenTop;
2451 - let screenBottom;
2452 - let scrollObj = '';
1536 + showSubmitLoading: function( $object ) {
1537 + showSubmitLoading( $object );
1538 + },
2453 1539
2454 - if ( object === undefined ) {
2455 - scrollObj = jQuery( document.getElementById( `frm_form_${ id }_container` ) );
1540 + removeSubmitLoading: function( $object, enable, processesRunning ) {
1541 + removeSubmitLoading( $object, enable, processesRunning );
1542 + },
1543 +
1544 + scrollToID: function( id ) {
1545 + var object = jQuery( document.getElementById( id ) );
1546 + frmFrontForm.scrollMsg( object, false );
1547 + },
1548 +
1549 + scrollMsg: function( id, object, animate ) {
1550 + var newPos, m, b, screenTop, screenBottom,
1551 + scrollObj = '';
1552 + if ( typeof object === 'undefined' ) {
1553 + scrollObj = jQuery( document.getElementById( 'frm_form_' + id + '_container' ) );
2456 1554 if ( scrollObj.length < 1 ) {
2457 1555 return;
2458 1556 }
2459 1557 } else if ( typeof id === 'string' ) {
2460 - const formEl = object instanceof jQuery ? object.get( 0 ) : object;
2461 - const fieldEl = formEl ? formEl.querySelector( `#frm_field_${ id }_container` ) : null;
2462 - scrollObj = fieldEl ? jQuery( fieldEl ) : jQuery();
1558 + scrollObj = jQuery( object ).find( '#frm_field_' + id + '_container' );
2463 1559 } else {
2464 1560 scrollObj = id;
2465 1561 }
2466 1562
@@ -2470,12 +1566,12 @@
2470 1566 return;
2471 1567 }
2472 1568 newPos = newPos - frm_js.offset;
2473 1569
2474 - const docMarginTop = getComputedStyle( document.documentElement ).marginTop;
2475 - const bodyMarginTop = getComputedStyle( document.body ).marginTop;
2476 - if ( docMarginTop || bodyMarginTop ) {
2477 - newPos = newPos - parseInt( docMarginTop ) - parseInt( bodyMarginTop );
1570 + m = jQuery( 'html' ).css( 'margin-top' );
1571 + b = jQuery( 'body' ).css( 'margin-top' );
1572 + if ( m || b ) {
1573 + newPos = newPos - parseInt( m ) - parseInt( b );
2478 1574 }
2479 1575
2480 1576 if ( newPos && window.innerHeight ) {
2481 1577 screenTop = document.documentElement.scrollTop || document.body.scrollTop;
@@ -2482,12 +1578,12 @@
2482 1578 screenBottom = screenTop + window.innerHeight;
2483 1579
2484 1580 if ( newPos > screenBottom || newPos < screenTop ) {
2485 1581 // Not in view
2486 - if ( animate === undefined ) {
2487 - document.documentElement.scrollTop = newPos;
1582 + if ( typeof animate === 'undefined' ) {
1583 + jQuery( window ).scrollTop( newPos );
2488 1584 } else {
2489 - animateScroll( screenTop, newPos, 500 );
1585 + jQuery( 'html,body' ).animate({ scrollTop: newPos }, 500 );
2490 1586 }
2491 1587 return false;
2492 1588 }
2493 1589 }
@@ -2492,13 +1588,13 @@
2492 1588 }
2493 1589 }
2494 1590 },
2495 1591
2496 - fieldValueChanged( e ) {
1592 + fieldValueChanged: function( e ) {
2497 1593 /*jshint validthis:true */
2498 1594
2499 - const fieldId = frmFrontForm.getFieldId( this, false );
2500 - if ( ! fieldId ) {
1595 + var fieldId = frmFrontForm.getFieldId( this, false );
1596 + if ( ! fieldId || typeof fieldId === 'undefined' ) {
2501 1597 return;
2502 1598 }
2503 1599
2504 1600 if ( e.frmTriggered && e.frmTriggered == fieldId ) {
@@ -2504,9 +1600,9 @@
2504 1600 if ( e.frmTriggered && e.frmTriggered == fieldId ) {
2505 1601 return;
2506 1602 }
2507 1603
2508 - jQuery( document ).trigger( 'frmFieldChanged', [ this, fieldId, e ] );
1604 + jQuery( document ).trigger( 'frmFieldChanged', [ this, fieldId, e ]);
2509 1605
2510 1606 if ( e.selfTriggered !== true ) {
2511 1607 maybeValidateChange( this );
2512 1608 }
@@ -2511,10 +1607,56 @@
2511 1607 maybeValidateChange( this );
2512 1608 }
2513 1609 },
2514 1610
2515 - escapeHtml( text ) {
2516 - console.warn( 'DEPRECATED: function frmFrontForm.escapeHtml in v6.17' );
1611 + savingDraft: function( object ) {
1612 + console.warn( 'DEPRECATED: function frmFrontForm.savingDraft in v3.0 use frmProForm.savingDraft' );
1613 + if ( typeof frmProForm !== 'undefined' ) {
1614 + return frmProForm.savingDraft( object );
1615 + }
1616 + },
1617 +
1618 + goingToPreviousPage: function( object ) {
1619 + console.warn( 'DEPRECATED: function frmFrontForm.goingToPreviousPage in v3.0 use frmProForm.goingToPreviousPage' );
1620 + if ( typeof frmProForm !== 'undefined' ) {
1621 + return frmProForm.goingToPreviousPage( object );
1622 + }
1623 + },
1624 +
1625 + hideOrShowFields: function() {
1626 + console.warn( 'DEPRECATED: function frmFrontForm.hideOrShowFields in v3.0 use frmProForm.hideOrShowFields' );
1627 + if ( typeof frmProForm !== 'undefined' ) {
1628 + frmProForm.hideOrShowFields();
1629 + }
1630 + },
1631 +
1632 + hidePreviouslyHiddenFields: function() {
1633 + console.warn( 'DEPRECATED: function frmFrontForm.hidePreviouslyHiddenFields in v3.0 use frmProForm.hidePreviouslyHiddenFields' );
1634 + if ( typeof frmProForm !== 'undefined' ) {
1635 + frmProForm.hidePreviouslyHiddenFields();
1636 + }
1637 + },
1638 +
1639 + checkDependentDynamicFields: function( ids ) {
1640 + console.warn( 'DEPRECATED: function frmFrontForm.checkDependentDynamicFields in v3.0 use frmProForm.checkDependentDynamicFields' );
1641 + if ( typeof frmProForm !== 'undefined' ) {
1642 + frmProForm.checkDependentDynamicFields( ids );
1643 + }
1644 + },
1645 +
1646 + checkDependentLookupFields: function( ids ) {
1647 + console.warn( 'DEPRECATED: function frmFrontForm.checkDependentLookupFields in v3.0 use frmProForm.checkDependentLookupFields' );
1648 + if ( typeof frmProForm !== 'undefined' ) {
1649 + frmProForm.checkDependentLookupFields( ids );
1650 + }
1651 + },
1652 +
1653 + loadGoogle: function() {
1654 + console.warn( 'DEPRECATED: function frmFrontForm.loadGoogle in v3.0 use frmProForm.loadGoogle' );
1655 + frmProForm.loadGoogle();
1656 + },
1657 +
1658 + escapeHtml: function( text ) {
2517 1659 return text
2518 1660 .replace( /&/g, '&amp;' )
2519 1661 .replace( /</g, '&lt;' )
2520 1662 .replace( />/g, '&gt;' )
@@ -2521,82 +1663,97 @@
2521 1663 .replace( /"/g, '&quot;' )
2522 1664 .replace( /'/g, '&#039;' );
2523 1665 },
2524 1666
2525 - triggerCustomEvent,
2526 - documentOn
1667 + invisible: function( classes ) {
1668 + jQuery( classes ).css( 'visibility', 'hidden' );
1669 + },
1670 +
1671 + visible: function( classes ) {
1672 + jQuery( classes ).css( 'visibility', 'visible' );
1673 + }
2527 1674 };
2528 1675 }
1676 +frmFrontForm = frmFrontFormJS();
2529 1677
2530 -window.frmFrontForm = frmFrontFormJS();
2531 -
2532 1678 jQuery( document ).ready( function() {
2533 1679 frmFrontForm.init();
2534 -} );
1680 +});
2535 1681
2536 1682 function frmRecaptcha() {
2537 - frmCaptcha( '.frm-g-recaptcha' );
1683 + var c, cl,
1684 + captchas = jQuery( '.frm-g-recaptcha' );
1685 + for ( c = 0, cl = captchas.length; c < cl; c++ ) {
1686 + frmFrontForm.renderRecaptcha( captchas[c]);
1687 + }
2538 1688 }
2539 1689
2540 -function frmHcaptcha() {
2541 - frmCaptcha( '.h-captcha' );
1690 +function frmAfterRecaptcha( token ) {
1691 + frmFrontForm.afterSingleRecaptcha( token );
2542 1692 }
2543 1693
2544 -function frmTurnstile() {
2545 - frmCaptcha( '.frm-cf-turnstile' );
1694 +function frmUpdateField( entryId, fieldId, value, message, num ) {
1695 + jQuery( document.getElementById( 'frm_update_field_' + entryId + '_' + fieldId + '_' + num ) ).html( '<span class="frm-loading-img"></span>' );
1696 + jQuery.ajax({
1697 + type: 'POST',
1698 + url: frm_js.ajax_url,
1699 + data: {
1700 + action: 'frm_entries_update_field_ajax',
1701 + entry_id: entryId,
1702 + field_id: fieldId,
1703 + value: value,
1704 + nonce: frm_js.nonce
1705 + },
1706 + success: function() {
1707 + if ( message.replace( /^\s+|\s+$/g, '' ) === '' ) {
1708 + jQuery( document.getElementById( 'frm_update_field_' + entryId + '_' + fieldId + '_' + num ) ).fadeOut( 'slow' );
1709 + } else {
1710 + jQuery( document.getElementById( 'frm_update_field_' + entryId + '_' + fieldId + '_' + num ) ).replaceWith( message );
1711 + }
1712 + }
1713 + });
2546 1714 }
2547 1715
2548 -function frmCaptcha( captchaSelector ) {
2549 - if ( '.h-captcha' === captchaSelector ) {
2550 - // hCaptcha is still rendered implicitly, so we only want to handle the label and exit early.
2551 - // Match the hcaptcha labels to the hcaptcha response fields.
2552 - const captchaLabels = document.querySelectorAll( 'label[for="h-captcha-response"]' );
2553 - if ( captchaLabels.length ) {
2554 - captchaLabels.forEach( label => {
2555 - const captchaResponse = label.closest( 'form' )?.querySelector( '[name="h-captcha-response"]' );
2556 - if ( captchaResponse ) {
2557 - label.htmlFor = captchaResponse.id;
2558 - }
2559 - } );
1716 +function frmDeleteEntry( entryId, prefix ) {
1717 + console.warn( 'DEPRECATED: function frmDeleteEntry in v2.0.13 use frmFrontForm.deleteEntry' );
1718 + jQuery( document.getElementById( 'frm_delete_' + entryId ) ).replaceWith( '<span class="frm-loading-img" id="frm_delete_' + entryId + '"></span>' );
1719 + jQuery.ajax({
1720 + type: 'POST',
1721 + url: frm_js.ajax_url,
1722 + data: {
1723 + action: 'frm_entries_destroy',
1724 + entry: entryId,
1725 + nonce: frm_js.nonce
1726 + },
1727 + success: function( html ) {
1728 + if ( html.replace( /^\s+|\s+$/g, '' ) === 'success' ) {
1729 + jQuery( document.getElementById( prefix + entryId ) ).fadeOut( 'slow' );
1730 + } else {
1731 + jQuery( document.getElementById( 'frm_delete_' + entryId ) ).replaceWith( html );
1732 + }
2560 1733 }
2561 - return;
2562 - }
2563 -
2564 - let c;
2565 - const captchas = document.querySelectorAll( captchaSelector );
2566 - const cl = captchas.length;
2567 - for ( c = 0; c < cl; c++ ) {
2568 - const closestForm = captchas[ c ].closest( 'form' );
2569 - const formIsVisible = closestForm && closestForm.offsetParent !== null;
2570 - const captcha = captchas[ c ];
2571 - if ( ! formIsVisible ) {
2572 - // If the form is not visible, try again later in 400ms.
2573 - // This fixes issues where the form fades visible on page load.
2574 - // Or when the form is inside of a modal.
2575 - const interval = setInterval(
2576 - function() {
2577 - if ( closestForm && closestForm.offsetParent !== null ) {
2578 - frmFrontForm.renderCaptcha( captcha, captchaSelector );
2579 - clearInterval( interval );
2580 - }
2581 - },
2582 - 400
2583 - );
2584 - continue;
2585 - }
2586 - frmFrontForm.renderCaptcha( captcha, captchaSelector );
2587 - }
1734 + });
2588 1735 }
2589 1736
2590 -function getSelectedCaptcha( captchaSelector ) {
2591 - if ( captchaSelector === '.frm-g-recaptcha' ) {
2592 - return grecaptcha;
2593 - }
2594 - if ( document.querySelector( '.frm-cf-turnstile' ) ) {
2595 - return turnstile;
2596 - }
2597 - return hcaptcha;
1737 +function frmOnSubmit( e ) {
1738 + console.warn( 'DEPRECATED: function frmOnSubmit in v2.0 use frmFrontForm.submitForm' );
1739 + frmFrontForm.submitForm( e, this );
2598 1740 }
2599 1741
2600 -function frmAfterRecaptcha( token ) {
2601 - frmFrontForm.afterSingleRecaptcha( token );
1742 +function frm_resend_email( entryId, formId ) { // eslint-disable-line camelcase
1743 + var $link = jQuery( document.getElementById( 'frm_resend_email' ) );
1744 + console.warn( 'DEPRECATED: function frm_resend_email in v2.0' );
1745 + $link.append( '<span class="spinner" style="display:inline"></span>' );
1746 + jQuery.ajax({
1747 + type: 'POST',
1748 + url: frm_js.ajax_url,
1749 + data: {
1750 + action: 'frm_entries_send_email',
1751 + entry_id: entryId,
1752 + form_id: formId,
1753 + nonce: frm_js.nonce
1754 + },
1755 + success: function( msg ) {
1756 + $link.replaceWith( msg );
1757 + }
1758 + });
2602 1759 }