From c156eef1f4a412f46eda40d16fdecfc7b721b956 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Tue, 8 Oct 2024 18:09:36 +0300 Subject: [PATCH 01/24] Set aria-invalid to true only on name part input with error --- classes/controllers/FrmFieldsController.php | 9 +++++++++ classes/models/FrmFieldFormHtml.php | 11 ++++++++++- classes/models/fields/FrmFieldCombo.php | 3 +++ js/formidable.js | 16 ++++++++++++++++ 4 files changed, 38 insertions(+), 1 deletion(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index c9d7edd467..ed097a4ef1 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -915,6 +915,15 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { } foreach ( $field['shortcodes'] as $k => $v ) { + if ( $field['type'] === 'name' ) { + if ( false !== strpos( $k, 'aria-invalid' ) && ! empty( $field['subfield_name'] ) && $field['shortcodes'][ 'aria-invalid-' . $field['subfield_name'] ]) { + $k = 'aria-invalid'; + $v = $field['shortcodes'][ 'aria-invalid-' . $field['subfield_name'] ]; + unset( $field['shortcodes'][ 'aria-invalid-' . $field['subfield_name'] ] ); + } else { + continue; + } + } if ( 'opt' === $k || ! self::should_allow_input_attribute( $k ) ) { continue; } diff --git a/classes/models/FrmFieldFormHtml.php b/classes/models/FrmFieldFormHtml.php index 22266f1c83..defb825767 100644 --- a/classes/models/FrmFieldFormHtml.php +++ b/classes/models/FrmFieldFormHtml.php @@ -394,7 +394,16 @@ private function prepare_input_shortcode_atts( $shortcode_atts ) { unset( $shortcode_atts['class'] ); } - $shortcode_atts['aria-invalid'] = isset( $this->pass_args['errors'][ 'field' . $this->field_id ] ) ? 'true' : 'false'; + if ( $this->field_obj->get_field_column( 'type' ) === 'name' ) { + if ( isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-first' ] ) ) { + $shortcode_atts['aria-invalid-first'] = 'true'; + } + if ( isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-last' ] ) ) { + $shortcode_atts['aria-invalid-last'] = 'true'; + } + } else { + $shortcode_atts['aria-invalid'] = isset( $this->pass_args['errors'][ 'field' . $this->field_id ] ) ? 'true' : 'false'; + } $this->field_obj->set_field_column( 'shortcodes', $shortcode_atts ); diff --git a/classes/models/fields/FrmFieldCombo.php b/classes/models/fields/FrmFieldCombo.php index 966d994f80..17c21b290b 100644 --- a/classes/models/fields/FrmFieldCombo.php +++ b/classes/models/fields/FrmFieldCombo.php @@ -381,6 +381,9 @@ protected function print_input_atts( $args ) { // Fake it to avoid printing frm-val attribute. $field['default_value'] = ''; + if ( ! empty( $sub_field['name'] ) ) { + $field['subfield_name'] = $sub_field['name']; + } do_action( 'frm_field_input_html', $field ); // Print custom attributes. diff --git a/js/formidable.js b/js/formidable.js index 516f42eacb..67f9ed0f90 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1232,6 +1232,17 @@ function frmFrontFormJS() { }); } + function maybeSetFocusOnNameFieldElement( element ) { + if ( ! element.querySelector( '.frm_combo_inputs_container[data-name-layout]' ) ) { + return; + } + const nameField = element.querySelector( '[aria-invalid="true"]' ); + if ( ! nameField ) { + return; + } + nameField.focus(); + } + function checkForErrorsAndMaybeSetFocus() { let errors, element, timeoutCallback; @@ -1247,11 +1258,16 @@ function frmFrontFormJS() { element = errors[0]; do { element = element.previousSibling; + if ( -1 !== [ 'input', 'select', 'textarea' ].indexOf( element.nodeName.toLowerCase() ) ) { element.focus(); break; } + if ( 'FIELDSET' === element.nodeName ) { + maybeSetFocusOnNameFieldElement( element ); + } + if ( 'undefined' !== typeof element.classList ) { if ( element.classList.contains( 'html-active' ) ) { timeoutCallback = function() { From dbdc6b1470c7dbcdb95be6658eee5d52981ebe51 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 14:15:40 +0300 Subject: [PATCH 02/24] Move check into a separate function --- js/formidable.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/js/formidable.js b/js/formidable.js index 67f9ed0f90..8440ff8441 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1233,6 +1233,9 @@ function frmFrontFormJS() { } function maybeSetFocusOnNameFieldElement( element ) { + if ( 'FIELDSET' !== element.nodeName ) { + return; + } if ( ! element.querySelector( '.frm_combo_inputs_container[data-name-layout]' ) ) { return; } @@ -1264,9 +1267,7 @@ function frmFrontFormJS() { break; } - if ( 'FIELDSET' === element.nodeName ) { - maybeSetFocusOnNameFieldElement( element ); - } + maybeSetFocusOnNameFieldElement( element ); if ( 'undefined' !== typeof element.classList ) { if ( element.classList.contains( 'html-active' ) ) { From 601a31c122d0dd118cc17a84f6360d3940cd5641 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 14:27:05 +0300 Subject: [PATCH 03/24] Avoid potential bug --- classes/controllers/FrmFieldsController.php | 9 +++++---- classes/models/FrmFieldFormHtml.php | 4 ++++ 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index ed097a4ef1..6ec6182d5a 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -915,11 +915,12 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { } foreach ( $field['shortcodes'] as $k => $v ) { - if ( $field['type'] === 'name' ) { - if ( false !== strpos( $k, 'aria-invalid' ) && ! empty( $field['subfield_name'] ) && $field['shortcodes'][ 'aria-invalid-' . $field['subfield_name'] ]) { + if ( $field['type'] === 'name' && false !== strpos( $k, 'aria-invalid' ) && isset( $field['subfield_name'] ) ) { + $subfield_name = $field['subfield_name']; // first or last. + if ( isset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ) ) { $k = 'aria-invalid'; - $v = $field['shortcodes'][ 'aria-invalid-' . $field['subfield_name'] ]; - unset( $field['shortcodes'][ 'aria-invalid-' . $field['subfield_name'] ] ); + $v = $field['shortcodes'][ 'aria-invalid-' . $subfield_name ]; + unset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ); } else { continue; } diff --git a/classes/models/FrmFieldFormHtml.php b/classes/models/FrmFieldFormHtml.php index defb825767..f74854ca1b 100644 --- a/classes/models/FrmFieldFormHtml.php +++ b/classes/models/FrmFieldFormHtml.php @@ -397,9 +397,13 @@ private function prepare_input_shortcode_atts( $shortcode_atts ) { if ( $this->field_obj->get_field_column( 'type' ) === 'name' ) { if ( isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-first' ] ) ) { $shortcode_atts['aria-invalid-first'] = 'true'; + } else { + $shortcode_atts['aria-invalid-first'] = 'false'; } if ( isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-last' ] ) ) { $shortcode_atts['aria-invalid-last'] = 'true'; + } else { + $shortcode_atts['aria-invalid-last'] = 'false'; } } else { $shortcode_atts['aria-invalid'] = isset( $this->pass_args['errors'][ 'field' . $this->field_id ] ) ? 'true' : 'false'; From 9629b3c92dbc9354f5eb45b90d1c9580f49b71ec Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 15:30:00 +0300 Subject: [PATCH 04/24] Improve condition check --- classes/controllers/FrmFieldsController.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index 6ec6182d5a..905655db31 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -915,7 +915,7 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { } foreach ( $field['shortcodes'] as $k => $v ) { - if ( $field['type'] === 'name' && false !== strpos( $k, 'aria-invalid' ) && isset( $field['subfield_name'] ) ) { + if ( $field['type'] === 'name' && 0 === strpos( $k, 'aria-invalid' ) && isset( $field['subfield_name'] ) ) { $subfield_name = $field['subfield_name']; // first or last. if ( isset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ) ) { $k = 'aria-invalid'; From 466860aae4e7ac92623081a3fc45546817840b58 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 15:32:49 +0300 Subject: [PATCH 05/24] Add missing JSDoc --- js/formidable.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/js/formidable.js b/js/formidable.js index 8440ff8441..02726631dc 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1232,6 +1232,14 @@ function frmFrontFormJS() { }); } + /** + * Sets focus on a name field part (first or last name) if it has an error. + * + * @since x.x + * + * @param {HTMLElement} element + * @returns {Void} + */ function maybeSetFocusOnNameFieldElement( element ) { if ( 'FIELDSET' !== element.nodeName ) { return; @@ -1261,7 +1269,6 @@ function frmFrontFormJS() { element = errors[0]; do { element = element.previousSibling; - if ( -1 !== [ 'input', 'select', 'textarea' ].indexOf( element.nodeName.toLowerCase() ) ) { element.focus(); break; From d34a3ee25c87dbcacceb1c1fab6c93937b2fc91b Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 15:37:23 +0300 Subject: [PATCH 06/24] Cut down repeated code --- classes/models/FrmFieldFormHtml.php | 25 +++++++++++++++---------- 1 file changed, 15 insertions(+), 10 deletions(-) diff --git a/classes/models/FrmFieldFormHtml.php b/classes/models/FrmFieldFormHtml.php index f74854ca1b..7304c54c31 100644 --- a/classes/models/FrmFieldFormHtml.php +++ b/classes/models/FrmFieldFormHtml.php @@ -395,16 +395,7 @@ private function prepare_input_shortcode_atts( $shortcode_atts ) { } if ( $this->field_obj->get_field_column( 'type' ) === 'name' ) { - if ( isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-first' ] ) ) { - $shortcode_atts['aria-invalid-first'] = 'true'; - } else { - $shortcode_atts['aria-invalid-first'] = 'false'; - } - if ( isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-last' ] ) ) { - $shortcode_atts['aria-invalid-last'] = 'true'; - } else { - $shortcode_atts['aria-invalid-last'] = 'false'; - } + $this->set_aria_invalid_error_for_name_part( $shortcode_atts ); } else { $shortcode_atts['aria-invalid'] = isset( $this->pass_args['errors'][ 'field' . $this->field_id ] ) ? 'true' : 'false'; } @@ -414,6 +405,20 @@ private function prepare_input_shortcode_atts( $shortcode_atts ) { return $shortcode_atts; } + /** + * Set the aria-invalid attribute for the first and last name fields. + * + * @since x.x + * + * @param array $shortcode_atts + * @return void + */ + private function set_aria_invalid_error_for_name_part( &$shortcode_atts ) { + foreach ( array( 'first', 'last' ) as $name_part ) { + $shortcode_atts[ 'aria-invalid-' . $name_part ] = isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-' . $name_part ] ) ? 'true' : 'false'; + } + } + /** * Add the label position class into the HTML * If the label position is inside, add a class to show the label if the field has a value. From 62c9d5c058d253cdeca036af507871749150c9e0 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 15:42:56 +0300 Subject: [PATCH 07/24] Cover middle name with the fix too --- classes/controllers/FrmFieldsController.php | 2 +- classes/models/FrmFieldFormHtml.php | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index 905655db31..3ce61d9dc8 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -916,7 +916,7 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { foreach ( $field['shortcodes'] as $k => $v ) { if ( $field['type'] === 'name' && 0 === strpos( $k, 'aria-invalid' ) && isset( $field['subfield_name'] ) ) { - $subfield_name = $field['subfield_name']; // first or last. + $subfield_name = $field['subfield_name']; // first, middle or last. if ( isset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ) ) { $k = 'aria-invalid'; $v = $field['shortcodes'][ 'aria-invalid-' . $subfield_name ]; diff --git a/classes/models/FrmFieldFormHtml.php b/classes/models/FrmFieldFormHtml.php index 7304c54c31..82c69fc8ab 100644 --- a/classes/models/FrmFieldFormHtml.php +++ b/classes/models/FrmFieldFormHtml.php @@ -414,7 +414,7 @@ private function prepare_input_shortcode_atts( $shortcode_atts ) { * @return void */ private function set_aria_invalid_error_for_name_part( &$shortcode_atts ) { - foreach ( array( 'first', 'last' ) as $name_part ) { + foreach ( array( 'first', 'middle', 'last' ) as $name_part ) { $shortcode_atts[ 'aria-invalid-' . $name_part ] = isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-' . $name_part ] ) ? 'true' : 'false'; } } From 4496a705af0b41c882bf803d1391879602d04833 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 15:51:33 +0300 Subject: [PATCH 08/24] Fix workflow errors --- classes/controllers/FrmFieldsController.php | 2 +- js/formidable.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index 3ce61d9dc8..fe89faaff4 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -939,7 +939,7 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { unset( $k, $v ); } - } + } //end foreach /** * Disallow possibly unsafe attributees (that trigger JavaScript) when unasfe HTML is not allowed. diff --git a/js/formidable.js b/js/formidable.js index 02726631dc..a58512d42f 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1238,7 +1238,7 @@ function frmFrontFormJS() { * @since x.x * * @param {HTMLElement} element - * @returns {Void} + * @return {Void} */ function maybeSetFocusOnNameFieldElement( element ) { if ( 'FIELDSET' !== element.nodeName ) { From 1945a36cee91a55cd29219611441d1b6ffc9d847 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 15:55:18 +0300 Subject: [PATCH 09/24] Fix workflow errors --- classes/controllers/FrmFieldsController.php | 6 +++--- js/formidable.js | 1 - 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index fe89faaff4..8e339080e6 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -916,7 +916,7 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { foreach ( $field['shortcodes'] as $k => $v ) { if ( $field['type'] === 'name' && 0 === strpos( $k, 'aria-invalid' ) && isset( $field['subfield_name'] ) ) { - $subfield_name = $field['subfield_name']; // first, middle or last. + $subfield_name = $field['subfield_name']; if ( isset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ) ) { $k = 'aria-invalid'; $v = $field['shortcodes'][ 'aria-invalid-' . $subfield_name ]; @@ -938,8 +938,8 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { } unset( $k, $v ); - } - } //end foreach + } //end foreach + } /** * Disallow possibly unsafe attributees (that trigger JavaScript) when unasfe HTML is not allowed. diff --git a/js/formidable.js b/js/formidable.js index a58512d42f..7b61059909 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1238,7 +1238,6 @@ function frmFrontFormJS() { * @since x.x * * @param {HTMLElement} element - * @return {Void} */ function maybeSetFocusOnNameFieldElement( element ) { if ( 'FIELDSET' !== element.nodeName ) { From eb3aad56aecb36810549f6ccffce9b64c809010e Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 9 Oct 2024 15:57:03 +0300 Subject: [PATCH 10/24] Fix workflow errors --- classes/controllers/FrmFieldsController.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index 8e339080e6..93eccacb1e 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -938,7 +938,7 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { } unset( $k, $v ); - } //end foreach + }//end foreach } /** From 1c461e2e522ac6ffd7a34f1d119441ec9c35a96f Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Tue, 22 Oct 2024 14:56:24 +0300 Subject: [PATCH 11/24] Avoid red border on textarea:focus --- css/_single_theme.css.php | 1 + 1 file changed, 1 insertion(+) diff --git a/css/_single_theme.css.php b/css/_single_theme.css.php index bd508c8eef..5983e1a8de 100644 --- a/css/_single_theme.css.php +++ b/css/_single_theme.css.php @@ -179,6 +179,7 @@ } . .form-field input:not([type=file]):not([type=range]):not([readonly]):focus, +. .form-field textarea:focus, . select:focus, . textarea:focus, . .frm_focus_field input[type=text], From 432494cf71d43fc4ea2d8aa15f0d1e66e78316bf Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 23 Oct 2024 20:16:54 +0300 Subject: [PATCH 12/24] Improve code readability a bit --- classes/controllers/FrmFieldsController.php | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index 93eccacb1e..4e080dae75 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -915,15 +915,14 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { } foreach ( $field['shortcodes'] as $k => $v ) { - if ( $field['type'] === 'name' && 0 === strpos( $k, 'aria-invalid' ) && isset( $field['subfield_name'] ) ) { + if ( isset( $field['subfield_name'] ) && 'name' === $field['type'] && 0 === strpos( $k, 'aria-invalid' ) ) { $subfield_name = $field['subfield_name']; - if ( isset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ) ) { - $k = 'aria-invalid'; - $v = $field['shortcodes'][ 'aria-invalid-' . $subfield_name ]; - unset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ); - } else { + if ( ! isset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ) ) { continue; } + $k = 'aria-invalid'; + $v = $field['shortcodes'][ 'aria-invalid-' . $subfield_name ]; + unset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ); } if ( 'opt' === $k || ! self::should_allow_input_attribute( $k ) ) { continue; From 07bbf5e6a04a8f486ac0f382f18a3a5148a4ac32 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 6 Nov 2024 11:53:05 +0300 Subject: [PATCH 13/24] Remove check for field type --- classes/controllers/FrmFieldsController.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index 4e080dae75..204d168b82 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -915,7 +915,7 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { } foreach ( $field['shortcodes'] as $k => $v ) { - if ( isset( $field['subfield_name'] ) && 'name' === $field['type'] && 0 === strpos( $k, 'aria-invalid' ) ) { + if ( isset( $field['subfield_name'] ) && 0 === strpos( $k, 'aria-invalid' ) ) { $subfield_name = $field['subfield_name']; if ( ! isset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ) ) { continue; From 63a35b78e0791e899d1ce23e43d4da2fa596199a Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 6 Nov 2024 11:55:51 +0300 Subject: [PATCH 14/24] Add inline comment to explain update --- classes/controllers/FrmFieldsController.php | 1 + 1 file changed, 1 insertion(+) diff --git a/classes/controllers/FrmFieldsController.php b/classes/controllers/FrmFieldsController.php index 204d168b82..f1df1ba9fa 100644 --- a/classes/controllers/FrmFieldsController.php +++ b/classes/controllers/FrmFieldsController.php @@ -920,6 +920,7 @@ private static function add_shortcodes_to_html( $field, array &$add_html ) { if ( ! isset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ) ) { continue; } + // Change the key to the correct aria-invalid value so that $add_html is set correctly for the current subfield of a combo field. $k = 'aria-invalid'; $v = $field['shortcodes'][ 'aria-invalid-' . $subfield_name ]; unset( $field['shortcodes'][ 'aria-invalid-' . $subfield_name ] ); From 38756ec0d2789ad9545b31bf57d78ba69f8429b9 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 6 Nov 2024 12:32:45 +0300 Subject: [PATCH 15/24] Refactor solution to follow an object oriented approach --- classes/models/FrmFieldFormHtml.php | 20 +------------------- classes/models/fields/FrmFieldName.php | 16 ++++++++++++++++ classes/models/fields/FrmFieldType.php | 14 ++++++++++++++ 3 files changed, 31 insertions(+), 19 deletions(-) diff --git a/classes/models/FrmFieldFormHtml.php b/classes/models/FrmFieldFormHtml.php index 82c69fc8ab..413eec2246 100644 --- a/classes/models/FrmFieldFormHtml.php +++ b/classes/models/FrmFieldFormHtml.php @@ -394,31 +394,13 @@ private function prepare_input_shortcode_atts( $shortcode_atts ) { unset( $shortcode_atts['class'] ); } - if ( $this->field_obj->get_field_column( 'type' ) === 'name' ) { - $this->set_aria_invalid_error_for_name_part( $shortcode_atts ); - } else { - $shortcode_atts['aria-invalid'] = isset( $this->pass_args['errors'][ 'field' . $this->field_id ] ) ? 'true' : 'false'; - } + $this->field_obj->set_aria_invalid_error( $shortcode_atts, $this->pass_args ); $this->field_obj->set_field_column( 'shortcodes', $shortcode_atts ); return $shortcode_atts; } - /** - * Set the aria-invalid attribute for the first and last name fields. - * - * @since x.x - * - * @param array $shortcode_atts - * @return void - */ - private function set_aria_invalid_error_for_name_part( &$shortcode_atts ) { - foreach ( array( 'first', 'middle', 'last' ) as $name_part ) { - $shortcode_atts[ 'aria-invalid-' . $name_part ] = isset( $this->pass_args['errors'][ 'field' . $this->field_id . '-' . $name_part ] ) ? 'true' : 'false'; - } - } - /** * Add the label position class into the HTML * If the label position is inside, add a class to show the label if the field has a value. diff --git a/classes/models/fields/FrmFieldName.php b/classes/models/fields/FrmFieldName.php index ee480d282f..a387c1b60b 100644 --- a/classes/models/fields/FrmFieldName.php +++ b/classes/models/fields/FrmFieldName.php @@ -172,6 +172,22 @@ public function sanitize_value( &$value ) { FrmAppHelper::sanitize_value( 'sanitize_text_field', $value ); } + /** + * Set the aria-invalid attribute for name subfields. + * + * @since x.x + * + * @param array $shortcode_atts + * @param array $args + * + * @return void + */ + public function set_aria_invalid_error( &$shortcode_atts, $args ) { + foreach ( array( 'first', 'middle', 'last' ) as $name_part ) { + $shortcode_atts[ 'aria-invalid-' . $name_part ] = isset( $args['errors'][ 'field' . $this->field_id . '-' . $name_part ] ) ? 'true' : 'false'; + } + } + /** * Validate field. * diff --git a/classes/models/fields/FrmFieldType.php b/classes/models/fields/FrmFieldType.php index 5648a79739..8aca1a2982 100644 --- a/classes/models/fields/FrmFieldType.php +++ b/classes/models/fields/FrmFieldType.php @@ -995,6 +995,20 @@ protected function get_input_class() { return ''; } + /** + * Set the aria-invalid attribute for field. + * + * @since x.x + * + * @param array $shortcode_atts + * @param array $args + * + * @return void + */ + public function set_aria_invalid_error( &$shortcode_atts, $args ) { + $shortcode_atts['aria-invalid'] = isset( $args['errors'][ 'field' . $this->field_id ] ) ? 'true' : 'false'; + } + /** * @param array $args * @param array $shortcode_atts From ff2ecd25bc1845e6d1ff379f060ae151e21c35f1 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Mon, 11 Nov 2024 14:25:05 +0300 Subject: [PATCH 16/24] Remove new css selector and update existing one intended for the same purpose --- css/_single_theme.css.php | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/css/_single_theme.css.php b/css/_single_theme.css.php index 5983e1a8de..acabda1248 100644 --- a/css/_single_theme.css.php +++ b/css/_single_theme.css.php @@ -179,9 +179,8 @@ } . .form-field input:not([type=file]):not([type=range]):not([readonly]):focus, -. .form-field textarea:focus, . select:focus, -. textarea:focus, +. .form-field textarea:focus, . .frm_focus_field input[type=text], . .frm_focus_field input[type=password], . .frm_focus_field input[type=email], From 59723822d6c9beb84302307444750319410a6d66 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Tue, 19 Nov 2024 12:32:58 +0300 Subject: [PATCH 17/24] Move function to parent class --- classes/models/fields/FrmFieldCombo.php | 16 ++++++++++++++++ classes/models/fields/FrmFieldName.php | 16 ---------------- 2 files changed, 16 insertions(+), 16 deletions(-) diff --git a/classes/models/fields/FrmFieldCombo.php b/classes/models/fields/FrmFieldCombo.php index 17c21b290b..134fcd1125 100644 --- a/classes/models/fields/FrmFieldCombo.php +++ b/classes/models/fields/FrmFieldCombo.php @@ -77,6 +77,22 @@ protected function register_sub_fields( array $sub_fields ) { }//end foreach } + /** + * Set the aria-invalid attribute for subfields. + * + * @since x.x + * + * @param array $shortcode_atts + * @param array $args + * + * @return void + */ + public function set_aria_invalid_error( &$shortcode_atts, $args ) { + foreach ( $this->sub_fields as $sub_field ) { + $shortcode_atts[ 'aria-invalid-' . $sub_field['name'] ] = isset( $args['errors'][ 'field' . $this->field_id . '-' . $sub_field['name'] ] ) ? 'true' : 'false'; + } + } + /** * Gets default sub field. * diff --git a/classes/models/fields/FrmFieldName.php b/classes/models/fields/FrmFieldName.php index a387c1b60b..ee480d282f 100644 --- a/classes/models/fields/FrmFieldName.php +++ b/classes/models/fields/FrmFieldName.php @@ -172,22 +172,6 @@ public function sanitize_value( &$value ) { FrmAppHelper::sanitize_value( 'sanitize_text_field', $value ); } - /** - * Set the aria-invalid attribute for name subfields. - * - * @since x.x - * - * @param array $shortcode_atts - * @param array $args - * - * @return void - */ - public function set_aria_invalid_error( &$shortcode_atts, $args ) { - foreach ( array( 'first', 'middle', 'last' ) as $name_part ) { - $shortcode_atts[ 'aria-invalid-' . $name_part ] = isset( $args['errors'][ 'field' . $this->field_id . '-' . $name_part ] ) ? 'true' : 'false'; - } - } - /** * Validate field. * From aa29c1c870edacc05a5e61b7294f0e7239bd712a Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Tue, 19 Nov 2024 12:34:29 +0300 Subject: [PATCH 18/24] Call getter function to get subfields for the current combo field --- classes/models/fields/FrmFieldCombo.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/classes/models/fields/FrmFieldCombo.php b/classes/models/fields/FrmFieldCombo.php index 134fcd1125..a68c720c62 100644 --- a/classes/models/fields/FrmFieldCombo.php +++ b/classes/models/fields/FrmFieldCombo.php @@ -88,7 +88,7 @@ protected function register_sub_fields( array $sub_fields ) { * @return void */ public function set_aria_invalid_error( &$shortcode_atts, $args ) { - foreach ( $this->sub_fields as $sub_field ) { + foreach ( $this->get_sub_fields() as $sub_field ) { $shortcode_atts[ 'aria-invalid-' . $sub_field['name'] ] = isset( $args['errors'][ 'field' . $this->field_id . '-' . $sub_field['name'] ] ) ? 'true' : 'false'; } } From 16874eeda287f65a07d73b446af93ee9b07e3417 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 20 Nov 2024 11:43:44 +0300 Subject: [PATCH 19/24] Make fix more generic --- js/formidable.js | 14 +++++--------- 1 file changed, 5 insertions(+), 9 deletions(-) diff --git a/js/formidable.js b/js/formidable.js index 7b61059909..bd35c7f23b 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1233,24 +1233,20 @@ function frmFrontFormJS() { } /** - * Sets focus on a name field part (first or last name) if it has an error. + * Sets focus on a the first subfield of a combo field that has an error. * * @since x.x * * @param {HTMLElement} element */ - function maybeSetFocusOnNameFieldElement( element ) { + function maybeFocusOnComboSubField( element ) { if ( 'FIELDSET' !== element.nodeName ) { return; } - if ( ! element.querySelector( '.frm_combo_inputs_container[data-name-layout]' ) ) { + if ( ! element.querySelector( '.frm_combo_inputs_container' ) ) { return; } - const nameField = element.querySelector( '[aria-invalid="true"]' ); - if ( ! nameField ) { - return; - } - nameField.focus(); + element.querySelector( '[aria-invalid="true"]' )?.focus(); } function checkForErrorsAndMaybeSetFocus() { @@ -1273,7 +1269,7 @@ function frmFrontFormJS() { break; } - maybeSetFocusOnNameFieldElement( element ); + maybeFocusOnComboSubField( element ); if ( 'undefined' !== typeof element.classList ) { if ( element.classList.contains( 'html-active' ) ) { From 51da5b12e992140e1dfd13e76b87bb777e5d483e Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 21 Nov 2024 10:04:58 +0300 Subject: [PATCH 20/24] Exit look early if already set focus on a combo subfield --- js/formidable.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/js/formidable.js b/js/formidable.js index bd35c7f23b..605c4d1792 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1238,15 +1238,17 @@ function frmFrontFormJS() { * @since x.x * * @param {HTMLElement} element + * @returns {Boolean} */ function maybeFocusOnComboSubField( element ) { if ( 'FIELDSET' !== element.nodeName ) { - return; + return false; } if ( ! element.querySelector( '.frm_combo_inputs_container' ) ) { - return; + return false; } element.querySelector( '[aria-invalid="true"]' )?.focus(); + return true; } function checkForErrorsAndMaybeSetFocus() { @@ -1269,7 +1271,9 @@ function frmFrontFormJS() { break; } - maybeFocusOnComboSubField( element ); + if ( maybeFocusOnComboSubField( element ) ) { + break; + } if ( 'undefined' !== typeof element.classList ) { if ( element.classList.contains( 'html-active' ) ) { From ec33c734f8381f849d9e7f27afcb7e45db3dea70 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 21 Nov 2024 10:07:56 +0300 Subject: [PATCH 21/24] Fix JSDoc error --- js/formidable.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/formidable.js b/js/formidable.js index 0e6b6a368d..83e8f12c6c 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1325,7 +1325,7 @@ function frmFrontFormJS() { * @since x.x * * @param {HTMLElement} element - * @returns {Boolean} + * @return {boolean} */ function maybeFocusOnComboSubField( element ) { if ( 'FIELDSET' !== element.nodeName ) { From da9377d7ef59428a63cf9b9afa8f2fb20358e397 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 21 Nov 2024 10:09:28 +0300 Subject: [PATCH 22/24] Fix JSDoc error --- js/formidable.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/formidable.js b/js/formidable.js index 83e8f12c6c..e8629d0896 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1325,7 +1325,7 @@ function frmFrontFormJS() { * @since x.x * * @param {HTMLElement} element - * @return {boolean} + * @return {boolean} True if the focus was set on a combo field. */ function maybeFocusOnComboSubField( element ) { if ( 'FIELDSET' !== element.nodeName ) { From 585b8144e8a75cd759566cf3aef7daec41e45ceb Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Fri, 22 Nov 2024 11:05:06 +0300 Subject: [PATCH 23/24] Add missing condition check for target element's existence first --- js/formidable.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/js/formidable.js b/js/formidable.js index e8629d0896..447ff86d09 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1334,8 +1334,12 @@ function frmFrontFormJS() { if ( ! element.querySelector( '.frm_combo_inputs_container' ) ) { return false; } - element.querySelector( '[aria-invalid="true"]' )?.focus(); - return true; + const comboSubfield = element.querySelector( '[aria-invalid="true"]' ); + if ( comboSubfield ) { + comboSubfield.focus(); + return true; + } + return false; } function checkForErrorsAndMaybeSetFocus() { From ab8c5cb4580f8a39ad2ab7525575759b7178cfc8 Mon Sep 17 00:00:00 2001 From: Mike Letellier Date: Tue, 26 Nov 2024 16:22:10 -0400 Subject: [PATCH 24/24] Use focusInput to improve support with fade in with conditional logic setting --- js/formidable.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/formidable.js b/js/formidable.js index b9aec2d86a..45e408580d 100644 --- a/js/formidable.js +++ b/js/formidable.js @@ -1336,7 +1336,7 @@ function frmFrontFormJS() { } const comboSubfield = element.querySelector( '[aria-invalid="true"]' ); if ( comboSubfield ) { - comboSubfield.focus(); + focusInput( comboSubfield ); return true; } return false;