Perspective Odd dateTimeInput Behavior

Ignition
1

Ignition 8.1.0

Under certain situations two dateTimeInputs on the same view will appear very differently when opened.

image
image1280Ă—1008 26.2 KB

image
image840Ă—1058 29.6 KB

Following is a very simple view that demonstrates the issue.

{
  "custom": {},
  "params": {},
  "props": {},
  "root": {
    "children": [
      {
        "children": [
          {
            "children": [
              {
                "meta": {
                  "name": "DateTimeInput"
                },
                "position": {
                  "basis": "170px"
                },
                "type": "ia.input.date-time-input"
              },
              {
                "meta": {
                  "name": "DateTimeInput_0"
                },
                "position": {
                  "basis": "170px"
                },
                "type": "ia.input.date-time-input"
              }
            ],
            "meta": {
              "name": "FlexContainer"
            },
            "position": {
              "basis": "400px"
            },
            "type": "ia.container.flex"
          }
        ],
        "meta": {
          "name": "FlexContainer_0"
        },
        "position": {
          "basis": "200px"
        },
        "type": "ia.container.flex"
      }
    ],
    "meta": {
      "name": "root"
    },
    "props": {
      "direction": "column"
    },
    "type": "ia.container.flex"
  }
}

I found that adding another input (like a checkbox) on the far left, before the first date picker, resolves the issue.

2

The DateTime Input requires a certain amount of space to open and display the picker piece. If the component does not have the required amount of space, it opens in “modal” mode, during which it displays in the center of the screen and is surrounded by an overlay which obscures the rest of the screen. This is intended behavior.

If I remember correctly it first looks below the component, then above. If the component is near enough the side of the view, then the component will not be able to open, which is what appears to be happening here. Your introduction of the checkbox moved the DateTime Input away from the left border of the viewport, which gave the DateTime Input enough space to open.

1 Like