# Perspective Numeric entry field problems

**URL:** <https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923>\
**Category:** Ignition\
**Tags:** ignition81, perspective\
**Created:** [July 5, 2023, 9:44am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923 "2023-07-05T09:44:28Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![tecnoeletronic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tecnoeletronic/32/50975_2.png) [@tecnoeletronic](https://forum.inductiveautomation.com/u/tecnoeletronic)\
**Post date:** [July 5, 2023, 9:44am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/1 "2023-07-05T09:44:28Z")

</div>

Hi,

in my perspective apps i have 2 problems with Numeric entry field (version **8.1.28** ).

1. If the spinner is enabled the "numeric entry field" changes its size when it receives focus. How can I prevent the resizing of the element's size?

Normal condition:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/2/226f074468e81fa02ceb260c084b57a25cf92e52.png)

Focused condition:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/8/b893af4306015156861614b5ff1ec1e46a2bc7ea.png)

1. If i disable the spinner i'm unable to update a value more than once. I have to refresh the page to regain the ability to change the value. If I don't refresh the page, I can only make changes to the data again after performing a specific number of operations or manually losing and regaining focus multiple times.

EDIT on point 2: The issue does not occur when the spinner is enabled.

---

<div class="post-metadata">

**Author:** ![justinedwards.jle](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/justinedwards.jle/32/37854_2.png) [@justinedwards.jle](https://forum.inductiveautomation.com/u/justinedwards.jle)\
**Post date:** [July 5, 2023, 10:10am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/2 "2023-07-05T10:10:51Z")

</div>

Is the problem that the spinner covers up the decimal number? If so, you can use the padding property to move the number over to allow room for the spinner.

---

<div class="post-metadata">

**Author:** ![tecnoeletronic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tecnoeletronic/32/50975_2.png) [@tecnoeletronic](https://forum.inductiveautomation.com/u/tecnoeletronic)\
**Post date:** [July 5, 2023, 10:15am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/3 "2023-07-05T10:15:41Z")

</div>

Hi,

i tried using a padding of 50 but the issue persists.

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/3/f355983b7d4ee8efe71263f8b43a9c5de434608e.png)

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [July 5, 2023, 10:18am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/4 "2023-07-05T10:18:48Z")

</div>

You'll probably have to set `style.overflow` for the flex containers housing the numeric input components to `visible`

---

<div class="post-metadata">

**Author:** ![tecnoeletronic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tecnoeletronic/32/50975_2.png) [@tecnoeletronic](https://forum.inductiveautomation.com/u/tecnoeletronic)\
**Post date:** [July 5, 2023, 10:23am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/5 "2023-07-05T10:23:28Z")

</div>

> [@nminchin](#):
>
> ou'll probably have to set style overflow for the flex containers to visible

With your advice, the box still resizes, but the scroll bars do not appear. For problem 1, I think it could be an acceptable solution.

---

<div class="post-metadata">

**Author:** ![tecnoeletronic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tecnoeletronic/32/50975_2.png) [@tecnoeletronic](https://forum.inductiveautomation.com/u/tecnoeletronic)\
**Post date:** [July 5, 2023, 10:35am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/6 "2023-07-05T10:35:19Z")

</div>

The result is terrible in some cases.. but it works.

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/e/6e1e2202f989fa49260db1e2c4f713c7df55b2e5.png)

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [July 5, 2023, 10:41am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/7 "2023-07-05T10:41:03Z")

</div>

What are your position settings of the numeric input?  
Try increasing the height slightly as well of the row

---

<div class="post-metadata">

**Author:** ![tecnoeletronic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tecnoeletronic/32/50975_2.png) [@tecnoeletronic](https://forum.inductiveautomation.com/u/tecnoeletronic)\
**Post date:** [July 5, 2023, 11:24am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/8 "2023-07-05T11:24:23Z")

</div>

The control isn't on a row. All controls are in a Flex Container.  
Here you are the control's json.

```auto
{
        "type": "ia.input.numeric-entry-field",
        "version": 0,
        "props": {
          "format": "###0.0",
          "spinner": {
            "increment": 0.1
          },
          "style": {
            "marginBottom": 5,
            "marginLeft": 10,
            "marginRight": 10,
            "marginTop": 5,
            "paddingRight": 25
          }
        },
        "meta": {
          "name": "TR1_MavVel"
        },
        "position": {
          "shrink": 0,
          "basis": "40px"
        },
        "custom": {},
        "propConfig": {
          "props.value": {
            "binding": {
              "config": {
                "bidirectional": true,
                "fallbackDelay": 2.5,
                "mode": "indirect",
                "references": {
                  "1": "{view.params.sorting}"
                },
                "tagPath": "[IG_SIS1C_SRT]IG/SIS1C/SRT/SRT0{1}/TUH/WF/WF_2_"
              },
              "type": "tag"
            }
          }
        }
      },

```

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [July 5, 2023, 11:30am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/9 "2023-07-05T11:30:08Z")

</div>

Set the `grow` property in the position section to 0.

---

<div class="post-metadata">

**Author:** ![tecnoeletronic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tecnoeletronic/32/50975_2.png) [@tecnoeletronic](https://forum.inductiveautomation.com/u/tecnoeletronic)\
**Post date:** [July 5, 2023, 11:30am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/10 "2023-07-05T11:30:21Z")

</div>

I added a bgcolor to containerStyle to show the real difference of size-position between unfocused-focused control.

no focus:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/5/d59afa6e9ad90f0ffb68d694c3ef1d40253c75e3.png)

focus:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/c/bc11774a669d4c8ee2dcab4d21d2e89730f66a14.png)

---

<div class="post-metadata">

**Author:** ![tecnoeletronic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tecnoeletronic/32/50975_2.png) [@tecnoeletronic](https://forum.inductiveautomation.com/u/tecnoeletronic)\
**Post date:** [July 5, 2023, 11:31am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/11 "2023-07-05T11:31:33Z")

</div>

> [@pascal.fragnoud](#):
>
> `grow`

Hi, is already set to 0.

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [July 5, 2023, 11:44am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/12 "2023-07-05T11:44:42Z")

</div>

I'll give it a look later when I have more time.

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [July 5, 2023, 10:38pm UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/13 "2023-07-05T22:38:17Z")

</div>

What are all of the paddings and margins used for? They seem a bit excessive. Will `style.gap: 5px` set on the flex container replace these?  
And maybe `style.margin: 10px` as well, after removing margin and padding from the individual flex components

---

<div class="post-metadata">

**Author:** ![tecnoeletronic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/tecnoeletronic/32/50975_2.png) [@tecnoeletronic](https://forum.inductiveautomation.com/u/tecnoeletronic)\
**Post date:** [July 6, 2023, 6:02am UTC](https://forum.inductiveautomation.com/t/perspective-numeric-entry-field-problems/75923/14 "2023-07-06T06:02:45Z")

</div>

> [@nminchin](#):
>
> style.margin: 10px

Wonderful!! after removing margin and padding from the individual flex components and using the "style.gap" on container the control doesn't change size and position when focused!

I that way i can keep enable the control's spin to avoid issue on data insert.