i have a text input widget that has a default variable value of “enter your name here”
however i noticed that when i run the app on a tablet, i have to click on the box, then manually clear the default value. (i need the default value as the variable is used to filter a list of names i want to hide until the user is entered)
is there a way to auto highlight the text in the text input widget when its selected so all the user needs to do is either hit the backspace once or start typing something and the default value clears?
There exists (yet) no trigger for “on input field enter” events.
But you can use the custom widget “change dectector” to recog if the default value was changed.
when changing something inside the input field, the widget changes the background color
When you always set a boole’sche variable like b_unsername_set to “True”, you can use this for controling the leave of the step
I had similar thoughts…
You could also make the Inpt slightly transparent and make a text behind the input.
When the change detector fires, the color of the text in background, can be changed to transparent, as lonbg as the length is > 0
@knowlec There is no way to achieve this in TULIP yet.
The Change detector can be used to delete the placeholder text instead. I think that is the reason why you want to higlight the text (to automatically get overwritten).
Or you use the change detector to change the textcolor of a placeholter text which is not in the input but behind it. Then it would disappear in the moment you pot text in the input…
I quickly set up an example… is that close to your target?
or, if you use the default text, you can clear the variable when changing the default text by typing the first key. But it’s a little bit tricky to handle the input, because the change detection triggers by any changes.
could you perhaps share how the custom widget was built and i can try those triggers.
A possible simple workaround that ive come up with was just to create another dummy variable that is changed once the enter key is pressed in the text input:
The trigger is as shown above. With the Boole’sche variables it clears the input field with the first input (key or backspace or any other else) and stores the information that the default text was changed by switching the Boole’sche variable- Otherwise the trigger will clear for every typing key the input again
You could just trim this specific text. However I find this a bit more tricky, since there are several issues you can run into:
Curser is at the end or where ever you clicked and not where you really want to type. → behaviour is not intuitive
Checking for this text variable has always to be against the placeholder text and can never be chacked against empty
the way you set up the trigger the first letter gets also deleted and must be typed in twice
If you fix the point before you get another issue: If the Cursor is placed in the middle it gets hard to separate the original and the input text.
All in all it can result in unwanted values in this text variable. Thats why I tryed to find a solution with no overlap or influence on the actual value.
sorry i meant the custom widget in settings setup. Im not that proficient in html/CSS/JavaScript
i tried your trigger using the “Custom input text” widget that is provided in the tulip library app, needless to say it did not work as yours did.
im a bit confused by your solution, does this just change the background color?
im looking for the solution to change a variable input as the variable input is a filter in my interactive table
The issue here is that my interactive table is a list of all users which i want filtered by the text input. As i don’t want a list of all users showing by default, i created a default with a default value “your name here” so that there would only be records shown once the user starts typing in the text input… as there is no user with the name “your name here” the table will be blank by default.
this is why i believe this solution does need to influence the actual value as the actual value is what is filtering my interactive table. (unless i use a dummy variable as shown earlier)
was just seeing was there a cleaner way to do with with less manually clearing of the value…
Then you can add a Filter_Text variable and overhand the input_text to it. If its empty you set Filter_Text = “##__xx??” or a random string thats not likely to be a name. This can also happen in the change detector at the same time.
The solution to actually manipulate the input string by change detection is possible but tricky with many pitfalls.
But in your gif you hit space to clear the value and then start typing.
If you just start typing, the first letter will be missing.
What is the benefit of this solution?
Changing the BG Color is also possible with other solutions but was not the actual issue.