How to Create Autocomplete and Click the User to View Profile

Hello,

I would like to do a search for user profiles and be able to click the user and view their profile.
I’m not sure how to get the autocomplete started, any help would be greatly appreciated!

For example, typing “s” in the search bar and it show users with the username starting with “s”. Then the user would be able to select the username and view their profile information.

Thanks!

Hey! So here’s a quick overview to get you started:

  1. Make sure you have a Userame field (type text) for your User data type.
  2. Add a search box element > Choices Style = Dynamic > Define List = User > Field To Search = Username
    This search box will create the auto-complete search.
  3. On your profile page set the Type of Content = User
  4. Create a workflow: When Input Value is Changed (select the search input) > Navigation = Go to Page (your profile page) > Send Data = This input’s value

So in English: Type in the search bar and it will autocomplete with any users whose username field matches what is being typed in. When a user is selected from the dropdown, it will navigate to the profile page and populate it with the data of the selected user.



Hope this helps!


Gaby | Coaching Bubble

3 Likes

Thank you for the quick response! I’ll give it a try now and let you know if I have any issues :slight_smile:

Okay so I have the autocomplete set up, now I’m trying to figure out how to show the searched user’s information.

Currently, when you go to the page it just shows the current user’s information in dynamic form.
How do I switch it to show the searched users information and by default show the current user’s info?

This is how it’s set up now:

1 Like

Option 1

  1. Make sure your page type = user.
  2. Change all those fields from current user to “Current Page User’s [field]”
  3. Wherever you’re navigating to this page FROM, send the data of the current user.

If this is your start page, then you’ll need to tell the page to load the current user somehow…

Workflow for input: When input changes > navigate to the same page and send input’s value
Workflow for default: When page is loaded > navigate to the same page and send current user

Option 2

Set a Custom State on the page: When page is loaded > Set custom state on the page (this is an element action, and make the state type = user) > state = current user

When Input changes > change state to input’s value

All fields would then be “Page’s custom state (whatever you called it)'s [field]” Instead of Current Page User’s [field]

This option doesn’t require the page to have a data type because all the user info is being pulled from your custom state’s value, which is pulled from the input value (or the page load workflow for current user)

Does that make sense?


Gaby | Coaching Bubble

1 Like

I got it working, all I had to do was change to “Current Page User’s [field]”

Thank you for the help and quick responses!

2 Likes