How would you go about building a Net Promoter Score Style input system

I’ve been scratching my head trying to figure this out… Any advice on how you’d implement something like this?

image

Thanks

Dom

Slider should work as a native element.

Otherwise a list of numbers from the Toolbox Plugin and a Repeating Group.

If one is going to do this a lot you could also create a data type called “Rating List” or similar. It should be like this:

Then use App Data tab to create just one of these things like this:

Now you have a thing in the database that always has this handy list of integers 1 through 10. (Note: there should always only be one of these objects. You’re making a system-level variable here, essentially.)

Then, to use this thing, just do a search for it. Since there’s only ever one you can take :first item and don’t need to worry about sorting. So here’s an RG where we use that as the source:

(That text element just displays “Current cell’s number” - we could also use “Current cell’s index” as they are the same values in this scenario.)

In run mode:

And geez, this is so easy, let’s just finish the whole thing:

Take that text and right-click it. Choose “Group elements in a group”. This’ll give us a group we can expand to act the “selector” for the cell. We’ll use that as the thing to catch user clicks. Group is like this:

And that text is like this (note “this element is not clickable”. That’s important. We don’t want the text to intercept clicks, only the group:

Now let’s put a click action on the Group Rating Selector. Click Start/Edit workflow on that group. What we’ll do is when clicked we will store that group’s number in a custom state on the RG. We’ll call it Selected. The action is Element > Set State. You can interactively define this new state in the dialog box:

Now let’s style up that Group a bit back in Design mode. We’ll use conditions to set a hover state and also light up the group in a different color if that is the cell that has been clicked (and thus its value is stored in RG’s Selected state):

Here’s how that looks in run mode: The user is hovering cell 3 and has previously clicked cell 7 (the number 7 is stored in the RG’s custom state called “Selected”, see?)…

Done!

Now you can do whatever you want with the RG’s Selected value. In my case, I’ll just display it in a text. But obviously you could have the Group’s click workflow write that value into some thing in the database or whatever you need. Here’s an idea:

In run mode it starts like this:

And then you click “10”, because this is a freaking awesome forum reply:

7 Likes

Would I just “hide” the numbers if I don’t want them to show? Originally I had put icons to act as the clickable objects set as little circles. I want to sum up the results to apply to an algorithm. It just needs to be a repeating group right?
20%20AM

Gabby JUST posted a video doing the exact thing Im attempting to do. I think its VIP access (membership eyes only), but if you stumbled onto this thread you can check out her video here. Very much worth the monthly subscription.

Cheers!

I was literally looking for this exact system as I am building a project based learning g platform. Kudos for the detailed walk through!

JB

1 Like

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