Adding Dynamic Text to a Placeholder

Wappler General How To
#1

Wappler Version : 2.4.5
Operating System : Windows 10

Situation

I am developing a multi-lingual app, so all my app’s text is in the database. I access each segment of text with the form {{apptext.value.number}}, e.g. {{apptext.value.230}} This works perfectly well for the content of the normal html tags such as p, button, label etc.

Expected behavior

I expect that I should also be able to use this format to specify the placeholder of an input, so to be able to say <input type="text" ... placeholder="{{apptext.value.232}}">

Actual behavior

The dynamic value is not accessed and instead I just see {{apptext.value.232}} in the input.

How to reproduce

Create any text variable and try it out.

#2

In Wappler, you can make any attribute dynamic by adding dmx-bind: in front of it.
In your case:

dmx-bind:placeholder="apptext.value.232"

{{ and }} are not used inside dynamic attributes.

#3

In addition to what @Teodor mentioned, you can use the UI for this:

image
image745×215 18 KB

(this option was only added quite recently)

2 Likes
#4

That’s right :slight_smile: I forgot we have it there.

#5

Thank you to the ever rapid, friendly and supportive Wappler team! :rocket: :

Interesting to note that the curly bracket work inside of the dmx-bind too…

So this works:

dmx-bind:placeholder="apptext.value.232"

and so does this:

dmx-bind:placeholder="{{apptext.value.232}}"

without the {{ }} appearing in the app.

I guess I am best to use dmx-bind:placeholder="apptext.value.232" as it is more likely to be supported long term…?

Best wishes,
Antony.

#6

Yes, that’s right - that’s how you are supposed to use dynamic data in dynamic attributes :slight_smile: