Update status during term listing changes.

Don't redraw page, which can cause pagination thrash.
Term status can change as a side effect when the parent
is assigned, but that's the only field that behaves that
way, so only update that.

Author: jzohrab

lute/templates/term/index.html

@@ -127,7 +127,24 @@
       setTimeout(() => { tooltip.fadeOut(200, function() { $(this).remove(); }); }, 800);
     }
 
+    /**
+     * Post the update, and update the term status.
+     * We only need to update the status as that's the only
+     * thing that might change as a side-effect of setting
+     * the parent.
+     */
     function post_update(td, term_id, update_type, update) {
+
+      // Update via datatables dom manipulation, keeps the dt
+      // model consistent.
+      const _update_status_in_row = function(updated_status) {
+        const table = $('#termtable').DataTable();
+        const row = table.row(td.closest('tr'));
+        const select = row.node().querySelector('.term-status-select');
+        if (select)
+          select.value = updated_status;
+      };
+
       const payload = {
         term_id: term_id,
         update_type: update_type,
@@ -140,11 +157,8 @@
         contentType: 'application/json',
         data: JSON.stringify(payload),
         success: function(response) {
-          // console.log('Success:', response.status);
           _show_saved_checkmark(td);
-          // Stay on page 2 if editing an element on page 2. :-P
-          const change_current_page_on_redraw = false;
-          $('#termtable').DataTable().draw(change_current_page_on_redraw);
+          _update_status_in_row(response.status);
         },
         error: function(xhr) {
           if (xhr.responseJSON && xhr.responseJSON.error) {
@@ -262,6 +276,7 @@
     const editableStatusCell = function (td, cellData, rowData, row, col) {
       function makeDropdown(td) {
         const select = document.createElement('select');
+        select.classList.add('term-status-select');
         select.innerHTML = '';
         {% for s in update_statuses %}
           select.innerHTML += '<option value="{{s.id}}">{{ s.text }}</option>';

lute/term/routes.py

@@ -152,22 +152,32 @@ def bulk_edit_from_reading_pane():
 
 @bp.route("/ajax_edit_from_index", methods=["POST"])
 def ajax_edit_from_index():
-    "Ajax edit from the term index listing."
+    """
+    Ajax edit from the term index listing.
+
+    If successful, returns the term's new status.  Only the status is
+    returned, as that is the only thing that might change as a result
+    of an ajax update (e.g., if a parent is assigned.
+    """
     svc = TermService(db.session)
+    updated_term = None
     try:
         data = request.get_json()
         term_id = int(data.get("term_id", 0))
         update_type = data.get("update_type", "")
         values = data.get("values")
         svc.apply_ajax_update(term_id, update_type, values)
+        repo = TermRepository(db.session)
+        updated_term = repo.find(term_id)
     except TermServiceException as ex:
         return jsonify({"error": str(ex)}), 400
     except ValueError as ex:
         print(ex, flush=True)
         return jsonify({"error": f"Invalid input ({ex})"}), 400
     except Exception as ex:  # pylint: disable=broad-exception-caught
         return jsonify({"error": f"An unexpected error occurred ({ex})"}), 500
-    return jsonify({"status": "ok"})
+
+    return jsonify({"status": updated_term.status})
 
 
 @bp.route("/export_terms", methods=["POST"])