Symbols * instead of letters in input placeholder

Hello. I am trying to make a word learning app. This seems like a difficult question, but I really hope that someone can help me:

One of the pages is a test in which the user must enter the English translation of the suggested word in the input field. For example: for the suggested word “сrier” (in French), he should enter “shout”. The problem is that the user can type “cry” and in fact it will be correct. But when checking, the application will give the answer “wrong” because in the database the word “shout” corresponds to the translation “сrier”. To avoid this, I want to place symbols * in the placeholder, the number of which would correspond to the number of letters in the correct answer. In our example, this should be five characters *. Further (ideally), when the user types the first letter, the rest of the * characters should not disappear completely, but only decrease by 1. And so on.

Way 1 I am trying to solve the first part of this task. The problem is that in this case, the required number of but random characters is generated in the input (and I only need one - *)

Way 2 - use “:find and replace”. In this case, I only get one character *.


Perhaps this is the right way but not the correct dynamic data parameters.

Hi there, @sixthtulip… if I understand your post correctly, I am all but certain it won’t be possible to have a placeholder that stays visible and subtracts a character while the user types in the input, and even if it was possible, I think that would be a pretty weird user experience.

The above being said, could you consider having the placeholder be something like, “Hint: the answer has 5 letters.” It would be easy to implement that placeholder (with the 5 being dynamic, of course), and I think it would make for a better/clearer user experience.

Anyway, just food for thought there, and I hope it helps.

Best…
Mike

Yes, I thought about placing an inscription instead of * - A word of * letters, where instead of an asterisk there would be a number corresponding to the number of letters in a given word. I have an idea how to do it.
But I saw an application where what I wrote about above is implemented. although of course this application is hardly made in Bubble:

Yes, most likely it is impossible to make the asterisks in the placeholder be removed one at a time (as the user writes the word). But it seems to me quite possible to implement the first part of the task - to display as many asterisks as there are letters in the desired word.

It looks like in my Way 2 the program takes the whole word as one character and changes it to an asterisk. I tried using the ‘:split by’ operator. In this case, in the “Text to search” window, for some reason, I can enter only one letter:
04
and it will be replaced with an asterisk:
05
When I type multiple letters of a word, the letters in the word don’t change to asterisks. It seems to me that something is missing in my dynamic data for this to work as I would like. What do you think?

Do a simple find and replace, check the Use a regex pattern checkbox, find something like [a-zA-Z] (or whatever pattern best suits your needs), and replace with an asterisk.

Thank you very much, this is really what I was missing! Another solution to the problem that I thought about before your super answer is to create an additional field in the database of words containing asterisks in an amount equal to the number of letters in the word. But this would complicate the process of adding words to the database. Thanks again!

1 Like

The only point - if the input contains a phrase, then the asterisks are separated by a comma, although the :separate by argument in parentheses ( ) contains a space. There are no commas in the database either. Where did the comma come from?
00

I’m not sure what :separate is, but if you are still using the :split by operator, well, don’t (that’s what I meant by a simple find and replace). Just do Parent group's Word's Definition-2RU:find & replace.

1 Like

Yes, I meant :split by
Now I removed it and the comma is gone. It looks like I misunderstood the meaning of this operator. Thank you!

1 Like

Hi again. In the course of work there was a need for a small change.
Please tell me how you can change / supplement this expression so that all letters except the first are replaced with asterisks.

Try this regex in your find and replace.

(?<=(.){1})[a-zA-Z]

1 Like

Thank you!

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.