Merge pull request #37 from mtyaka/autosubmit

Update display when answer is changed.

mentoring/mentoring.py

@@ -138,6 +138,13 @@ class MentoringBlock(XBlockWithLightChildren):
                 child.save()
                 completed = completed and child_result['completed']
 
+        if self.max_attempts_reached:
+            message = self.get_message_html('max_attempts_reached')
+        elif completed:
+            message = self.get_message_html('completed')
+        else:
+            message = self.get_message_html('incomplete')
+
         # Once it has been completed once, keep completion even if user changes values
         if self.completed:
             completed = True
@@ -146,13 +153,6 @@ class MentoringBlock(XBlockWithLightChildren):
         if self.max_attempts_reached:
             completed = False
 
-        if completed:
-            message = self.get_message_html('completed')
-        elif self.max_attempts_reached:
-            message = self.get_message_html('max_attempts_reached')
-        else:
-            message = self.get_message_html('incomplete')
-
         if self.has_missing_dependency:
             completed = False
             message = 'You need to complete all previous steps before being able to complete '+\

mentoring/public/js/answer.js

@@ -3,7 +3,7 @@ function AnswerBlock(runtime, element) {
 
         init: function(options) {
             // register the child validator
-            $(':input', element).on('keyup', options.blockValidator);
+            $(':input', element).on('keyup', _.debounce(options.onChange, 1000));
 
             var checkmark = $('.answer-checkmark', element);
             var completed = $('.xblock-answer', element).data('completed');

mentoring/public/js/mentoring.js

 function MentoringBlock(runtime, element) {
     var attemptsTemplate = _.template($('#xblock-attempts-template').html());
     var children; // Keep track of children. A Child need a single object scope for its data.
+    var submitXHR;
 
     function renderAttempts() {
         var data = $('.attempts', element).data();
@@ -83,27 +84,46 @@ function MentoringBlock(runtime, element) {
         }
     }
 
-    function initXBlock() {
-        var submit_dom = $(element).find('.submit .input-main');
-
-        submit_dom.bind('click', function() {
-            var success = true;
-            var data = {};
-            var children = getChildren(element);
-            for (var i = 0; i < children.length; i++) {
-                var child = children[i];
-                if (child.name !== undefined) {
-                    data[child.name] = callIfExists(child, 'submit');
-                }
+    function submit() {
+        var success = true;
+        var data = {};
+        var children = getChildren(element);
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            if (child.name !== undefined) {
+                data[child.name] = callIfExists(child, 'submit');
             }
-            var handlerUrl = runtime.handlerUrl(element, 'submit');
-            $.post(handlerUrl, JSON.stringify(data)).success(handleSubmitResults);
-        });
+        }
+        var handlerUrl = runtime.handlerUrl(element, 'submit');
+        if (submitXHR) {
+            submitXHR.abort();
+        }
+        submitXHR = $.post(handlerUrl, JSON.stringify(data)).success(handleSubmitResults);
+    }
+
+    function resubmit() {
+        // Don't autosubmit if number of attempts is limited.
+        var max_attempts = $('.attempts', element).data('max_attempts');
+        // Only autosubmit if messages are already shown.
+        var messages_dom = $('.messages', element);
+        if (messages_dom.html().trim() && !max_attempts) {
+            submit();
+        }
+    }
+
+    function onChange() {
+        validateXBlock();
+        resubmit();
+    }
+
+
+    function initXBlock() {
+        $(element).find('.submit .input-main').bind('click', submit);
 
         // init children (especially mrq blocks)
         var children = getChildren(element);
         var options = {
-            blockValidator: validateXBlock
+            onChange: onChange
         };
         _.each(children, function(child) {
             callIfExists(child, 'init', options);

mentoring/public/js/questionnaire.js

@@ -46,7 +46,7 @@ function MessageView(element) {
 function MCQBlock(runtime, element) {
     return {
         init: function(options) {
-            $('input[type=radio]', element).on('change', options.blockValidator);
+            $('input[type=radio]', element).on('change', options.onChange);
         },
 
         submit: function() {
@@ -123,7 +123,7 @@ function MCQBlock(runtime, element) {
 function MRQBlock(runtime, element) {
     return {
         init: function(options) {
-            $('input[type=checkbox]', element).on('change', options.blockValidator);
+            $('input[type=checkbox]', element).on('change', options.onChange);
         },
 
         submit: function() {