Prefix and Suffix settings for Number fields

Resolves #4055
craftcms · Mar 27, 2019 · e0eebc2 · e0eebc2
1 parent a06e979
commit e0eebc2
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 6 deletions.
diff --git a/CHANGELOG-v3.md b/CHANGELOG-v3.md
@@ -4,6 +4,7 @@
 
 ### Added
 - Added the `verifyEmailSuccessPath` config setting.
+- Added the “Prefix” and “Suffix” settings for Number fields. ([#4055](https://github.com/craftcms/cms/issues/4055))
 - Added the “Max Length” setting for URL fields. ([#4019](https://github.com/craftcms/cms/issues/4019))
 - Added the `devMode` global Twig variable. ([#4038](https://github.com/craftcms/cms/issues/4038))
 - Added `craft\config\GeneralConfig::getVerifyEmailSuccessPath()`.

diff --git a/src/fields/Number.php b/src/fields/Number.php
@@ -62,6 +62,16 @@ public static function displayName(): string
      */
     public $size;
 
+    /**
+     * @var string|null Text that should be displayed before the input
+     */
+    public $prefix;
+
+    /**
+     * @var string|null Text that should be displayed after the input
+     */
+    public $suffix;
+
     // Public Methods
     // =========================================================================
 
@@ -171,12 +181,10 @@ public function getInputHtml($value, ElementInterface $element = null): string
             }
         }
 
-        return '<input type="hidden" name="' . $this->handle . '[locale]" value="' . Craft::$app->language . '">' .
-            Craft::$app->getView()->renderTemplate('_includes/forms/text', [
-                'name' => $this->handle . '[value]',
-                'value' => $value,
-                'size' => $this->size
-            ]);
+        return Craft::$app->getView()->renderTemplate('_components/fieldtypes/Number/input', [
+            'field' => $this,
+            'value' => $value,
+        ]);
     }
 
     /**

diff --git a/src/templates/_components/fieldtypes/Number/input.html b/src/templates/_components/fieldtypes/Number/input.html
@@ -0,0 +1,22 @@
+{% from '_includes/forms' import text %}
+
+<input type="hidden" name="{{  field.handle }}[locale]" value="{{ craft.app.language }}">
+<div class="flex">
+    {% if field.prefix %}
+        <div>
+            {{ field.prefix|md(inlineOnly=true)|raw }}
+        </div>
+    {% endif %}
+    <div>
+        {{ text({
+            name: field.handle ~ '[value]',
+            value: value,
+            size: field.size
+        }) }}
+    </div>
+    {% if field.suffix %}
+        <div>
+            {{ field.suffix|md(inlineOnly=true)|raw }}
+        </div>
+    {% endif %}
+</div>
diff --git a/src/templates/_components/fieldtypes/Number/settings.html b/src/templates/_components/fieldtypes/Number/settings.html
@@ -44,3 +44,21 @@
     size: 2,
     errors: field.getErrors('size')
 }) }}
+
+{{ forms.textField({
+    label: "Prefix Text"|t('app'),
+    instructions: "Text that should be shown before the input."|t('app'),
+    id: 'prefix',
+    name: 'prefix',
+    value: field.prefix,
+    errors: field.getErrors('prefix')
+}) }}
+
+{{ forms.textField({
+    label: "Suffix Text"|t('app'),
+    instructions: "Text that should be shown after the input."|t('app'),
+    id: 'suffix',
+    name: 'suffix',
+    value: field.suffix,
+    errors: field.getErrors('suffix')
+}) }}