diff --git a/assets/js/src/form_editor/blocks/custom_checkbox/custom_field_settings.jsx b/assets/js/src/form_editor/blocks/custom_checkbox/custom_field_settings.jsx
index 07acabab75..f7c9cddcc8 100644
--- a/assets/js/src/form_editor/blocks/custom_checkbox/custom_field_settings.jsx
+++ b/assets/js/src/form_editor/blocks/custom_checkbox/custom_field_settings.jsx
@@ -28,7 +28,14 @@ const CustomFieldSettings = ({
checkboxLabel: localCheckboxLabel,
})}
isBusy={isSaving}
- disabled={isSaving}
+ disabled={
+ isSaving
+ || (
+ localMandatory === mandatory
+ && localIsChecked === isChecked
+ && localCheckboxLabel === checkboxLabel
+ )
+ }
className="button-on-top"
>
{MailPoet.I18n.t('customFieldSaveCTA')}
diff --git a/assets/js/src/form_editor/blocks/custom_date/custom_field_settings.jsx b/assets/js/src/form_editor/blocks/custom_date/custom_field_settings.jsx
index ccf7e42f4a..a5e4a1123a 100644
--- a/assets/js/src/form_editor/blocks/custom_date/custom_field_settings.jsx
+++ b/assets/js/src/form_editor/blocks/custom_date/custom_field_settings.jsx
@@ -51,7 +51,15 @@ const CustomFieldSettings = ({
defaultToday: localDefaultToday,
})}
isBusy={isSaving}
- disabled={isSaving}
+ disabled={
+ isSaving
+ || (
+ localMandatory === mandatory
+ && localDefaultToday === defaultToday
+ && localDateType === dateType
+ && localDateFormat === dateFormat
+ )
+ }
className="button-on-top"
>
{MailPoet.I18n.t('customFieldSaveCTA')}
diff --git a/assets/js/src/form_editor/blocks/custom_radio/custom_field_settings.jsx b/assets/js/src/form_editor/blocks/custom_radio/custom_field_settings.jsx
index bf529c3c7e..c431febf02 100644
--- a/assets/js/src/form_editor/blocks/custom_radio/custom_field_settings.jsx
+++ b/assets/js/src/form_editor/blocks/custom_radio/custom_field_settings.jsx
@@ -5,6 +5,7 @@ import {
} from '@wordpress/components';
import PropTypes from 'prop-types';
import MailPoet from 'mailpoet';
+import { isEmpty, isEqual, xorWith } from 'lodash';
import SettingsPreview from './settings_preview.jsx';
@@ -15,7 +16,7 @@ const CustomFieldSettings = ({
onSave,
}) => {
const [localMandatory, setLocalMandatory] = useState(mandatory);
- const [localValues, setLocalValues] = useState(values);
+ const [localValues, setLocalValues] = useState(JSON.parse(JSON.stringify(values)));
const update = (value) => {
setLocalValues(localValues.map((valueInSelection) => {
@@ -42,7 +43,13 @@ const CustomFieldSettings = ({
values: localValues,
})}
isBusy={isSaving}
- disabled={isSaving}
+ disabled={
+ isSaving
+ || (
+ localMandatory === mandatory
+ && isEmpty(xorWith(values, localValues, isEqual))
+ )
+ }
className="button-on-top"
>
{MailPoet.I18n.t('customFieldSaveCTA')}
diff --git a/assets/js/src/form_editor/blocks/custom_radio/settings_preview.jsx b/assets/js/src/form_editor/blocks/custom_radio/settings_preview.jsx
index fbff5735aa..91dc9df19a 100644
--- a/assets/js/src/form_editor/blocks/custom_radio/settings_preview.jsx
+++ b/assets/js/src/form_editor/blocks/custom_radio/settings_preview.jsx
@@ -81,7 +81,7 @@ const PreviewItem = ({
>
onCheck(value.id, event.target.value)}
+ onChange={(event) => onCheck(value.id, event.target.checked)}
key={`check-${value.id}`}
/>
{MailPoet.I18n.t('customFieldSaveCTA')}