Create a Text-Based Response Question

  1. Click to create a unit or edit a unit in Studio.
  2. Click on the "Add a New Component" link on the page.
  3. Click on the Common Problem Types tab.
  4. Select "Blank Common Problem" from the list of options.



  5. Click to edit the component.
  6. Replace the XML <problem></problem> with the following XML (please note that in XML, indentation and formatting matter):

    <div class="problem-description">

      <!-- This is the problem description, that instructs students on what to write about. -->

    <p>Problem description text goes here...</p>

    <p>More description text, if needed.</p>

    </div>

     

    <problem markdown="null" max_attempts="5">

    <label>Please enter your response here.</label> <!-- You can change this text, but this is a reasonable default. -->

    <script type="loncapa/python">

    # The block below is the grading function for this problem. 

    # The name you assign it here will be used below.

     

    import re

    def short_response(expect, ans):

      response = re.search('', ans)

      if response:

       return 1

      else:

       return 0

      

    </script>

      <span id="short_response_question_1"/> <!-- Edit this id, for each problem -->

      <script type="text/javascript">

        /* The object here is to replace the single line input with a textarea */

      (function() {

        var elem = $("#short_response_question_1")

            .closest("div.problem")

            .find(":text");

        var label = $("#short_response_question_1")

            .closest("div.problem")

            .find('label');

        label.attr('for', elem.attr('id'));

        var description = $("#short_response_question_1")

            .closest("div.problem")

            .find('.problem-description');

        description.attr('id', elem.attr('id')+'-description');

        /* There's CSS in the LMS that controls the height, so we have to override here */

        var textarea = $('<textarea style="height:150px" rows="20" cols="70"/>');

        

        //This is just another way to do an iterator in JS

        for (attrib in {'id':null, 'name':null}) {

            textarea.attr(attrib, elem.attr(attrib));

        }

        textarea.attr('aria-describedby', elem.attr('id')+'-description');

        /* copy over the submitted value and give an aria description*/

        textarea.val(elem.val());

        elem.replaceWith(textarea);

        /* clear out echoed text */

        textarea.siblings(".status").text("");

        

      })();

      </script>

      <customresponse cfn="short_response"><!-- This 'cfn' name is the name of the python grading function above -->

        <textline/>

      </customresponse>

    </problem>



  7. Replace the two matching "short_response" texts in the strings from the above XML with your own unique name. These two texts are found in the def and customresponse cfn lines. Make sure there are no spaces in the name you enter here, and that the name you choose is the same in both strings:

    def short_response(expect, ans):
    <customresponse cfn="short_response">

  8. Next, replace the four matching "short_response_question_1" texts in the above strings of XML with your own unique name.  We recommend something descriptive here, but again make sure that the names match in all four locations noted below, and also that there are no spaces in the name you choose.

    <span id="short_response_question_1"/>
    var elem = $("#short_response_question_1")
    var label = $("#short_response_question_1")
    var description = $("#short_response_question_1")

    Planning to add more than one text-based response question to a unit? Make sure that other text-based response questions in your unit have unique names.  For example, you might choose as a name for your first question "short_response_question_1" and for your second question "short_response_question_2".

  9. Click on the Settings tab to change the display name or erase it so that no display name appears.  This name appears in the horizontal navigation at the top of the page, and also above your question on the page.
  10. Set the weight of the problem in the Settings section as well.  By default, a problem will have a weight of 1 point.  If you would like for this to not count toward your students' grades, enter 0 in the space provided.

    Note that even if a problem is ungraded, this XML specifies that as long as a response is given, it will be marked as correct, and if no response is given but "Submit" is clicked, it will be marked as incorrect.

  11. At this point, you can click to replace the live version of this unit with your updated version, or you can change your private draft to be public.

The end result will look like this:


Set a minimum word requirement

For the above problem, as long as some response is given by a student, it will be marked as correct, regardless of its length.  To set a minimum length requirement in your question, change this in the above XML:

def short_response(expect, ans):
  response = re.search('', ans)
  if response:
      return 1
  else:
      return 0

to this:

def short_response(expect, ans):
  words = ans.split()
  return len(words) >= 10

"10" notes the minimum number of words required in order for a submitted response to be counted as correct.  Make sure to let your students know of any minimum word requirement you set in your question.

Have more questions? Submit a request