How to implement dynamic question loading?

Hello Bubble.is Community

So I am working on an application within the platform, and I am having a hard time wrapping my head around how I can implement dynamic question loading.
The system will go like this:

Request is sent to the page -> Page will fetch question number from the database and load the correct question up on screen -> user will answer the question -> IF correct it will give 10 coins to the users account : else it asks them to try it again -> Loads the next question = repeats until 100 questions have been answered.

The issue I am currently figuring out is how I can check the question ID (from the user table), then fetch the correct question, hint and answer to be given then display it on the page from another database table for the user to continue with the puzzles.

Any help would be much appreciated, thank you.

-bump-

-bump-

So bumpy …

To solicit suggestions you’ll need to be more specific with your questions, and share more detail about database structure, how you are using the data, the context of your app, etc.

For example, is the user presented with multiple choice answers? If the answer is typed in, what methods will you use to compare to a set answer?

How will you stop users finding the answer by peeking at the page with developer tools, by running another browser window, or does it not matter?

For some more tips, search this forum for ‘quiz’

1 Like

Hello Mishav,

Thanks for the response, for our database structure, its simple -

We have a Table with an Answer(text), Clue(text), Question(text), Image(image) and a Question ID (number).

We then have the users table, that their current question will be stored in, along with coins they’ve earned, so they can safely leave the page and return to it later, having it query the same question that they left on.

The question is based on riddles, so there is only one answer. For them to have the ability to cheat, they’ll need to go into the database, whats impossible unless they have account access.

If you read this section:
Request is sent to the page -> Page will fetch question number from the database and load the correct question up on screen -> user will answer the question -> IF correct it will give 10 coins to the users account : else it asks them to try it again -> Loads the next question = repeats until 100 questions have been answered.

It will fetch the question ID that the user is on, then load the relevant question. When the user answers, it will compare the answer to that in the database, if they got it wrong, they’ll have to try again, else they’ll have the next question loaded on screen.

What I am asking, is how I can achieve this dynamic functionality, if possible on the platform.

Thank you,
Best Regards.

Hi @nsykes,

There would be more than 30 ways of implementing this, depending on your design decisions. That’s why I suggested searching the forum, other people have shared their approaches.

What have you tried and what are you stuck with?

Hello @mishav,

I am pretty much looking for one way to implement it, that’s the way described above, to just fetch the content from the database and then compare answers when one gets it.

The reason why I am stuck is that there doesn’t appear to be any variables we can init (to my knowledge) unlike in an actual programming language, otherwise this would be a breeze.

Thank you.

Try using custom states or group values for this. They are set by a workflow step, and can be retrieved in a dynamic expression. A custom state can hold a list or a single item. The item can be a text, number, or a database row (thing). It can have a default value for simple types, or can be set to a value on Page is loaded workflow.

I’ll detail some suggestions and point out where design decisions come in …

Can be a button click or anything else that triggers a page workflow.

Workflow step: display data in group (or repeating group to display more than one at a time): search table’s first item, constraint: Question ID is custom state’s value.
The group can have text and image elements to display the different fields.

Note that this step sends the entire database row to the browser, including the answer if its in the same row. If its important to not be easily hackable, keep the answer in a separate table, or set a privacy rule so that the answer isn’t viewable until some constraint.

An input element, or multiline input, or checkboxes or radiobuttons or slider. The next workflow can start when input’s value is changed, or with a submit button.

workflow: submit clicked and input’s value is group’s answer

workflow step: change a thing: current user, set coins: this user’s coins + 10

workflow step: change a thing: search for coin vault first item, set coins: this vault’s coins - 10

workflow step: set custom state to hold the next Question ID

workflow step: run the same steps to display the question, for example in a Custom Event, to avoid having duplicate steps.

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