         @props.flux.getActions(@props.name).set_grade(@props.assignment, @props.student, @state.grade)
         @setState(editing_grade:false)
 
+    grade_keydown: (e) ->
+        if e.keyCode == 27
+            @setState(grade:@props.grade, editing_grade:false)
+
     render_grade: ->
         if @state.editing_grade
             <form onSubmit={@save_grade}>
-                <Input value={@state.grade} ref='grade_input' type='text' placeholder='Grade'
-                    onChange={=>@setState(grade:@refs.grade_input.getValue())}
+                <Input autoFocus value={@state.grade} ref='grade_input' type='text' placeholder='Grade'
+                       onChange={=>@setState(grade:@refs.grade_input.getValue())}
+                       onKeyDown={@grade_keydown}
                 />
             </form>
         else
             <div>Grade: {@props.grade}
-                <Button onClick={=>@setState(grade:@props.grade, editing_grade:true)}>Edit</Button>
+                <Button onClick={=>@setState(grade:@props.grade, editing_grade:true)}>
+                    Edit
+                </Button>
             </div>
 
     render_last: (name, obj, type, info, enable_copy) ->

        error        : rtypes.string
        activity     : rtypes.object   # status messages about current activity happening (e.g., things being assigned)
        name         : rtypes.string.isRequired
        project_id   : rtypes.string.isRequired
        flux         : rtypes.object
        settings     : rtypes.object


    render_settings: ->
        if @props.flux? and @props.settings?
            <Settings flux={@props.flux} settings={@props.settings}
                      name={@props.name} project_id={@props.project_id}
                      path={@props.path} />

    render_student_header: ->
        n = @props.flux.getStore(@props.name)?.num_students()
