Text field component text field set to 'Null'

From my understanding setting the ‘text’ property of a text field component to ‘None’ or a blank string ‘‘ should result in the text field displaying the placeholder property text.

self.props.text = None

This code results in the text value being set to the value “Null” as seen below. I have also included another instance of the text field below it displaying how the placeholder text should be appearing.

Am I doing something wrong?

I’d say that’s how it should work for nulls as well, but currently “empty” (as mentioned by the user manual) means an empty string

I get the same result if I use the following
self.props.text = ‘‘

or

self.props.text = ““
Setting it to None or an empty string both result in a ‘Null’ text value rather than an empty text box

can you show a screenshot of the component text prop?

this works for me (i.e. self.props.text = ''):

This is in a message handler that is triggered upon saving the input value.

image

Copy this component JSON into your View and see if it works for you. it’s just the JSON for a simple text field component. Toggle the “key” bool and will send a p.msg “bob” with a handler that sets the text to an empty string and then the placeholder appears

image

[
  {
    "type": "ia.input.text-field",
    "version": 0,
    "props": {
      "text": "You'll never catch me!",
      "placeholder": "Peek-a-boo!"
    },
    "meta": {
      "name": "TextField"
    },
    "position": {
      "basis": "32px"
    },
    "custom": {
      "key": false
    },
    "propConfig": {
      "custom.key": {
        "onChange": {
          "script": "\tsystem.perspective.sendMessage('bob')",
          "enabled": null
        }
      }
    },
    "scripts": {
      "customMethods": [],
      "messageHandlers": [
        {
          "messageType": "bob",
          "script": "\tself.props.text = ''",
          "sessionScope": false,
          "pageScope": true,
          "viewScope": false
        }
      ],
      "extensionFunctions": null
    }
  }
]

Edit: what component is that message handler code defined on?

Thanks for your help, I have resolved it. There was a change script I wasn’t aware of that was setting the value to ‘None’ in the case that it was set to an empty string which was causing the issue.
Setting self.props.text = ‘‘ will result in an empty box, self.props.text = None will result in the text ‘Null’
Thanks again

1 Like