Issue #3340439: Element of Margin / Padding accepting invalid values like letters and special chars

src/Plugin/Field/FieldWidget/EbtSettingsDefaultWidget.php

@@ -67,6 +67,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['margin_right'] = [
@@ -76,6 +77,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['margin_bottom'] = [
@@ -85,6 +87,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['margin_left'] = [
@@ -94,6 +97,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2'] = [
@@ -116,6 +120,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2']['border_right'] = [
@@ -125,6 +130,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2']['border_bottom'] = [
@@ -134,6 +140,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2']['border_left'] = [
@@ -143,6 +150,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2']['box3'] = [
@@ -165,6 +173,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2']['box3']['padding_right'] = [
@@ -174,6 +183,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2']['box3']['padding_bottom'] = [
@@ -183,6 +193,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2']['box3']['padding_left'] = [
@@ -192,6 +203,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => '-',
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['box1']['box2']['box3']['box4'] = [
@@ -214,6 +226,7 @@ class EbtSettingsDefaultWidget extends WidgetBase {
       '#attributes' => [
         'placeholder' => $this->t('Select Color'),
       ],
+      '#element_validate' => [[$this, 'validateBoxElement']],
     ];
 
     $element['ebt_settings']['design_options']['other_settings']['border_style'] = [
@@ -326,4 +339,23 @@ class EbtSettingsDefaultWidget extends WidgetBase {
     return $values;
   }
 
+  /**
+   * Validate if the box element has only numeric values.
+   */
+  public function validateBoxElement($element, FormStateInterface $form_state, $form) {
+
+    // If element is empty, skip.
+    if (empty($element['#value'])) {
+      return;
+    }
+
+    // Get the element value.
+    $elementValue = $element['#value'];
+
+    // If the value isn't numeric, set error on validation.
+    if (!is_numeric($elementValue)) {
+      $form_state->setError($element, $this->t('Please use only numbers on box values'));
+    }
+  }
+
 }