From cddce1858548fa5110015e5eb92b2d9018367dab Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Mon, 1 Apr 2024 15:08:30 +0300 Subject: [PATCH 01/24] Make conditional logic dropdown in sync with options --- js/formidable_admin.js | 43 ++++++++++++++++++++++++++++++++++++------ 1 file changed, 37 insertions(+), 6 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 1113b02f98..036d2742e4 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4865,10 +4865,27 @@ function frmAdminBuildJS() { } } + const getChoiceValueAndLabel = choiceElement => { + let value, label; + if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed + value = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' )?.value; + label = choiceElement.value; + if ( ! value ) { + value = label; + } + return { value, label }; + } + + label = choiceElement.closest( '.frm_single_option' ).querySelector( 'input[type="text"]' ).value; + value = choiceElement.value; + return { value, label }; + }; + function onOptionTextBlur() { var originalValue, oldValue = this.getAttribute( 'data-value-on-focus' ), - newValue = this.value, + newValue, + newValueLabel, fieldId, fieldIndex, logicId, @@ -4883,6 +4900,10 @@ function frmAdminBuildJS() { optionMatches, option; + const choiceComponents = getChoiceValueAndLabel( this ); + newValue = choiceComponents.value; + newValueLabel = choiceComponents.label; + if ( oldValue === newValue ) { return; } @@ -4941,7 +4962,7 @@ function frmAdminBuildJS() { } option.setAttribute( 'value', newValue ); - option.textContent = newValue; + option.textContent = newValueLabel; if ( fieldIds.indexOf( logicId ) === -1 ) { fieldIds.push( logicId ); @@ -5503,13 +5524,23 @@ function frmAdminBuildJS() { expectedOption = fieldOptions[ optionIndex ]; optionMatch = valueSelect.querySelector( 'option[value="' + expectedOption + '"]' ); - if ( optionMatch === null ) { + var optionsContainer = document.getElementById( 'frm_field_' + fieldId + '_opts' ) + + var expectedOptionContainer = optionsContainer.querySelector( 'input[value="' + expectedOption + '"]' ); + + const choiceComponents = getChoiceValueAndLabel( expectedOptionContainer ); + newValue = choiceComponents.value; + newValueLabel = choiceComponents.label; + + if ( optionMatch === null && ! valueSelect.querySelector( 'option[value="' + newValue + '"]' ) ) { optionMatch = document.createElement( 'option' ); - optionMatch.setAttribute( 'value', expectedOption ); - optionMatch.textContent = expectedOption; + optionMatch.setAttribute( 'value', newValue ); + optionMatch.textContent = newValueLabel; } - valueSelect.prepend( optionMatch ); + if ( optionMatch ) { + valueSelect.prepend( optionMatch ); + } } optionMatch = valueSelect.querySelector( 'option[value=""]' ); From ea6ace9c83fc19f84aa5d99d52eb73188cadf4ae Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Mon, 1 Apr 2024 16:26:23 +0300 Subject: [PATCH 02/24] Fix issue of creating double options in conditional logic dropdown --- js/formidable_admin.js | 31 +++++++++++++++++++++++-------- 1 file changed, 23 insertions(+), 8 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 036d2742e4..ef0854404d 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -5501,6 +5501,19 @@ function frmAdminBuildJS() { adjustConditionalLogicOptionOrders( fieldId ); } + const getNewConditionalLogicOption = ( fieldId, expectedOption ) => { + const optionsContainer = document.getElementById( 'frm_field_' + fieldId + '_opts' ); + + const expectedOptionContainer = optionsContainer.querySelector( 'input[value="' + expectedOption + '"]' ); + + if ( expectedOptionContainer ) { + const choiceComponents = getChoiceValueAndLabel( expectedOptionContainer ); + return { value: choiceComponents.value, label: choiceComponents.label }; + } + + return { value: expectedOption, label: expectedOption } + }; + function adjustConditionalLogicOptionOrders( fieldId, type ) { var row, opts, logicId, valueSelect, optionLength, optionIndex, expectedOption, optionMatch, fieldOptions, rows = builderPage.querySelectorAll( '.frm_logic_row' ), @@ -5522,20 +5535,21 @@ function frmAdminBuildJS() { for ( optionIndex = optionLength - 1; optionIndex >= 0; optionIndex-- ) { expectedOption = fieldOptions[ optionIndex ]; - optionMatch = valueSelect.querySelector( 'option[value="' + expectedOption + '"]' ); - - var optionsContainer = document.getElementById( 'frm_field_' + fieldId + '_opts' ) + let expectedOptionValue = document.getElementById( 'frm_field_' + fieldId + '_opts' ).querySelector( '.frm_option_key input[type="text"]' )?.value; + if ( ! expectedOptionValue ) { + expectedOptionValue = expectedOption; + } - var expectedOptionContainer = optionsContainer.querySelector( 'input[value="' + expectedOption + '"]' ); + optionMatch = valueSelect.querySelector( 'option[value="' + expectedOptionValue + '"]' ); - const choiceComponents = getChoiceValueAndLabel( expectedOptionContainer ); - newValue = choiceComponents.value; - newValueLabel = choiceComponents.label; + const newConditionalLogicOption = getNewConditionalLogicOption( fieldId, expectedOption ); + const newValue = newConditionalLogicOption.value; + const newLabel = newConditionalLogicOption.label; if ( optionMatch === null && ! valueSelect.querySelector( 'option[value="' + newValue + '"]' ) ) { optionMatch = document.createElement( 'option' ); optionMatch.setAttribute( 'value', newValue ); - optionMatch.textContent = newValueLabel; + optionMatch.textContent = newLabel; } if ( optionMatch ) { @@ -5544,6 +5558,7 @@ function frmAdminBuildJS() { } optionMatch = valueSelect.querySelector( 'option[value=""]' ); + console.log('Empty option', optionMatch); if ( optionMatch !== null ) { valueSelect.prepend( optionMatch ); } From f530062568d12cd7c05ea7f21fc01bb9cbd517e4 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Mon, 1 Apr 2024 16:41:10 +0300 Subject: [PATCH 03/24] Use const instead of var --- js/formidable_admin.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index ef0854404d..3f8d583e16 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4884,8 +4884,6 @@ function frmAdminBuildJS() { function onOptionTextBlur() { var originalValue, oldValue = this.getAttribute( 'data-value-on-focus' ), - newValue, - newValueLabel, fieldId, fieldIndex, logicId, @@ -4901,8 +4899,8 @@ function frmAdminBuildJS() { option; const choiceComponents = getChoiceValueAndLabel( this ); - newValue = choiceComponents.value; - newValueLabel = choiceComponents.label; + const newValue = choiceComponents.value; + const newLabel = choiceComponents.label; if ( oldValue === newValue ) { return; @@ -4962,7 +4960,7 @@ function frmAdminBuildJS() { } option.setAttribute( 'value', newValue ); - option.textContent = newValueLabel; + option.textContent = newLabel; if ( fieldIds.indexOf( logicId ) === -1 ) { fieldIds.push( logicId ); From 2e82f5240e87b7ce5c5a75d904f1ba5c244260e2 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Mon, 1 Apr 2024 16:58:19 +0300 Subject: [PATCH 04/24] Add function comments --- js/formidable_admin.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 3f8d583e16..e3112d7f11 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4865,6 +4865,12 @@ function frmAdminBuildJS() { } } + /** + * Returns an object that has the new value and label, when a field choice is changed. + * + * @param {HTMLElement} choiceElement + * @returns {Object} + */ const getChoiceValueAndLabel = choiceElement => { let value, label; if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed @@ -4876,6 +4882,7 @@ function frmAdminBuildJS() { return { value, label }; } + // saved value changed label = choiceElement.closest( '.frm_single_option' ).querySelector( 'input[type="text"]' ).value; value = choiceElement.value; return { value, label }; @@ -5499,6 +5506,13 @@ function frmAdminBuildJS() { adjustConditionalLogicOptionOrders( fieldId ); } + /** + * Returns an object that has a value and label for new conditional logic option, for a given option value. + * + * @param {Number} fieldId + * @param {string} expectedOption + * @returns {Object} + */ const getNewConditionalLogicOption = ( fieldId, expectedOption ) => { const optionsContainer = document.getElementById( 'frm_field_' + fieldId + '_opts' ); From 92d001a7e5ecc5c884940ba2f12fc4a582b95cf0 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 11:43:28 +0300 Subject: [PATCH 05/24] Remove debug line and directly return function result --- js/formidable_admin.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index e3112d7f11..2b20bb452c 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -5519,8 +5519,7 @@ function frmAdminBuildJS() { const expectedOptionContainer = optionsContainer.querySelector( 'input[value="' + expectedOption + '"]' ); if ( expectedOptionContainer ) { - const choiceComponents = getChoiceValueAndLabel( expectedOptionContainer ); - return { value: choiceComponents.value, label: choiceComponents.label }; + return getChoiceValueAndLabel( expectedOptionContainer ); } return { value: expectedOption, label: expectedOption } @@ -5570,7 +5569,6 @@ function frmAdminBuildJS() { } optionMatch = valueSelect.querySelector( 'option[value=""]' ); - console.log('Empty option', optionMatch); if ( optionMatch !== null ) { valueSelect.prepend( optionMatch ); } From 9b713d1476c41343c9d1a39ce85444b0324f2057 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 11:45:46 +0300 Subject: [PATCH 06/24] Fix eslint error --- js/formidable_admin.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 2b20bb452c..96c7a76d65 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -5522,7 +5522,7 @@ function frmAdminBuildJS() { return getChoiceValueAndLabel( expectedOptionContainer ); } - return { value: expectedOption, label: expectedOption } + return { value: expectedOption, label: expectedOption }; }; function adjustConditionalLogicOptionOrders( fieldId, type ) { From d50381aba2fc3e833dcd7cafb9f2bc56ec2139db Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 17:40:56 +0300 Subject: [PATCH 07/24] Use choice value for querying value dropdown options --- js/formidable_admin.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 96c7a76d65..c15843ca37 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4890,7 +4890,7 @@ function frmAdminBuildJS() { function onOptionTextBlur() { var originalValue, - oldValue = this.getAttribute( 'data-value-on-focus' ), + oldValue, fieldId, fieldIndex, logicId, @@ -4905,6 +4905,12 @@ function frmAdminBuildJS() { optionMatches, option; + if ( this.parentElement.classList.contains( 'frm_single_option' ) ) { + oldValue = this.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); + } else { + this.getAttribute( 'data-value-on-focus' ) + } + const choiceComponents = getChoiceValueAndLabel( this ); const newValue = choiceComponents.value; const newLabel = choiceComponents.label; From 9d9c4fc8d85e695d65a037fe84581d01417309be Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 17:56:19 +0300 Subject: [PATCH 08/24] Delete conditional logic opts when field option is deleted --- js/formidable_admin.js | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index c15843ca37..ea9ceac360 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -3520,6 +3520,29 @@ function frmAdminBuildJS() { } }); fieldUpdated(); + deleteRelatedConditionalLogicOptions( this ); + } + + /** + * Deletes all conditional logic dropdown option elements that correspond to the deleted field option. + * + * @since x.x + * @param {HTMLElement} option + * @return void + */ + function deleteRelatedConditionalLogicOptions( option ) { + const deletedOptionValue = option.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).value; + const rows = builderPage.querySelectorAll( '.frm_logic_row' ); + const rowLength = rows.length; + for ( let rowIndex = 0; rowIndex < rowLength; rowIndex++ ) { + const row = rows[ rowIndex ]; + const logicId = row.id.split( '_' )[ 2 ]; + const valueSelect = row.querySelector( 'select[name="field_options[hide_opt_' + logicId + '][]"]' ); + const relatedConditionalLogicOption = valueSelect.querySelector( 'option[value="' + deletedOptionValue + '"]' ); + if ( relatedConditionalLogicOption ) { + relatedConditionalLogicOption.remove(); + } + } } /** From a7a9de19642d44e0216a4c5633dee9990e082ece Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 17:59:03 +0300 Subject: [PATCH 09/24] Add semicolon --- js/formidable_admin.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index ea9ceac360..d0120e1395 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4931,7 +4931,7 @@ function frmAdminBuildJS() { if ( this.parentElement.classList.contains( 'frm_single_option' ) ) { oldValue = this.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); } else { - this.getAttribute( 'data-value-on-focus' ) + this.getAttribute( 'data-value-on-focus' ); } const choiceComponents = getChoiceValueAndLabel( this ); From a0fa50b12ba221273ae18326a9595f9f3948a5ca Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 18:01:24 +0300 Subject: [PATCH 10/24] Fix potential error --- js/formidable_admin.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index d0120e1395..8ce8bfab7a 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4931,7 +4931,7 @@ function frmAdminBuildJS() { if ( this.parentElement.classList.contains( 'frm_single_option' ) ) { oldValue = this.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); } else { - this.getAttribute( 'data-value-on-focus' ); + oldValue = this.getAttribute( 'data-value-on-focus' ); } const choiceComponents = getChoiceValueAndLabel( this ); From ad3db15f62bb875929a49951bd38b53ce74d67d2 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 18:35:32 +0300 Subject: [PATCH 11/24] Fix potential bug --- js/formidable_admin.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 8ce8bfab7a..fe4202db8d 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4913,7 +4913,7 @@ function frmAdminBuildJS() { function onOptionTextBlur() { var originalValue, - oldValue, + oldValue = this.getAttribute( 'data-value-on-focus' ), fieldId, fieldIndex, logicId, @@ -4928,7 +4928,7 @@ function frmAdminBuildJS() { optionMatches, option; - if ( this.parentElement.classList.contains( 'frm_single_option' ) ) { + if ( this.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked && this.parentElement.classList.contains( 'frm_single_option' ) ) { oldValue = this.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); } else { oldValue = this.getAttribute( 'data-value-on-focus' ); From 936eecbae58665a2ffa19cf0ddb8eadde4f20ab5 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 18:39:32 +0300 Subject: [PATCH 12/24] Add a check if separate values is checked --- js/formidable_admin.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index fe4202db8d..c17301c6e6 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4897,11 +4897,13 @@ function frmAdminBuildJS() { const getChoiceValueAndLabel = choiceElement => { let value, label; if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed - value = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' )?.value; label = choiceElement.value; - if ( ! value ) { + if ( choiceElement.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked ) { + value = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' )?.value; + } else { value = label; } + return { value, label }; } From 77203f3f302632b2ba7c88ab807cbc7757c01634 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 3 Apr 2024 21:34:38 +0300 Subject: [PATCH 13/24] Edge cases considered --- js/formidable_admin.js | 42 +++++++++++++++++++++++++++++++----------- 1 file changed, 31 insertions(+), 11 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index c17301c6e6..00a46e6346 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4897,13 +4897,11 @@ function frmAdminBuildJS() { const getChoiceValueAndLabel = choiceElement => { let value, label; if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed + value = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' )?.value; label = choiceElement.value; - if ( choiceElement.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked ) { - value = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' )?.value; - } else { + if ( ! value ) { value = label; } - return { value, label }; } @@ -4915,7 +4913,7 @@ function frmAdminBuildJS() { function onOptionTextBlur() { var originalValue, - oldValue = this.getAttribute( 'data-value-on-focus' ), + oldValue, fieldId, fieldIndex, logicId, @@ -4928,11 +4926,15 @@ function frmAdminBuildJS() { settingId, setting, optionMatches, - option; + option, + usingSeparateValues = this.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked; - if ( this.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked && this.parentElement.classList.contains( 'frm_single_option' ) ) { - oldValue = this.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); - } else { + if ( usingSeparateValues ) { + if ( this.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed + oldValue = this.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); + } + } + if ( typeof oldValue === 'undefined' ) { oldValue = this.getAttribute( 'data-value-on-focus' ); } @@ -4988,8 +4990,14 @@ function frmAdminBuildJS() { optionMatches = valueSelect.querySelectorAll( 'option[value="' + newValue + '"]' ); if ( ! optionMatches.length ) { - option = document.createElement( 'option' ); - valueSelect.appendChild( option ); + if ( ! usingSeparateValues ) { + option = searchSelectByText( valueSelect, oldValue ); // Find conditional logic option with oldValue + } + + if ( ! option ) { + option = document.createElement( 'option' ); + valueSelect.appendChild( option ); + } } } @@ -5012,6 +5020,18 @@ function frmAdminBuildJS() { } } + function searchSelectByText(selectElement, searchText) { + const options = selectElement.options; + + for (let i = 0; i < options.length; i++) { + const option = options[i]; + if ( searchText === option.textContent ) { + return option; + } + } + return null; + } + function updateGetValueFieldSelection() { /*jshint validthis:true */ var fieldID = this.id.replace( 'get_values_form_', '' ); From 2ca37f9cbfad2964ca6c622e45b04d972a2c16ff Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 4 Apr 2024 10:55:18 +0300 Subject: [PATCH 14/24] Prepend new options to conditional logic value dropdown --- js/formidable_admin.js | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 00a46e6346..526b67c62a 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -3528,17 +3528,17 @@ function frmAdminBuildJS() { * * @since x.x * @param {HTMLElement} option - * @return void + * @return {void} */ function deleteRelatedConditionalLogicOptions( option ) { const deletedOptionValue = option.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).value; - const rows = builderPage.querySelectorAll( '.frm_logic_row' ); - const rowLength = rows.length; + const rows = builderPage.querySelectorAll( '.frm_logic_row' ); + const rowLength = rows.length; + for ( let rowIndex = 0; rowIndex < rowLength; rowIndex++ ) { const row = rows[ rowIndex ]; const logicId = row.id.split( '_' )[ 2 ]; - const valueSelect = row.querySelector( 'select[name="field_options[hide_opt_' + logicId + '][]"]' ); - const relatedConditionalLogicOption = valueSelect.querySelector( 'option[value="' + deletedOptionValue + '"]' ); + const relatedConditionalLogicOption = row.querySelector( 'select[name="field_options[hide_opt_' + logicId + '][]"] option[value="' + deletedOptionValue + '"]' ); if ( relatedConditionalLogicOption ) { relatedConditionalLogicOption.remove(); } @@ -4897,11 +4897,8 @@ function frmAdminBuildJS() { const getChoiceValueAndLabel = choiceElement => { let value, label; if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed - value = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' )?.value; + value = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' ).value; label = choiceElement.value; - if ( ! value ) { - value = label; - } return { value, label }; } @@ -4914,6 +4911,7 @@ function frmAdminBuildJS() { function onOptionTextBlur() { var originalValue, oldValue, + oldLabel, fieldId, fieldIndex, logicId, @@ -4932,17 +4930,19 @@ function frmAdminBuildJS() { if ( usingSeparateValues ) { if ( this.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed oldValue = this.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); + oldLabel = this.getAttribute( 'data-value-on-focus' ); } } if ( typeof oldValue === 'undefined' ) { oldValue = this.getAttribute( 'data-value-on-focus' ); + oldLabel = this.closest( '.frm_single_option' ).querySelector( 'input[type="text"]' ).getAttribute( 'data-value-on-focus' ); } const choiceComponents = getChoiceValueAndLabel( this ); const newValue = choiceComponents.value; const newLabel = choiceComponents.label; - if ( oldValue === newValue ) { + if ( oldValue === newValue && oldLabel === newLabel ) { return; } @@ -5615,7 +5615,7 @@ function frmAdminBuildJS() { } if ( optionMatch ) { - valueSelect.prepend( optionMatch ); + valueSelect.append( optionMatch ); } } From 2503aff81236c5ba206ea17c5e280838666f482e Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 4 Apr 2024 12:11:05 +0300 Subject: [PATCH 15/24] Improve codestyles --- js/formidable_admin.js | 106 ++++++++++++++++++++++++----------------- 1 file changed, 62 insertions(+), 44 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 526b67c62a..311a96da1a 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4894,24 +4894,49 @@ function frmAdminBuildJS() { * @param {HTMLElement} choiceElement * @returns {Object} */ - const getChoiceValueAndLabel = choiceElement => { - let value, label; + function getChoiceNewValueAndLabel( choiceElement ) { + let newValue, newLabel; if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed - value = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' ).value; - label = choiceElement.value; - return { value, label }; + newValue = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' ).value; + newLabel = choiceElement.value; + return { newValue, newLabel }; } // saved value changed - label = choiceElement.closest( '.frm_single_option' ).querySelector( 'input[type="text"]' ).value; - value = choiceElement.value; - return { value, label }; - }; + newLabel = choiceElement.closest( '.frm_single_option' ).querySelector( 'input[type="text"]' ).value; + newValue = choiceElement.value; + return { newValue, newLabel }; + } + + function getChoiceOldAndNewValues( input ) { + const { oldValue, oldLabel } = getChoiceOldValueAndLabel( input ); + const { newValue, newLabel } = getChoiceNewValueAndLabel( input ); + + return { oldValue, oldLabel, newValue, newLabel }; + } + + function getChoiceOldValueAndLabel( input ) { + const usingSeparateValues = input.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked; + const singleOptionContainer = input.closest( '.frm_single_option' ); + + let oldValue, oldLabel; + + if ( usingSeparateValues ) { + if ( input.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed + oldValue = singleOptionContainer.querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); + oldLabel = input.getAttribute( 'data-value-on-focus' ); + } + } + if ( typeof oldValue === 'undefined' ) { + oldValue = input.getAttribute( 'data-value-on-focus' ); + oldLabel = singleOptionContainer.querySelector( 'input[type="text"]' ).getAttribute( 'data-value-on-focus' ); + } + + return { oldValue, oldLabel }; + } function onOptionTextBlur() { var originalValue, - oldValue, - oldLabel, fieldId, fieldIndex, logicId, @@ -4923,24 +4948,9 @@ function frmAdminBuildJS() { fieldIds, settingId, setting, - optionMatches, - option, - usingSeparateValues = this.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked; + optionMatches; - if ( usingSeparateValues ) { - if ( this.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed - oldValue = this.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); - oldLabel = this.getAttribute( 'data-value-on-focus' ); - } - } - if ( typeof oldValue === 'undefined' ) { - oldValue = this.getAttribute( 'data-value-on-focus' ); - oldLabel = this.closest( '.frm_single_option' ).querySelector( 'input[type="text"]' ).getAttribute( 'data-value-on-focus' ); - } - - const choiceComponents = getChoiceValueAndLabel( this ); - const newValue = choiceComponents.value; - const newLabel = choiceComponents.label; + const { oldValue, oldLabel, newValue, newLabel } = getChoiceOldAndNewValues( this ); if ( oldValue === newValue && oldLabel === newLabel ) { return; @@ -4986,6 +4996,8 @@ function frmAdminBuildJS() { optionMatches = valueSelect.querySelectorAll( 'option[value="' + oldValue + '"]' ); } + let option; + if ( ! optionMatches.length ) { optionMatches = valueSelect.querySelectorAll( 'option[value="' + newValue + '"]' ); @@ -5020,15 +5032,23 @@ function frmAdminBuildJS() { } } - function searchSelectByText(selectElement, searchText) { + /** + * Returns an option element that matches a string with its text content. + * + * @param {HTMLElement} selectElement + * @param {string} searchText + * @returns {HTMLElement|null} + */ + function searchSelectByText( selectElement, searchText ) { const options = selectElement.options; - - for (let i = 0; i < options.length; i++) { - const option = options[i]; - if ( searchText === option.textContent ) { - return option; - } + + for ( let i = 0; i < options.length; i++ ) { + const option = options[i]; + if ( searchText === option.textContent ) { + return option; + } } + return null; } @@ -5564,17 +5584,17 @@ function frmAdminBuildJS() { * @param {string} expectedOption * @returns {Object} */ - const getNewConditionalLogicOption = ( fieldId, expectedOption ) => { + function getNewConditionalLogicOption( fieldId, expectedOption ) { const optionsContainer = document.getElementById( 'frm_field_' + fieldId + '_opts' ); - const expectedOptionContainer = optionsContainer.querySelector( 'input[value="' + expectedOption + '"]' ); + const expectedOptionInput = optionsContainer.querySelector( 'input[value="' + expectedOption + '"]' ); - if ( expectedOptionContainer ) { - return getChoiceValueAndLabel( expectedOptionContainer ); + if ( expectedOptionInput ) { + return getChoiceNewValueAndLabel( expectedOptionInput ); } - return { value: expectedOption, label: expectedOption }; - }; + return { newValue: expectedOption, newLabel: expectedOption }; + } function adjustConditionalLogicOptionOrders( fieldId, type ) { var row, opts, logicId, valueSelect, optionLength, optionIndex, expectedOption, optionMatch, fieldOptions, @@ -5604,9 +5624,7 @@ function frmAdminBuildJS() { optionMatch = valueSelect.querySelector( 'option[value="' + expectedOptionValue + '"]' ); - const newConditionalLogicOption = getNewConditionalLogicOption( fieldId, expectedOption ); - const newValue = newConditionalLogicOption.value; - const newLabel = newConditionalLogicOption.label; + const { newValue, newLabel } = getNewConditionalLogicOption( fieldId, expectedOption ); if ( optionMatch === null && ! valueSelect.querySelector( 'option[value="' + newValue + '"]' ) ) { optionMatch = document.createElement( 'option' ); From d2aab9181859fcbf2e1bf708a25b1d83b6557a4e Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 4 Apr 2024 14:03:54 +0300 Subject: [PATCH 16/24] Add a little refactoring --- js/formidable_admin.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 311a96da1a..9b1fb65632 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -3533,10 +3533,9 @@ function frmAdminBuildJS() { function deleteRelatedConditionalLogicOptions( option ) { const deletedOptionValue = option.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).value; const rows = builderPage.querySelectorAll( '.frm_logic_row' ); - const rowLength = rows.length; - for ( let rowIndex = 0; rowIndex < rowLength; rowIndex++ ) { - const row = rows[ rowIndex ]; + for ( let rowIndex = 0; rowIndex < rows.length; rowIndex++ ) { + const row = rows[ rowIndex ]; const logicId = row.id.split( '_' )[ 2 ]; const relatedConditionalLogicOption = row.querySelector( 'select[name="field_options[hide_opt_' + logicId + '][]"] option[value="' + deletedOptionValue + '"]' ); if ( relatedConditionalLogicOption ) { From 804b86efd4de286fb93c2625865e8e95e856e89a Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 4 Apr 2024 14:24:17 +0300 Subject: [PATCH 17/24] Avoid potential bug --- js/formidable_admin.js | 51 ++++++++++++++++++++++++++---------------- 1 file changed, 32 insertions(+), 19 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 9b1fb65632..2a68a475c3 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4887,6 +4887,13 @@ function frmAdminBuildJS() { } } + function getChoiceOldAndNewValues( input ) { + const { oldValue, oldLabel } = getChoiceOldValueAndLabel( input ); + const { newValue, newLabel } = getChoiceNewValueAndLabel( input ); + + return { oldValue, oldLabel, newValue, newLabel }; + } + /** * Returns an object that has the new value and label, when a field choice is changed. * @@ -4894,42 +4901,48 @@ function frmAdminBuildJS() { * @returns {Object} */ function getChoiceNewValueAndLabel( choiceElement ) { + const singleOptionContainer = choiceElement.closest( '.frm_single_option' ); + let newValue, newLabel; + if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed - newValue = choiceElement.parentElement.querySelector( '.frm_option_key input[type="text"]' ).value; + newValue = singleOptionContainer.querySelector( '.frm_option_key input[type="text"]' ).value; newLabel = choiceElement.value; return { newValue, newLabel }; } // saved value changed - newLabel = choiceElement.closest( '.frm_single_option' ).querySelector( 'input[type="text"]' ).value; + newLabel = singleOptionContainer.querySelector( 'input[type="text"]' ).value; newValue = choiceElement.value; return { newValue, newLabel }; } - function getChoiceOldAndNewValues( input ) { - const { oldValue, oldLabel } = getChoiceOldValueAndLabel( input ); - const { newValue, newLabel } = getChoiceNewValueAndLabel( input ); - - return { oldValue, oldLabel, newValue, newLabel }; - } - - function getChoiceOldValueAndLabel( input ) { - const usingSeparateValues = input.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked; - const singleOptionContainer = input.closest( '.frm_single_option' ); + /** + * Returns an object that has the old value and label, when a field choice is changed. + * + * @param {HTMLElement} choiceElement + * @returns {Object} + */ + function getChoiceOldValueAndLabel( choiceElement ) { + const usingSeparateValues = choiceElement.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked; + const singleOptionContainer = choiceElement.closest( '.frm_single_option' ); let oldValue, oldLabel; + // if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed + // oldValue = singleOptionContainer.querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); + // oldLabel = choiceElement.getAttribute( 'data-value-on-focus' ); + // return { oldValue, oldLabel }; + // } if ( usingSeparateValues ) { - if ( input.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed + if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed oldValue = singleOptionContainer.querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); - oldLabel = input.getAttribute( 'data-value-on-focus' ); + oldLabel = choiceElement.getAttribute( 'data-value-on-focus' ); + return { oldValue, oldLabel }; } } - if ( typeof oldValue === 'undefined' ) { - oldValue = input.getAttribute( 'data-value-on-focus' ); - oldLabel = singleOptionContainer.querySelector( 'input[type="text"]' ).getAttribute( 'data-value-on-focus' ); - } + oldValue = choiceElement.getAttribute( 'data-value-on-focus' ); + oldLabel = singleOptionContainer.querySelector( 'input[type="text"]' ).getAttribute( 'data-value-on-focus' ); return { oldValue, oldLabel }; } @@ -5001,7 +5014,7 @@ function frmAdminBuildJS() { optionMatches = valueSelect.querySelectorAll( 'option[value="' + newValue + '"]' ); if ( ! optionMatches.length ) { - if ( ! usingSeparateValues ) { + if ( ! this.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked ) { option = searchSelectByText( valueSelect, oldValue ); // Find conditional logic option with oldValue } From 594942f2a1addd31b987b75127d0d40df402ca59 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 4 Apr 2024 14:25:33 +0300 Subject: [PATCH 18/24] Add missing function comment --- js/formidable_admin.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 2a68a475c3..6e9c350bc2 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4887,6 +4887,12 @@ function frmAdminBuildJS() { } } + /** + * Returns an object that has the old and new values and labels, when a field choice is changed. + * + * @param {HTMLElement} choiceElement + * @returns {Object} + */ function getChoiceOldAndNewValues( input ) { const { oldValue, oldLabel } = getChoiceOldValueAndLabel( input ); const { newValue, newLabel } = getChoiceNewValueAndLabel( input ); From 2678199a1922f74fabf46a1788c9d79881d6b64d Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 4 Apr 2024 14:27:00 +0300 Subject: [PATCH 19/24] Undo change not needed --- js/formidable_admin.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 6e9c350bc2..9ee9bdf284 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4966,7 +4966,8 @@ function frmAdminBuildJS() { fieldIds, settingId, setting, - optionMatches; + optionMatches, + option; const { oldValue, oldLabel, newValue, newLabel } = getChoiceOldAndNewValues( this ); @@ -5014,8 +5015,6 @@ function frmAdminBuildJS() { optionMatches = valueSelect.querySelectorAll( 'option[value="' + oldValue + '"]' ); } - let option; - if ( ! optionMatches.length ) { optionMatches = valueSelect.querySelectorAll( 'option[value="' + newValue + '"]' ); From d5d1d660330b6b3cd3a86bdc654960e0c29fd087 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Thu, 4 Apr 2024 14:30:12 +0300 Subject: [PATCH 20/24] Improve DOM query --- js/formidable_admin.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 9ee9bdf284..14a9440e78 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4975,7 +4975,9 @@ function frmAdminBuildJS() { return; } - fieldId = jQuery( this ).closest( '.frm-single-settings' ).attr( 'data-fid' ); + const singleSettingsContainer = this.closest( '.frm-single-settings' ); + + fieldId = singleSettingsContainer.getAttribute( 'data-fid' ); originalValue = this.getAttribute( 'data-value-on-load' ); // check if the newValue is already mapped to another option @@ -5019,7 +5021,7 @@ function frmAdminBuildJS() { optionMatches = valueSelect.querySelectorAll( 'option[value="' + newValue + '"]' ); if ( ! optionMatches.length ) { - if ( ! this.closest( '.frm-single-settings' ).querySelector( '.frm_toggle_sep_values' ).checked ) { + if ( ! singleSettingsContainer.querySelector( '.frm_toggle_sep_values' ).checked ) { option = searchSelectByText( valueSelect, oldValue ); // Find conditional logic option with oldValue } From 7baad481f06ba192662618ef199efaca45df7ffc Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Fri, 5 Apr 2024 15:10:31 +0300 Subject: [PATCH 21/24] Remove commented lines and use Array.forEach --- js/formidable_admin.js | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 14a9440e78..a7e4e068c5 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -3534,14 +3534,13 @@ function frmAdminBuildJS() { const deletedOptionValue = option.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).value; const rows = builderPage.querySelectorAll( '.frm_logic_row' ); - for ( let rowIndex = 0; rowIndex < rows.length; rowIndex++ ) { - const row = rows[ rowIndex ]; + rows.forEach( row => { const logicId = row.id.split( '_' )[ 2 ]; const relatedConditionalLogicOption = row.querySelector( 'select[name="field_options[hide_opt_' + logicId + '][]"] option[value="' + deletedOptionValue + '"]' ); if ( relatedConditionalLogicOption ) { relatedConditionalLogicOption.remove(); } - } + }); } /** @@ -4935,11 +4934,6 @@ function frmAdminBuildJS() { let oldValue, oldLabel; - // if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed - // oldValue = singleOptionContainer.querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); - // oldLabel = choiceElement.getAttribute( 'data-value-on-focus' ); - // return { oldValue, oldLabel }; - // } if ( usingSeparateValues ) { if ( choiceElement.parentElement.classList.contains( 'frm_single_option' ) ) { // label changed oldValue = singleOptionContainer.querySelector( '.frm_option_key input[type="text"]' ).getAttribute( 'data-value-on-focus' ); From 96bef34f367dfdb045617e420f9cdb13ee97e719 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Tue, 9 Apr 2024 15:46:28 +0300 Subject: [PATCH 22/24] Move function that deletes conditional logic opts to pro using hook --- js/formidable_admin.js | 22 +--------------------- 1 file changed, 1 insertion(+), 21 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index a7e4e068c5..679ec0bd70 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -3508,6 +3508,7 @@ function frmAdminBuildJS() { fieldId = this.getAttribute( 'data-fid' ); jQuery( parentLi ).fadeOut( 'slow', function() { + wp.hooks.doAction( 'frm_before_delete_field_option', this ); jQuery( parentLi ).remove(); var hasOther = jQuery( parentUl ).find( '.frm_other_option' ); @@ -3520,27 +3521,6 @@ function frmAdminBuildJS() { } }); fieldUpdated(); - deleteRelatedConditionalLogicOptions( this ); - } - - /** - * Deletes all conditional logic dropdown option elements that correspond to the deleted field option. - * - * @since x.x - * @param {HTMLElement} option - * @return {void} - */ - function deleteRelatedConditionalLogicOptions( option ) { - const deletedOptionValue = option.closest( '.frm_single_option' ).querySelector( '.frm_option_key input[type="text"]' ).value; - const rows = builderPage.querySelectorAll( '.frm_logic_row' ); - - rows.forEach( row => { - const logicId = row.id.split( '_' )[ 2 ]; - const relatedConditionalLogicOption = row.querySelector( 'select[name="field_options[hide_opt_' + logicId + '][]"] option[value="' + deletedOptionValue + '"]' ); - if ( relatedConditionalLogicOption ) { - relatedConditionalLogicOption.remove(); - } - }); } /** From ceddb1fc3de006b4a0cf503d89d9708b2481a5eb Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 7 Aug 2024 10:05:33 +0300 Subject: [PATCH 23/24] Fix merge conflict with #1894 --- js/formidable_admin.js | 24 +++++------------------- 1 file changed, 5 insertions(+), 19 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 3435da6a77..367dc6485a 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -5738,7 +5738,6 @@ function frmAdminBuildJS() { for ( optionIndex = optionLength - 1; optionIndex >= 0; optionIndex-- ) { expectedOption = fieldOptions[ optionIndex ]; -<<<<<<< HEAD let expectedOptionValue = document.getElementById( 'frm_field_' + fieldId + '_opts' ).querySelector( '.frm_option_key input[type="text"]' )?.value; if ( ! expectedOptionValue ) { expectedOptionValue = expectedOption; @@ -5748,18 +5747,6 @@ function frmAdminBuildJS() { const { newValue, newLabel } = getNewConditionalLogicOption( fieldId, expectedOption ); - if ( optionMatch === null && ! valueSelect.querySelector( 'option[value="' + newValue + '"]' ) ) { - optionMatch = document.createElement( 'option' ); - optionMatch.setAttribute( 'value', newValue ); - optionMatch.textContent = newLabel; - } - - if ( optionMatch ) { - valueSelect.append( optionMatch ); - } -======= - optionMatch = valueSelect.querySelector( 'option[value="' + expectedOption + '"]' ); - const fieldChoices = document.querySelectorAll( '#frm_field_' + fieldId + '_opts input[data-value-on-focus]' ); const expectedChoiceEl = Array.from( fieldChoices ).find( element => element.value === expectedOption ); if ( expectedChoiceEl ) { @@ -5769,8 +5756,7 @@ function frmAdminBuildJS() { continue; } } - prependValueSelectWithOptionMatch( valueSelect, optionMatch, expectedOption ); ->>>>>>> master + prependValueSelectWithOptionMatch( valueSelect, optionMatch, expectedOption, newValue, newLabel ); } optionMatch = valueSelect.querySelector( 'option[value=""]' ); @@ -5780,10 +5766,10 @@ function frmAdminBuildJS() { } } - function prependValueSelectWithOptionMatch( valueSelect, optionMatch, expectedOption ) { - if ( optionMatch === null ) { - optionMatch = frmDom.tag( 'option', { text: expectedOption }); - optionMatch.value = expectedOption; + function prependValueSelectWithOptionMatch( valueSelect, optionMatch, newValue, newLabel ) { + if ( optionMatch === null && ! valueSelect.querySelector( 'option[value="' + newValue + '"]' )) { + optionMatch = frmDom.tag( 'option', { text: newLabel }); + optionMatch.value = newValue; } valueSelect.prepend( optionMatch ); From 7e7bd5316fe242440ee520d9876b66d57f916ba3 Mon Sep 17 00:00:00 2001 From: Abdi Tolessa <41271840+AbdiTolesa@users.noreply.github.com> Date: Wed, 7 Aug 2024 10:08:16 +0300 Subject: [PATCH 24/24] Fix eslint errors --- js/formidable_admin.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/formidable_admin.js b/js/formidable_admin.js index 367dc6485a..3e6db48865 100644 --- a/js/formidable_admin.js +++ b/js/formidable_admin.js @@ -4975,7 +4975,7 @@ function frmAdminBuildJS() { /** * Returns an object that has the old and new values and labels, when a field choice is changed. * - * @param {HTMLElement} choiceElement + * @param {HTMLElement} input * @returns {Object} */ function getChoiceOldAndNewValues( input ) { @@ -5756,7 +5756,7 @@ function frmAdminBuildJS() { continue; } } - prependValueSelectWithOptionMatch( valueSelect, optionMatch, expectedOption, newValue, newLabel ); + prependValueSelectWithOptionMatch( valueSelect, optionMatch, newValue, newLabel ); } optionMatch = valueSelect.querySelector( 'option[value=""]' );