Insights: Moodle Assignment Blue Card

Source: Insights: Moodle Assignment Blue Card

Here at Oxford Brookes, we have a Blue Card scheme enabling students with specific learning difficulties (SpLDs) to flag their work with a blue card, so the tutor will mark it with due consideration.

We needed a way of making it easier for students to flag their work with a blue card, and I have come up with the following script, which goes into the Additional HTML section in Site Administration in Moodle, and works with the Moodle Assignment functionality (see previous post for a blue card script that works with the Turnitin plugin).

First the student clicks the button to add the blue card, which inserts a comment with the words “Blue Card” in the submission comments field. When the form is submitted, the JavaScript looks for a comment in the grading table, and adds a flag in the status column to remind the tutor to review the comments. The tutor can then display the comment and see the words “Blue Card” (which are a link to the dyslexia marking guidelines).


var MoodleAssignBlueCardButton =  ‘<input type=”button” id=”mabluecard” value=”I wish my assignment to be assessed under the Blue Card scheme” class=”bluecard”/> <a href=””  target=”_blank” title=”What is the Blue Card scheme?”>What\’s this?</a><br/>’;

if (!document.getElementsByClassName(‘submissionstatustable’)[0]) {
/* do nothing */
} else {
var assignTable =document.getElementsByClassName(‘submissionstatustable’)[0];
assignTable.insertAdjacentHTML(‘beforebegin’, MoodleAssignBlueCardButton);

if (!document.getElementById(‘mabluecard’)) {
/* do nothing */
} else {
document.getElementById(“mabluecard”).addEventListener(‘click’, function () {
var commentbox = document.getElementsByClassName(‘comment-area’)[0];
var textarea = commentbox.getElementsByTagName(‘textarea’)[0];
if (!textarea.value) {
textarea.value = (‘<a href=”” target=”_blank” style=”background-color: #99ccff”>Blue Card</a>’);
} else if  (textarea.value == ‘Add a comment…’) {
textarea.value = (‘<a href=”” target=”_blank” style=”background-color: #99ccff”>Blue Card</a>’);
} else {
textarea.value = (‘<a href=”” target=”_blank” style=”background-color: #99ccff”>Blue Card</a>: ‘ + textarea.value);
/* save the comment */
var saveLink = document.getElementsByClassName(“fd”)[0].getElementsByTagName(“a”)[0];;

/* flag the Blue Card submission in the Grading Table */
if (!document.getElementsByClassName(‘gradingtable’)[0]) {
/* do nothing */
} else {
var table = document.getElementsByClassName(‘gradingtable’)[0];
var tbody = table.getElementsByTagName(‘tbody’)[0];

var comments = tbody.getElementsByClassName(‘c10’);
for (var i=0, len=comments.length; i<len; i++){
if (comments[i].innerHTML.includes(‘Comments’)){
thisRow = comments[i].closest(‘tr’); = ‘#ffffcc’;
statusCell = thisRow.getElementsByClassName(“c5”)[0];
statusCell.innerHTML += ‘

Student has added comments, please review


NB: code is supplied ‘as is’ without any commitment to it being fit for purpose and is also supplied without any commitment to maintenance or support.

(also posted on Stack Overflow)


Leave a Reply

Your email address will not be published. Required fields are marked *