Clickable text with an input appearing when clicked

[m.lewis]

Hi Everyone,

I am looking at the idea of a clickable text that presents an input for the user to complete when clicked.

Imagine the app displays the following text

“Our band is looking for someone who can play the piano and sing”

“play the piano” and “sing” would be clickable and when clicked it would produce an input where the user could type something along the lines of “I am available to play the piano”. When the user clicks again the input box disappears, the skill of playing the piano is added to his profile, his availability is also added to his profile.

Is this possible on bubble, has anyone looked at something similar?

[dan1]

To clarify, you want to have multiple inputs nested within a sentence? (Akin to clicking a hashtag that has some sort of effect?)

I don’t have a solution off hand, but think it’s a nice challenge. Curious to see if anyone else has a viable approach? (Maybe using the @ mentions plugin developed by AirDev?)

[m.lewis]

Hi Dan,

I can always rely on you for a response!

It is difficult to articulate especially because I cant think of any real world examples that would help explain.

I have drafted up a quick example of what I am thinking but for some reason it is not allowing me to paste screenshots from the clipboard into this response. (weird as Ive just pasted into a word doc and it worked fine)

So the user reads the text ad

“Our band needs someone that plays the piano and can sing”

The clickable attributes are “play the piano” and “sing”.

The user is able to click the attributes and input some information regarding that attribute eg. “I have 6 years experience playing the piano”

This information is then added to the users profile as a skill.

(I will see if there is another way to upload the pic now)

[m.lewis]

User reads add:

User sees two clickable attributes and clicks the first, input box appears:

User is able to input info regarding that attribute and add a competency level, user clicks again and input box disappears, this skill and competency level is then added to users profile.

[dan1]

I can always rely on you for a response!

Well, you’ve asked a whole lot of interesting questions

Do you know of any websites that have that function as a feature? Medium has a similar concept, which is based around highlighting (parts of) sentences. But not sure of any others that do so dynamically. (If it was static, it would be easy to just drop a pseudo input at the end of a line that triggered an action that shows a contextual group focus).

I recommend playing around with the Tagger plugin I’d mentioned above to see if it’s possible with that.

Tagger Plugin for Bubble

[m.lewis]

I know this is likely a simple one but ive spent an hour on it now and thought id call in reinforcements.

Here’s the add:

User clicks “play the piano” and the input appears.

User fills in input.

User clicks away and skill is added. (Data type: “Attribute”, Field: “Skill” - List of text)

Workflow looks like this:

The Skills are being added as I can see them in my app data.

The question is why cant I get them to display in a list (see empty list):

This isn’t really part of the original problem but is causing a roadblock to a potential solution.

Hope you can help!

[m.lewis]

FYI this is the data call set up:

[andrew_bpco]

You’re creating a skill and adding attributes to it. In the repeating group, you need to reference the skill somehow. The way you’re doing it now means you need to say, “Skill is equal to this skill I created earlier.” The red box is Bubble’s way of telling you, “You need to specify which skill I should be looking for.”

[m.lewis]

Hi Andrew,

I have tried the options, the most obvious being the set up outlined below:

Still nothing…

[andrew_bpco]

Are you saving a Skill to the current user? I don’t think I see that step in an earlier image you shared. You create a skill > add result of step 1 to user in the workflow. THEN you can reference “current user’s skill.”