Feat: Add support for Ordering questions

This commit is contained in:
2026-04-12 12:57:42 +02:00
parent 1e44cf4129
commit a3e828a00e
10 changed files with 1238 additions and 143 deletions
+296 -138
View File
@@ -1,153 +1,311 @@
<div id="question-124-10" class="que calculatedsimple interactive notyetanswered">
<div class="info">
<h3 class="no">Question <span class="qno">9</span></h3>
<div class="state">Tries remaining: 3</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775934842056_72"><input type="hidden"
name="q124:10_:flagged" value="0"><input type="hidden"
value="qaid=801&amp;qubaid=124&amp;qid=1621&amp;slot=10&amp;checksum=7baed22ee2b738ef71503b27cd982b7d&amp;sesskey=iGNCxptJmv&amp;newstate="
class="questionflagpostdata">
<input type="hidden" class="questionflagvalue" id="q124:10_:flaggedcheckbox" name="q124:10_:flagged"
value="0"><a tabindex="0" class="aabtn" role="button" aria-pressed="false" aria-label="Flagged"
title="Flag this question for future reference"><img class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775930536/i/unflagged" alt="">Flag
question</a>
</div>
<div class="editquestion"><a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-10&amp;id=1621"><i
class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i>Edit
question</a></div><span class="badge bg-primary text-light">v1 (latest)</span>
<div class="info">
<h3 class="no">Question <span class="qno">9</span></h3>
<div class="state">Tries remaining: 3</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775934842056_72">
<input type="hidden" name="q124:10_:flagged" value="0" /><input
type="hidden"
value="qaid=801&amp;qubaid=124&amp;qid=1621&amp;slot=10&amp;checksum=7baed22ee2b738ef71503b27cd982b7d&amp;sesskey=iGNCxptJmv&amp;newstate="
class="questionflagpostdata"
/>
<input
type="hidden"
class="questionflagvalue"
id="q124:10_:flaggedcheckbox"
name="q124:10_:flagged"
value="0"
/><a
tabindex="0"
class="aabtn"
role="button"
aria-pressed="false"
aria-label="Flagged"
title="Flag this question for future reference"
><img
class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775930536/i/unflagged"
alt=""
/>Flag question</a
>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4><input type="hidden" name="q124:10_:sequencecheck" value="1">
<div class="qtext" style="cursor: pointer;">
<div class="clearfix">
<p>This is an example of a simple calculated question. It's similar to the calculated question but
with fewer settings <img class="icon emoticon" alt="smile" title="smile"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775930536/s/smiley"></p>
<p>You won a cool Moodle cooler box at a Moodle Moot and wonder how much it will hold. What is the
volume of your cooler box if its height is 6.4 its length is 9.9 and its width is 7.0?</p>
</div>
</div>
<div class="ablock d-flex flex-wrap align-items-center"><label for="q124:10_answer">Answer: <span
class="visually-hidden">Question 9</span></label><span class="answer"><input type="text"
name="q124:10_answer" id="q124:10_answer" size="30" class="form-control d-inline"></span></div>
<div class="im-controls"><button type="submit" id="q124:10_-submit" name="q124:10_-submit" value="1"
class="submit btn btn-secondary" data-savescrollposition="true">Check <span
class="visually-hidden">Question 9</span></button></div>
</div>
<div class="editquestion">
<a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-10&amp;id=1621"
><i class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i
>Edit question</a
>
</div>
<span class="badge bg-primary text-light">v1 (latest)</span>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4>
<input type="hidden" name="q124:10_:sequencecheck" value="1" />
<div class="qtext" style="cursor: pointer">
<div class="clearfix">
<p>
This is an example of a simple calculated question. It's similar to the calculated
question but with fewer settings
<img
class="icon emoticon"
alt="smile"
title="smile"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775930536/s/smiley"
/>
</p>
<p>
You won a cool Moodle cooler box at a Moodle Moot and wonder how much it will hold. What
is the volume of your cooler box if its height is 6.4 its length is 9.9 and its width is
7.0?
</p>
</div>
</div>
<div class="ablock d-flex flex-wrap align-items-center">
<label for="q124:10_answer">Answer: <span class="visually-hidden">Question 9</span></label
><span class="answer"
><input
type="text"
name="q124:10_answer"
id="q124:10_answer"
size="30"
class="form-control d-inline"
/></span>
</div>
<div class="im-controls">
<button
type="submit"
id="q124:10_-submit"
name="q124:10_-submit"
value="1"
class="submit btn btn-secondary"
data-savescrollposition="true"
>
Check <span class="visually-hidden">Question 9</span>
</button>
</div>
</div>
</div>
</div>
<div id="question-124-9" class="que calculatedmulti interactive notyetanswered">
<div class="info">
<h3 class="no">Question <span class="qno">8</span></h3>
<div class="state">Tries remaining: 3</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775934842056_66"><input type="hidden"
name="q124:9_:flagged" value="0"><input type="hidden"
value="qaid=800&amp;qubaid=124&amp;qid=1620&amp;slot=9&amp;checksum=6f196762f980a0b2c9f887ed255c8a24&amp;sesskey=iGNCxptJmv&amp;newstate="
class="questionflagpostdata">
<input type="hidden" class="questionflagvalue" id="q124:9_:flaggedcheckbox" name="q124:9_:flagged"
value="0"><a tabindex="0" class="aabtn" role="button" aria-pressed="false" aria-label="Flagged"
title="Flag this question for future reference"><img class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775930536/i/unflagged" alt="">Flag
question</a>
</div>
<div class="editquestion"><a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-9&amp;id=1620"><i
class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i>Edit
question</a></div><span class="badge bg-primary text-light">v2 (latest)</span>
<div class="info">
<h3 class="no">Question <span class="qno">8</span></h3>
<div class="state">Tries remaining: 3</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775934842056_66">
<input type="hidden" name="q124:9_:flagged" value="0" /><input
type="hidden"
value="qaid=800&amp;qubaid=124&amp;qid=1620&amp;slot=9&amp;checksum=6f196762f980a0b2c9f887ed255c8a24&amp;sesskey=iGNCxptJmv&amp;newstate="
class="questionflagpostdata"
/>
<input
type="hidden"
class="questionflagvalue"
id="q124:9_:flaggedcheckbox"
name="q124:9_:flagged"
value="0"
/><a
tabindex="0"
class="aabtn"
role="button"
aria-pressed="false"
aria-label="Flagged"
title="Flag this question for future reference"
><img
class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775930536/i/unflagged"
alt=""
/>Flag question</a
>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4><input type="hidden" name="q124:9_:sequencecheck" value="1">
<div class="qtext" style="cursor: pointer;">
<div class="clearfix">
<p>This is an example of a calculated multi-choice question. It is like the calculated question in
that the numbers used may vary with each student and question, but the equation remains the same
but it is different from the calculated question in that there is a choice of answers available.
</p>
<p>You are making a banner for your organisation's Moodle User Group meeting. Its length is 14 and
its height is 8 What is its area?</p>
<p>&nbsp;</p>
</div>
<div class="editquestion">
<a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-9&amp;id=1620"
><i class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i
>Edit question</a
>
</div>
<span class="badge bg-primary text-light">v2 (latest)</span>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4>
<input type="hidden" name="q124:9_:sequencecheck" value="1" />
<div class="qtext" style="cursor: pointer">
<div class="clearfix">
<p>
This is an example of a calculated multi-choice question. It is like the calculated
question in that the numbers used may vary with each student and question, but the
equation remains the same but it is different from the calculated question in that there
is a choice of answers available.
</p>
<p>
You are making a banner for your organisation's Moodle User Group meeting. Its length is
14 and its height is 8 What is its area?
</p>
<p>&nbsp;</p>
</div>
</div>
<fieldset class="ablock no-overflow visual-scroll-x">
<legend class="prompt h6 fw-normal visually-hidden">
<span class="visually-hidden">Question 8</span> Answer
</legend>
<div class="answer">
<div class="r0">
<input
type="radio"
name="q124:9_answer"
value="0"
id="q124:9_answer0"
aria-labelledby="q124:9_answer0_label"
/>
<div class="d-flex w-auto" id="q124:9_answer0_label" data-region="answer-label">
<div class="flex-fill ms-1">6</div>
</div>
<fieldset class="ablock no-overflow visual-scroll-x">
<legend class="prompt h6 fw-normal visually-hidden"><span class="visually-hidden">Question 8</span>
Answer</legend>
<div class="answer">
<div class="r0"><input type="radio" name="q124:9_answer" value="0" id="q124:9_answer0"
aria-labelledby="q124:9_answer0_label">
<div class="d-flex w-auto" id="q124:9_answer0_label" data-region="answer-label">
<div class="flex-fill ms-1">6</div>
</div>
</div>
<div class="r1"><input type="radio" name="q124:9_answer" value="1" id="q124:9_answer1"
aria-labelledby="q124:9_answer1_label">
<div class="d-flex w-auto" id="q124:9_answer1_label" data-region="answer-label">
<div class="flex-fill ms-1">112</div>
</div>
</div>
<div class="r0"><input type="radio" name="q124:9_answer" value="2" id="q124:9_answer2"
aria-labelledby="q124:9_answer2_label">
<div class="d-flex w-auto" id="q124:9_answer2_label" data-region="answer-label">
<div class="flex-fill ms-1">22</div>
</div>
</div>
</div>
<div id="q124:9_clearchoice" class="qtype_multichoice_clearchoice visually-hidden" aria-hidden="true">
<input type="radio" name="q124:9_answer" id="q124:9_answer-1" value="-1" class="visually-hidden"
aria-hidden="true" checked="checked"><label for="q124:9_answer-1"><a tabindex="-1" role="button"
class="btn btn-link ms-3 mt-n1" href="#">Clear my choice</a></label>
</div>
</fieldset>
<div class="im-controls"><button type="submit" id="q124:9_-submit" name="q124:9_-submit" value="1"
class="submit btn btn-secondary" data-savescrollposition="true">Check <span
class="visually-hidden">Question 8</span></button></div>
</div>
<div class="r1">
<input
type="radio"
name="q124:9_answer"
value="1"
id="q124:9_answer1"
aria-labelledby="q124:9_answer1_label"
/>
<div class="d-flex w-auto" id="q124:9_answer1_label" data-region="answer-label">
<div class="flex-fill ms-1">112</div>
</div>
</div>
<div class="r0">
<input
type="radio"
name="q124:9_answer"
value="2"
id="q124:9_answer2"
aria-labelledby="q124:9_answer2_label"
/>
<div class="d-flex w-auto" id="q124:9_answer2_label" data-region="answer-label">
<div class="flex-fill ms-1">22</div>
</div>
</div>
</div>
<div
id="q124:9_clearchoice"
class="qtype_multichoice_clearchoice visually-hidden"
aria-hidden="true"
>
<input
type="radio"
name="q124:9_answer"
id="q124:9_answer-1"
value="-1"
class="visually-hidden"
aria-hidden="true"
checked="checked"
/><label for="q124:9_answer-1"
><a tabindex="-1" role="button" class="btn btn-link ms-3 mt-n1" href="#"
>Clear my choice</a
></label
>
</div>
</fieldset>
<div class="im-controls">
<button
type="submit"
id="q124:9_-submit"
name="q124:9_-submit"
value="1"
class="submit btn btn-secondary"
data-savescrollposition="true"
>
Check <span class="visually-hidden">Question 8</span>
</button>
</div>
</div>
</div>
</div>
<div id="question-124-8" class="que calculated interactive notyetanswered">
<div class="info">
<h3 class="no">Question <span class="qno">7</span></h3>
<div class="state">Tries remaining: 2</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775934842056_60"><input type="hidden"
name="q124:8_:flagged" value="0"><input type="hidden"
value="qaid=799&amp;qubaid=124&amp;qid=1618&amp;slot=8&amp;checksum=b7d586e320edea342963eb06ad05faa0&amp;sesskey=iGNCxptJmv&amp;newstate="
class="questionflagpostdata">
<input type="hidden" class="questionflagvalue" id="q124:8_:flaggedcheckbox" name="q124:8_:flagged"
value="0"><a tabindex="0" class="aabtn" role="button" aria-pressed="false" aria-label="Flagged"
title="Flag this question for future reference"><img class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775930536/i/unflagged" alt="">Flag
question</a>
</div>
<div class="editquestion"><a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-8&amp;id=1618"><i
class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i>Edit
question</a></div><span class="badge bg-primary text-light">v1 (latest)</span>
<div class="info">
<h3 class="no">Question <span class="qno">7</span></h3>
<div class="state">Tries remaining: 2</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775934842056_60">
<input type="hidden" name="q124:8_:flagged" value="0" /><input
type="hidden"
value="qaid=799&amp;qubaid=124&amp;qid=1618&amp;slot=8&amp;checksum=b7d586e320edea342963eb06ad05faa0&amp;sesskey=iGNCxptJmv&amp;newstate="
class="questionflagpostdata"
/>
<input
type="hidden"
class="questionflagvalue"
id="q124:8_:flaggedcheckbox"
name="q124:8_:flagged"
value="0"
/><a
tabindex="0"
class="aabtn"
role="button"
aria-pressed="false"
aria-label="Flagged"
title="Flag this question for future reference"
><img
class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775930536/i/unflagged"
alt=""
/>Flag question</a
>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4><input type="hidden" name="q124:8_:sequencecheck" value="1">
<div class="qtext" style="cursor: pointer;">
<div class="clearfix">
<p>This is an example of a calculated question. The numbers will vary but the formula stays the
same.&nbsp;</p>
<p>You're doing some training in your organisation. In your group you have 3 complete beginners and
14 relatively experienced Moodle users. How many are there in your group in total?</p>
<p><span>&nbsp;</span></p>
</div>
</div>
<div class="ablock d-flex flex-wrap align-items-center"><label for="q124:8_answer">Answer: <span
class="visually-hidden">Question 7</span></label><span class="answer"><input type="text"
name="q124:8_answer" id="q124:8_answer" size="30" class="form-control d-inline"></span></div>
<div class="im-controls"><button type="submit" id="q124:8_-submit" name="q124:8_-submit" value="1"
class="submit btn btn-secondary" data-savescrollposition="true">Check <span
class="visually-hidden">Question 7</span></button></div>
</div>
<div class="editquestion">
<a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-8&amp;id=1618"
><i class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i
>Edit question</a
>
</div>
</div>
<span class="badge bg-primary text-light">v1 (latest)</span>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4>
<input type="hidden" name="q124:8_:sequencecheck" value="1" />
<div class="qtext" style="cursor: pointer">
<div class="clearfix">
<p>
This is an example of a calculated question. The numbers will vary but the formula stays
the same.&nbsp;
</p>
<p>
You're doing some training in your organisation. In your group you have 3 complete
beginners and 14 relatively experienced Moodle users. How many are there in your group
in total?
</p>
<p><span>&nbsp;</span></p>
</div>
</div>
<div class="ablock d-flex flex-wrap align-items-center">
<label for="q124:8_answer">Answer: <span class="visually-hidden">Question 7</span></label
><span class="answer"
><input
type="text"
name="q124:8_answer"
id="q124:8_answer"
size="30"
class="form-control d-inline"
/></span>
</div>
<div class="im-controls">
<button
type="submit"
id="q124:8_-submit"
name="q124:8_-submit"
value="1"
class="submit btn btn-secondary"
data-savescrollposition="true"
>
Check <span class="visually-hidden">Question 7</span>
</button>
</div>
</div>
</div>
</div>
+821
View File
@@ -0,0 +1,821 @@
<div id="question-124-18" class="que ordering interactive notyetanswered">
<div class="info">
<h3 class="no">Question <span class="qno">17</span></h3>
<div class="state">Tries remaining: 1</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775990511189_120">
<input type="hidden" name="q124:18_:flagged" value="0" /><input
type="hidden"
value="qaid=810&amp;qubaid=124&amp;qid=1773&amp;slot=18&amp;checksum=5dbbc1b24217228df046bd34749543fb&amp;sesskey=djxMUQR7fp&amp;newstate="
class="questionflagpostdata"
/>
<input
type="hidden"
class="questionflagvalue"
id="q124:18_:flaggedcheckbox"
name="q124:18_:flagged"
value="0"
/><a
tabindex="0"
class="aabtn"
role="button"
aria-pressed="false"
aria-label="Flagged"
title="Flag this question for future reference"
><img
class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775984535/i/unflagged"
alt=""
/>Flag question</a
>
</div>
<div class="editquestion">
<a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-18&amp;id=1773"
><i class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i
>Edit question</a
>
</div>
<span class="badge bg-primary text-light">v4 (latest)</span>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4>
<input type="hidden" name="q124:18_:sequencecheck" value="1" />
<div class="qtext" style="cursor: pointer">
<div class="clearfix">
<p>
Put this dialogue into the correct order. (This is an example of the Ordering question
type.)
</p>
</div>
<div class="ablock" id="id_ablock_1773">
<div class="answer ordering">
<div
aria-live="polite"
class="visually-hidden"
id="id_sortable_1773-announcement"
></div>
<ul class="sortablelist vertical numberingnone active" id="id_sortable_1773">
<li class="p-2 sortableitem" id="ordering_item_c88215f9a7ea9937bc26558b5ceae12d">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_c88215f9a7ea9937bc26558b5ceae12d-text"
data-itemcontent=""
>
Probably! I travelled from Kenya to Kamchatka!
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_c88215f9a7ea9937bc26558b5ceae12d-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_c88215f9a7ea9937bc26558b5ceae12d-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_3a7a3b22fc58e71418c2d218e0f4407b">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_3a7a3b22fc58e71418c2d218e0f4407b-text"
data-itemcontent=""
>
Hello John! How are you?
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_3a7a3b22fc58e71418c2d218e0f4407b-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_3a7a3b22fc58e71418c2d218e0f4407b-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_2388d00649281f3ad808246e6002be9b">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_2388d00649281f3ad808246e6002be9b-text"
data-itemcontent=""
>
Really? Why is that?
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_2388d00649281f3ad808246e6002be9b-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_2388d00649281f3ad808246e6002be9b-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_38c0bd413bd7de3368655abc8e0390c9">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_38c0bd413bd7de3368655abc8e0390c9-text"
data-itemcontent=""
>
Oh you probably have jet lag!
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_38c0bd413bd7de3368655abc8e0390c9-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_38c0bd413bd7de3368655abc8e0390c9-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_2d618912cb4b8d79f8ebb8ec7fc14f11">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_2d618912cb4b8d79f8ebb8ec7fc14f11-text"
data-itemcontent=""
>
Well actually I'm a bit tired.
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_2d618912cb4b8d79f8ebb8ec7fc14f11-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_2d618912cb4b8d79f8ebb8ec7fc14f11-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_7d2f2c6d1bdd6eea3fadf2cbe5a8b818">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_7d2f2c6d1bdd6eea3fadf2cbe5a8b818-text"
data-itemcontent=""
>
I've just been on a long plane journey!
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_7d2f2c6d1bdd6eea3fadf2cbe5a8b818-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_7d2f2c6d1bdd6eea3fadf2cbe5a8b818-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_5fab152120918e055fde5d4c068c28c0">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_5fab152120918e055fde5d4c068c28c0-text"
data-itemcontent=""
>
Fine thanks. And you?
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_5fab152120918e055fde5d4c068c28c0-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_5fab152120918e055fde5d4c068c28c0-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_ef71eac9e78d47f09b0aafe8f7f72cb9">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_ef71eac9e78d47f09b0aafe8f7f72cb9-text"
data-itemcontent=""
>
Fascinating! Tell me all about it.
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_ef71eac9e78d47f09b0aafe8f7f72cb9-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_ef71eac9e78d47f09b0aafe8f7f72cb9-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
</ul>
</div>
</div>
<input
name="q124:18_response_1773"
id="id_q124_18_response_1773"
type="hidden"
value="ordering_item_c88215f9a7ea9937bc26558b5ceae12d,ordering_item_3a7a3b22fc58e71418c2d218e0f4407b,ordering_item_2388d00649281f3ad808246e6002be9b,ordering_item_38c0bd413bd7de3368655abc8e0390c9,ordering_item_2d618912cb4b8d79f8ebb8ec7fc14f11,ordering_item_7d2f2c6d1bdd6eea3fadf2cbe5a8b818,ordering_item_5fab152120918e055fde5d4c068c28c0,ordering_item_ef71eac9e78d47f09b0aafe8f7f72cb9"
/>
</div>
<div class="im-controls">
<button
type="submit"
id="q124:18_-submit"
name="q124:18_-submit"
value="1"
class="submit btn btn-secondary"
data-savescrollposition="true"
>
Check <span class="visually-hidden">Question 17</span>
</button>
</div>
</div>
</div>
</div>
<div id="question-124-19" class="que ordering interactive notyetanswered">
<div class="info">
<h3 class="no">Question <span class="qno">18</span></h3>
<div class="state">Tries remaining: 1</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775990511189_126">
<input type="hidden" name="q124:19_:flagged" value="0" /><input
type="hidden"
value="qaid=811&amp;qubaid=124&amp;qid=1600&amp;slot=19&amp;checksum=2379a29476cf85083f91b4d6d99526ea&amp;sesskey=djxMUQR7fp&amp;newstate="
class="questionflagpostdata"
/>
<input
type="hidden"
class="questionflagvalue"
id="q124:19_:flaggedcheckbox"
name="q124:19_:flagged"
value="0"
/><a
tabindex="0"
class="aabtn"
role="button"
aria-pressed="false"
aria-label="Flagged"
title="Flag this question for future reference"
><img
class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775984535/i/unflagged"
alt=""
/>Flag question</a
>
</div>
<div class="editquestion">
<a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-19&amp;id=1600"
><i class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i
>Edit question</a
>
</div>
<span class="badge bg-primary text-light">v4 (latest)</span>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4>
<input type="hidden" name="q124:19_:sequencecheck" value="1" />
<div class="qtext" style="cursor: pointer">
<div class="clearfix">
<p>
Simply put the numbers in order. This is just an example question to demo the Ordering
question type.
</p>
</div>
<div class="ablock" id="id_ablock_1600">
<div class="answer ordering">
<div
aria-live="polite"
class="visually-hidden"
id="id_sortable_1600-announcement"
></div>
<ul class="sortablelist vertical numberingnone active" id="id_sortable_1600">
<li class="p-2 sortableitem" id="ordering_item_d4de8dbf3a0e2caf66e32325032220b1">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_d4de8dbf3a0e2caf66e32325032220b1-text"
data-itemcontent=""
>
two
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_d4de8dbf3a0e2caf66e32325032220b1-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_d4de8dbf3a0e2caf66e32325032220b1-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_f0936bab1853836dba0fc6b25ce6d315">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_f0936bab1853836dba0fc6b25ce6d315-text"
data-itemcontent=""
>
one
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_f0936bab1853836dba0fc6b25ce6d315-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_f0936bab1853836dba0fc6b25ce6d315-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_5e9a9d795d65eef14aabda148d71f4df">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_5e9a9d795d65eef14aabda148d71f4df-text"
data-itemcontent=""
>
three
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_5e9a9d795d65eef14aabda148d71f4df-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_5e9a9d795d65eef14aabda148d71f4df-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_da1838db9eb87b5e696fe927959fb532">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_da1838db9eb87b5e696fe927959fb532-text"
data-itemcontent=""
>
four
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_da1838db9eb87b5e696fe927959fb532-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_da1838db9eb87b5e696fe927959fb532-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
</ul>
</div>
</div>
<input
name="q124:19_response_1600"
id="id_q124_19_response_1600"
type="hidden"
value="ordering_item_d4de8dbf3a0e2caf66e32325032220b1,ordering_item_f0936bab1853836dba0fc6b25ce6d315,ordering_item_5e9a9d795d65eef14aabda148d71f4df,ordering_item_da1838db9eb87b5e696fe927959fb532"
/>
</div>
<div class="im-controls">
<button
type="submit"
id="q124:19_-submit"
name="q124:19_-submit"
value="1"
class="submit btn btn-secondary"
data-savescrollposition="true"
>
Check <span class="visually-hidden">Question 18</span>
</button>
</div>
</div>
</div>
</div>
<div id="question-124-20" class="que ordering interactive notyetanswered">
<div class="info">
<h3 class="no">Question <span class="qno">19</span></h3>
<div class="state">Tries remaining: 1</div>
<div class="grade">Marked out of 1.00</div>
<div class="questionflag editable" id="yui_3_18_1_1_1775990511189_132">
<input type="hidden" name="q124:20_:flagged" value="0" /><input
type="hidden"
value="qaid=812&amp;qubaid=124&amp;qid=1774&amp;slot=20&amp;checksum=5bec9067451e2e2635cdb8165c63bac5&amp;sesskey=djxMUQR7fp&amp;newstate="
class="questionflagpostdata"
/>
<input
type="hidden"
class="questionflagvalue"
id="q124:20_:flaggedcheckbox"
name="q124:20_:flagged"
value="0"
/><a
tabindex="0"
class="aabtn"
role="button"
aria-pressed="false"
aria-label="Flagged"
title="Flag this question for future reference"
><img
class="questionflagimage"
src="https://school.moodledemo.net/theme/image.php/boost/core/1775984535/i/unflagged"
alt=""
/>Flag question</a
>
</div>
<div class="editquestion">
<a
href="https://school.moodledemo.net/question/bank/editquestion/question.php?cmid=1210&amp;returnurl=%2Fmod%2Fquiz%2Fattempt.php%3Fattempt%3D88%26cmid%3D1210%23question-124-20&amp;id=1774"
><i class="icon fa fa-pen fa-fw iconsmall" title="Edit" role="img" aria-label="Edit"></i
>Edit question</a
>
</div>
<span class="badge bg-primary text-light">v4 (latest)</span>
</div>
<div class="content">
<div class="formulation clearfix">
<h4 class="accesshide">Question text</h4>
<input type="hidden" name="q124:20_:sequencecheck" value="1" />
<div class="qtext" style="cursor: pointer">
<div class="clearfix">
<p>
Order these country&nbsp; placing the most egalitarian at the top and the most
hierarchical at the bottom. (This is an example of the Ordering question type.)
</p>
</div>
<div class="ablock" id="id_ablock_1774">
<div class="answer ordering">
<div
aria-live="polite"
class="visually-hidden"
id="id_sortable_1774-announcement"
></div>
<ul class="sortablelist vertical numberingnone active" id="id_sortable_1774">
<li class="p-2 sortableitem" id="ordering_item_ab895ff6c0b0bf4a844756fba4bbfedd">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_ab895ff6c0b0bf4a844756fba4bbfedd-text"
data-itemcontent=""
>
<img
class="img-fluid"
src="https://school.moodledemo.net/pluginfile.php/2345/question/answer/124/20/4043/france.png"
alt="France"
width="100"
height="69"
/>
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_ab895ff6c0b0bf4a844756fba4bbfedd-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_ab895ff6c0b0bf4a844756fba4bbfedd-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_889db43eeca4114cde398376ce578f58">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_889db43eeca4114cde398376ce578f58-text"
data-itemcontent=""
>
<img
src="https://school.moodledemo.net/pluginfile.php/2345/question/answer/124/20/4041/sweden.png"
alt="Sweden"
width="100"
height="65"
/>
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_889db43eeca4114cde398376ce578f58-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_889db43eeca4114cde398376ce578f58-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_a294555e0023a4fcec1f6aabfb4fb096">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_a294555e0023a4fcec1f6aabfb4fb096-text"
data-itemcontent=""
>
<img
class="img-fluid"
src="https://school.moodledemo.net/pluginfile.php/2345/question/answer/124/20/4044/nigeria.png"
alt="Nigeria"
width="100"
height="67"
/>
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_a294555e0023a4fcec1f6aabfb4fb096-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_a294555e0023a4fcec1f6aabfb4fb096-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
<li class="p-2 sortableitem" id="ordering_item_c95f3ab27166c65cc44720f41d43db2e">
<div class="d-flex">
<div class="d-flex p-2 grip">
<i class="fas fa-grip-vertical" aria-hidden="true"></i>
</div>
<div
class="d-flex align-items-center flex-grow-1 px-2"
id="ordering_item_c95f3ab27166c65cc44720f41d43db2e-text"
data-itemcontent=""
>
<img
class="img-fluid"
src="https://school.moodledemo.net/pluginfile.php/2345/question/answer/124/20/4042/canada.png"
alt="Canada"
width="100"
height="67"
/>
</div>
<div class="d-flex px-2">
<button
type="button"
class="btn btn-icon"
data-action="move-backward"
aria-label="Move up"
aria-describedby="ordering_item_c95f3ab27166c65cc44720f41d43db2e-text"
>
<i class="icon fa fa-chevron-up" aria-hidden="true"></i>
</button>
<button
type="button"
class="btn btn-icon"
data-action="move-forward"
aria-label="Move down"
aria-describedby="ordering_item_c95f3ab27166c65cc44720f41d43db2e-text"
>
<i class="icon fa fa-chevron-down" aria-hidden="true"></i>
</button>
</div>
</div>
</li>
</ul>
</div>
</div>
<input
name="q124:20_response_1774"
id="id_q124_20_response_1774"
type="hidden"
value="ordering_item_ab895ff6c0b0bf4a844756fba4bbfedd,ordering_item_889db43eeca4114cde398376ce578f58,ordering_item_a294555e0023a4fcec1f6aabfb4fb096,ordering_item_c95f3ab27166c65cc44720f41d43db2e"
/>
</div>
<div class="im-controls">
<button
type="submit"
id="q124:20_-submit"
name="q124:20_-submit"
value="1"
class="submit btn btn-secondary"
data-savescrollposition="true"
>
Check <span class="visually-hidden">Question 19</span>
</button>
</div>
</div>
</div>
</div>