Merge pull request #13422 from edx/ammar/tnl-5402-single-form-per-problem

single form element per capa problem

common/lib/capa/capa/templates/annotationinput.html

@@ -1,5 +1,5 @@
 <%! from openedx.core.djangolib.markup import HTML %>
-<form class="annotation-input">
+<div class="annotation-input">
 <div class="script_placeholder" data-src="${STATIC_URL}js/capa/annotationinput.js"/>
 
 <div class="annotation-header">
@@ -57,7 +57,7 @@
 
     <p id="answer_${id}" class="answer answer-annotation"></p>
 </div>
-</form>
+</div>
 
 % if msg:
 <span class="message">${HTML(msg)}</span>

common/lib/capa/capa/templates/choicegroup.html

@@ -6,7 +6,8 @@
       not isinstance(value, basestring) and choice_id in value
     ))
 %>
-<form class="choicegroup capa_inputtype" id="inputtype_${id}">
+
+<div class="choicegroup capa_inputtype" id="inputtype_${id}">
     <fieldset ${HTML(describedby_html)}>
       % if response_data['label']:
         <legend id="${id}-legend" class="response-fieldset-legend field-group-hd">${response_data['label']}</legend>
@@ -71,4 +72,4 @@
     % if msg:
     <span class="message">${HTML(msg)}</span>
     % endif
-</form>
+</div>

common/lib/capa/capa/templates/choicetext.html

@@ -8,7 +8,7 @@
     %endif
 % endfor
 <section id="choicetextinput_${id}" class="choicetextinput">
-<form class="choicetextgroup capa_inputtype" id="inputtype_${id}">
+<div class="choicetextgroup capa_inputtype" id="inputtype_${id}">
     <div class="script_placeholder" data-src="${STATIC_URL}js/capa/choicetextinput.js"/>
 
     <fieldset aria-label="${remove_markup(response_data['label'])}">
@@ -73,5 +73,5 @@
     % if msg:
     <span class="message">${msg|n}</span>
     % endif
-</form>
+</div>
 </section>

common/lib/capa/capa/templates/javascriptinput.html

@@ -1,10 +1,9 @@
-<form class="javascriptinput capa_inputtype" id="inputtype_${id}">
+<div class="javascriptinput capa_inputtype" id="inputtype_${id}">
   <input type="hidden" name="input_${id}" id="input_${id}" class="javascriptinput_input"/>
-    <div class="javascriptinput_data" data-display_class="${display_class}" 
-        data-problem_state="${problem_state}" data-params="${params}" 
+    <div class="javascriptinput_data" data-display_class="${display_class}"
+        data-problem_state="${problem_state}" data-params="${params}"
         data-submission="${value|h}" data-evaluation="${msg|h}">
     </div>
     <div class="script_placeholder" data-src="/static/js/${display_file}"></div>
     <div class="javascriptinput_container"></div>
-</form>
-
+</div>

common/lib/capa/capa/templates/optioninput.html

@@ -2,7 +2,7 @@
 <%! from openedx.core.djangolib.markup import HTML %>
 <% doinline = "inline" if inline else "" %>
 
-<form class="inputtype option-input ${doinline}">
+<div class="inputtype option-input ${doinline}">
   % if response_data['label']:
       <label class="problem-group-label" for="input_${id}">${response_data['label']}</label>
   % endif
@@ -31,4 +31,4 @@
   % if msg:
       <span class="message">${HTML(msg)}</span>
   % endif
-</form>
+</div>

common/lib/xmodule/xmodule/capa_base.py

@@ -1288,17 +1288,16 @@ class CapaMixin(CapaFields):
             if is_correct is None:
                 is_correct = ''
 
+            response_data = getattr(answer_input, 'response_data', {})
             input_metadata[input_id] = {
-                'question': answer_input.response_data.get('label', ''),
+                'question': response_data.get('label', ''),
                 'answer': user_visible_answer,
                 'response_type': getattr(getattr(answer_response, 'xml', None), 'tag', ''),
                 'input_type': getattr(answer_input, 'tag', ''),
                 'correct': is_correct,
                 'variant': variant,
+                'group_label': response_data.get('group_label', ''),
             }
-            # Add group_label in event data only if the responsetype contains multiple inputtypes
-            if answer_input.response_data.get('group_label'):
-                input_metadata[input_id]['group_label'] = answer_input.response_data.get('group_label')
 
         return input_metadata
 

common/lib/xmodule/xmodule/tests/test_capa_module.py

@@ -2600,6 +2600,7 @@ class TestProblemCheckTracking(unittest.TestCase):
                 'response_type': 'optionresponse',
                 'input_type': 'optioninput',
                 'correct': True,
+                'group_label': '',
                 'variant': '',
             },
             factory.answer_key(3): {
@@ -2608,6 +2609,7 @@ class TestProblemCheckTracking(unittest.TestCase):
                 'response_type': 'multiplechoiceresponse',
                 'input_type': 'choicegroup',
                 'correct': False,
+                'group_label': '',
                 'variant': '',
             },
             factory.answer_key(4): {
@@ -2616,6 +2618,7 @@ class TestProblemCheckTracking(unittest.TestCase):
                 'response_type': 'choiceresponse',
                 'input_type': 'checkboxgroup',
                 'correct': False,
+                'group_label': '',
                 'variant': '',
             },
         })
@@ -2656,6 +2659,7 @@ class TestProblemCheckTracking(unittest.TestCase):
                 'response_type': 'numericalresponse',
                 'input_type': 'textline',
                 'correct': True,
+                'group_label': '',
                 'variant': '',
             }
         })
@@ -2787,6 +2791,7 @@ class TestProblemCheckTracking(unittest.TestCase):
                 'response_type': 'numericalresponse',
                 'input_type': 'textline',
                 'correct': True,
+                'group_label': '',
                 'variant': module.seed,
             }
         })
@@ -2819,11 +2824,13 @@ class TestProblemCheckTracking(unittest.TestCase):
                 'response_type': 'coderesponse',
                 'input_type': 'filesubmission',
                 'correct': False,
+                'group_label': '',
                 'variant': '',
             },
             factory.answer_key(3): {
                 'answer': 'None',
                 'correct': True,
+                'group_label': '',
                 'question': '',
                 'response_type': 'customresponse',
                 'input_type': 'textline',

lms/djangoapps/courseware/features/problems_setup.py

@@ -216,7 +216,7 @@ def answer_problem(course, problem_type, correctness):
         world.css_fill(inputfield(course, 'string'), textvalue)
 
     elif problem_type == 'numerical':
-        textvalue = "pi + 1" if correctness == 'correct' else str(random.randint(-2, 2))
+        textvalue = "pi+1" if correctness == 'correct' else str(random.randint(-2, 2))
         world.css_fill(inputfield(course, 'numerical'), textvalue)
 
     elif problem_type == 'formula':

lms/templates/problem.html

@@ -12,6 +12,8 @@ from openedx.core.djangolib.markup import HTML
 <div class="problem-progress"></div>
 
 <div class="problem">
+  ## onsubmit is required because click on any button inside form will submit it and reload page which we don't want
+  <form class='capa-problem-form' onsubmit='return false;'>
   ${ HTML(problem['html']) }
   <div class="action">
     <input type="hidden" name="problem_id" value="${ problem['name'] }" />
@@ -39,4 +41,5 @@ from openedx.core.djangolib.markup import HTML
     </div>
     % endif
   </div>
+  </form>
 </div>