Forum Discussion

rashihonrao's avatar
rashihonrao
Community Member
29 days ago

HTML Coding in RISE

Hi, I have pasted my HTML quiz code in my sample RISE course but when I add the 'complete block directly above' continue block, it doesnot work even when someone has given the wrong answer to the HTML quiz. I have added the window.parent.postMessage({ type: 'complete'}, '*') code and also set the completion requirements toggle on. 

 

The code is :

<!DOCTYPE html> <html lang="en-GB"> <head> <meta charset="UTF-8"> <title>Early Warning Signs Scenario Quiz</title> <style> body { font-family: Arial, sans-serif; margin: 2em; } .scenario { margin-bottom: 2em; } .question { font-weight: bold; } .options label { display: block; margin-bottom: 0.5em; } .feedback { color: green; margin-top: 1em; display: none; } button { margin-top: 1em; } </style> </head> <body> <h1>Early Warning Signs Scenario Quiz</h1> <div class="scenario" id="scenario1"> <div class="question"> A client’s debtor days have increased from 60 to 120+ over the past year. The client says, “Don’t worry, we’ll collect soon.”<br> What should you do? </div> <form> <div class="options"> <label><input type="radio" name="q1" value="A"> Accept the explanation and do nothing</label> <label><input type="radio" name="q1" value="B"> Ask for a detailed ageing report and discuss collection strategies</label> <label><input type="radio" name="q1" value="C"> Increase their credit limit</label> <label><input type="radio" name="q1" value="D"> Ignore it until next review</label> </div> <button type="button" onclick="showFeedback()">Submit</button> <div class="feedback" id="feedback1"> <strong>Correct!</strong> The best action is to ask for a detailed ageing report and discuss collection strategies. </div> <div class="feedback" id="feedback1-wrong" style="color: red;"> <strong>Not quite.</strong> The best action is to ask for a detailed ageing report and discuss collection strategies. </div> </form> </div> <!-- You can duplicate the .scenario block above for each additional scenario --> <script> function showFeedback() { var radios = document.getElementsByName('q1'); var selected = ''; for (var i = 0; i < radios.length; i++) { if (radios[i].checked) { selected = radios[i].value; } } document.getElementById('feedback1').style.display = 'none'; document.getElementById('feedback1-wrong').style.display = 'none'; if (selected === 'B') { document.getElementById('feedback1').style.display = 'block'; } else if (selected) { document.getElementById('feedback1-wrong').style.display = 'block'; } } </script> </body> </html>

e-learning development

2 Replies

  • Noele_Flowers's avatar
    Noele_Flowers
    Staff
    29 days ago

    Hey rashihonrao​ — wondering if you'll get more luck posting this question in the Code Block Group? Our team doesn't troubleshoot custom code directly, but if you post in there you may be more easily connected to other members who are comfortable implementing HTML in Rise and therefore might be the right people to help you get this resolved. Let me know if this helps!

    • rashihonrao's avatar
      rashihonrao
      Community Member
      28 days ago

      Thanks Noele. I have posted in the Code Block Group. Hopefully I can get some help.