Details

    • Affected Branches:
      MOODLE_20_STABLE
    • Rank:
      4253

      Description

      No input elements until a cell is clicked. Clicking outside submits the form and updates the report without reloading the page.

        Issue Links

          Activity

          Hide
          Nicolas Connault added a comment - - edited

          Interface implementation details:

          1. Ways to enter grade edit mode:
          a. Click on the grade cell
          b. If already editing a grade, press the Tab key: this applies the change to the current cell, and moves the focus to the next cell down, or the first cell of the next column if the current cell is the last.
          c. If already editing a grade, press ctrl-arrow in the direction of another grade cell. This applies the change to the current cell, and moves the focus to the cell in the arrow's direction (phpmyadmin style)

          2. Row update request is sent when:
          a. [Enter] is pressed
          b. [Tab] is pressed
          c. Mouse is clicked outside the cell's boundaries

          In all 3 cases above, the update request (which includes updating the grade in DB and reloading the row) happens only if:
          a. We are in grade edit mode (focus is on a grade cell) AND
          b. The grade value has been changed

          3. Navigation can be done by using ctrl-arrow. The edit is applied in that case.

          4. Ways to exit edit mode:
          a. Press the [enter] to apply the edit
          b. Click the mouse anywhere outside of the cell being edited: cancels the edit

          ==Settings==
          1. Option to disable/enable immediate update of column averages and category averages. If disabled, an "Update averages" button should be displayed, which will send a global update AJAX request.

          2. Option to switch ctrl-arrow navigation on/off

          3. Option to jump from grade edit to feedback edit using tab, or from grade to grade, and then feedback to feedback once the column end is reached.

          Show
          Nicolas Connault added a comment - - edited Interface implementation details: 1. Ways to enter grade edit mode: a. Click on the grade cell b. If already editing a grade, press the Tab key: this applies the change to the current cell, and moves the focus to the next cell down, or the first cell of the next column if the current cell is the last. c. If already editing a grade, press ctrl-arrow in the direction of another grade cell. This applies the change to the current cell, and moves the focus to the cell in the arrow's direction (phpmyadmin style) 2. Row update request is sent when: a. [Enter] is pressed b. [Tab] is pressed c. Mouse is clicked outside the cell's boundaries In all 3 cases above, the update request (which includes updating the grade in DB and reloading the row) happens only if: a. We are in grade edit mode (focus is on a grade cell) AND b. The grade value has been changed 3. Navigation can be done by using ctrl-arrow. The edit is applied in that case. 4. Ways to exit edit mode: a. Press the [enter] to apply the edit b. Click the mouse anywhere outside of the cell being edited: cancels the edit ==Settings== 1. Option to disable/enable immediate update of column averages and category averages. If disabled, an "Update averages" button should be displayed, which will send a global update AJAX request. 2. Option to switch ctrl-arrow navigation on/off 3. Option to jump from grade edit to feedback edit using tab, or from grade to grade, and then feedback to feedback once the column end is reached.
          Hide
          Martin Dougiamas added a comment -

          OK, I tried this out:

          All of my activities has scales. I could change the menus on-screen but nothing was written to the database and there was no submit button at the bottom.

          I added a manual grade column which was just a number. This worked a little better, I could click in a blank cell and enter a number but it was a little wierd:

          1) bit disconcerting to click in the blank cell, we need some sort of image or text there, even a "-".
          2) licking next cell or pressing TAB did nothing, I had to hit return which felt odd (return is usually submit whole form)
          3) when I clicked in a cell, all the previously edited cells went blank (until I hit return then they all came back)
          4) I could see "POST /grade/report/grader/ajax_callbacks.php" in the logs, but reloading the page showed nothing had actually been saved.

          A good start, but some way to go still. Keep going!

          Show
          Martin Dougiamas added a comment - OK, I tried this out: All of my activities has scales. I could change the menus on-screen but nothing was written to the database and there was no submit button at the bottom. I added a manual grade column which was just a number. This worked a little better, I could click in a blank cell and enter a number but it was a little wierd: 1) bit disconcerting to click in the blank cell, we need some sort of image or text there, even a "-". 2) licking next cell or pressing TAB did nothing, I had to hit return which felt odd (return is usually submit whole form) 3) when I clicked in a cell, all the previously edited cells went blank (until I hit return then they all came back) 4) I could see "POST /grade/report/grader/ajax_callbacks.php" in the logs, but reloading the page showed nothing had actually been saved. A good start, but some way to go still. Keep going!
          Hide
          Matt Gibson added a comment -

          I just tried this and also got no XMLHTTPrequest happening.

          On the design side, however, I also realised that it is a bit odd to have to press 'turn editing on' to get this functionality. The editing button exists because PHP can't elegantly hide the controls when they're not needed, but javascript certainly can. I think that a doubleclick listener on the standard non-editing grade table to turn on editing for a particular cell would be far better. Also, the feedback input is not very convenient for large amounts of feedback e.g. when comment inline is on and the tutor is editing a previous essay.

          As a solution, I had a look at the YUI dialogue pop-up ( http://developer.yahoo.com/yui/examples/container/dialog-quickstart.html ) and it seems ideal for this in that it doesn't interfere with the existing table structure, can be set to resize ( http://developer.yahoo.com/yui/examples/container/panel-resize.html ) and be draggable and is built for AJAX. It would probably mean creating the grade cellls to each contain a form with a unique id and the 2 inputs that remained hidden until doubleclick, with JS to take the data from the existing cell markup and populate the form fields before rendering the dialogue panel, like I did for the tooltips. This would be a lot more flexible and also look great, and I think that the key press navigation could be retained too.

          It would be great to eliminate the editing button altogether with AJAX enabled, so maybe editing icons for column headers could be made to un-hide on mouseover? I've noticed for a while that to set gradetopass always need a whole gradebook reload just to get the editing icons, which is not very useful when I don't want to edit any cells. What do people think?

          Show
          Matt Gibson added a comment - I just tried this and also got no XMLHTTPrequest happening. On the design side, however, I also realised that it is a bit odd to have to press 'turn editing on' to get this functionality. The editing button exists because PHP can't elegantly hide the controls when they're not needed, but javascript certainly can. I think that a doubleclick listener on the standard non-editing grade table to turn on editing for a particular cell would be far better. Also, the feedback input is not very convenient for large amounts of feedback e.g. when comment inline is on and the tutor is editing a previous essay. As a solution, I had a look at the YUI dialogue pop-up ( http://developer.yahoo.com/yui/examples/container/dialog-quickstart.html ) and it seems ideal for this in that it doesn't interfere with the existing table structure, can be set to resize ( http://developer.yahoo.com/yui/examples/container/panel-resize.html ) and be draggable and is built for AJAX. It would probably mean creating the grade cellls to each contain a form with a unique id and the 2 inputs that remained hidden until doubleclick, with JS to take the data from the existing cell markup and populate the form fields before rendering the dialogue panel, like I did for the tooltips. This would be a lot more flexible and also look great, and I think that the key press navigation could be retained too. It would be great to eliminate the editing button altogether with AJAX enabled, so maybe editing icons for column headers could be made to un-hide on mouseover? I've noticed for a while that to set gradetopass always need a whole gradebook reload just to get the editing icons, which is not very useful when I don't want to edit any cells. What do people think?

            People

            • Votes:
              2 Vote for this issue
              Watchers:
              2 Start watching this issue

              Dates

              • Created:
                Updated: