I am new to Adapt framework. I need to have a branch selection page where two buttons will be there. Learners need to select one button (branch) and then a confirmation popup will appear with Yes/No. 'No' will close the popup and then both the buttons will be reset to original state. By clicking 'Yes', navigation will go to the concerned branch page as already selected.
How can I achieve this? Thanks for help.
Hi Mihir
That's quite a big question to ask!
Before we can help you, it would be helpful to know if you are familiar with the technology stack used by Adapt...?
Also, you say 'two buttons will be there' but you only mention what one of them does when clicked...
Hi Matt,
I have already gone through the technology stack of Adapt and am already using a little bit - though not extensibly.
Two buttons have the same behavior - only the text in the popup will change. Example: Click 'Button 1' and the popup says "You have selected Branch 1. If you want to proceed, click Yes, else click No and then select another Branch.". Same happen when Button 2 is selected. The popup will now say "You have selected Branch 2. If you want to proceed, click Yes, else click No and then select another Branch.". And clicking 'Yes' in both the popup will navigate to the respective branch.
There can be an alternative - MCQ type selection. I have attached a screenshot (Path_Selection.jpg) of the alternative requirement. If this can be doable, then also great.
Thanks,
Mihir
Where (and how) in the course is this going to appear?
You can use the Notify functionality of Adapt to present a yes/no dialogue to the user.
For an example of this, see the pageIncompletePrompt plugin.
To navigate to any other part of the course, see the following code:
var idToNavigateTo = "co-05";
Backbone.history.navigate("#/id/" + idToNavigateTo, { trigger:true, "replace": false });This will be there in the first screen when the course is opened. And then depending on the branch selected, corresponding pages will appear. This is basically an initial branching for two types of learners - experienced learners can jump directly to one page of reading material and then the assessment and new learners need to go through various modules and then can take the assessment.
Well in that case it'll probably help to know that you can use the _isAvailable property to set a particular page as being available to the learner or not.
Naturally, it's set to true by default so you just need to set it to false for any page you don't want to be available to the learner.
For example, to make a page with id co-05 'unavailable':
Adapt.findById('co-05').set('_isAvailable', false);
Hope this helps