I’ve always been a little confused with the role of a placeholder verses initial content?
My issue is that I want the form field text to initially show “Add name for your reference” but then when a user clicks in the form field that text should disappear so that they can add custom text. However, nothing is showing at all initially in my form field, it is blank using the settings below?
Hi there, @darren.james7518… the placeholder is what appears in an element in the app and in the editor when there is no initial content set for that element. However, as soon as you put an expression in the initial content field, that expression will always show up in the editor. In your app, the placeholder will appear when there is nothing to show for the initial content (i.e., in your case, when the parent group does not have an associated invoice). Make sense?
Hope this helps.
Best…
Mike
In your app, the placeholder will appear when there is nothing to show for the initial content (i.e., in your case, when the parent group does not have an associated invoice).
I’m not sure but I believe that when the initial value is empty, nothing is shown (including the placeholder).
So to get the behavior you want @darren.james7518, you want to add a conditional. → ‘When parent’s group Invoice Name is not empty’ then set the initial value.
So in the appearance tab, you do not set the initial value.
Thanks Mike, I still think they perform identical roles. If the placeholder appears when there is no initial content, and the initial content appears when there is no placeholder … why not just have one of them?
Aside from this, can you see how I would achieve what I need? If I leave the initial content empty, then I think the form field will show “Add name for your reference", which is good. But if a user later returns to that page it won’t remember their saved data.
I tried only showing the ‘initial content’ (which would show saved data) and having a condition saying that if empty then show “Add name for your reference” but there is no conditional to show when the ‘initial content’ is empty.
Are you talking about what appears in the editor or in your app? Those two fields definitely have different functions, with the placeholder usually being some sort of label or instructive text (just like your example of “Add a name for your reference”), and the initial content being a default value you want to display when a user has already entered data for the associated thing.
The placeholder and initial content are two completely different things…
As @mikeloc pointed out, think of the placeholder as an instruction for the user, like “Please Type your Name Here…” or “Enter Your Phone Number…”.
And the initial content is a way to preload the input with data already in the database (or elsewhere).
To address your question, what you’re currently doing should work…
If the initial content is empty the placeholder should still show…
So if you’re sure (and you literally mean) that your input is blank when you preview your app, then there are only a couple of things I can think of to check…
So I’d check both of those things first, but other that that it should work as you’re intending it to, so I’m not sure what’s going on otherwise…
I see, thanks guys.
It’s definitely grey
See image below
Oh wait, it can’t show the initial content (Customers name) because the User hasn’t selected the Customer when they arrive at this page. That must be where the issue is somehow?
That is strange…
I can’t see why that should be an issue, as i said if the initial content is empty then the placeholder should be shown…
Have you checked in the debugger to see what’s going on for the input element?
I haven’t checked the debugger but I just switched the placeholder and initial content around and it works much better.
The only thing is that the form field text “Add name for your reference” doesn’t disappear when you click inside the field, you have to manually delete it to add custom text.
I realise my solution isn’t entirely correct. Here’s what I am actually trying to achieve;
This was the key to making it work … thank you for taking the time to help.
When a user clicks inside a form field, the placeholder remains showing until you start typing. Is this the typical behaviour for form fields? I wasn’t sure if the placeholder should immediately disappear when a user clicks inside a form field.
Yes, that is the expected behavior. If you want the placeholder to disappear when a user clicks in a field, add a conditional to the element that blanks out the placeholder when the input is focused.
Ok, thanks again.
