From 349fca66f32ecf3df6316b0cffb4e5fd0d24d6c7 Mon Sep 17 00:00:00 2001 From: Andy Chosak Date: Mon, 9 Dec 2019 14:15:30 -0500 Subject: [PATCH] Fix: Properly save ordering of nested InlinePanels The order of nested InlinePanels (recently formally added in 5566) doesn't get saved properly due to some now-invalid assumptions in the JS selector code. Currently, Wagtail users can use the editor up/down arrows to order InlinePanel elements that contain child InlinePanels, but these may not be properly saved. Before InlinePanel nesting was supported, it was a safer bet that a child panel would only contain one hidden input named "-ORDER". With nesting, however, a parent panel will also contain hidden inputs named like this for its child panels. This breaks the logic used in the ordering code. This change modifies the logic to use the jQuery `.children()` selector instead of `.next()`, ensuring that we reference the correct adjacent panel item. An easy way to test this against current master is to use the Wagtail testapp test models that exercise this behavior: 1. `wagtail start testwagtail` to create a new project. 2. `cd testwagtail` 3. Edit testwagtail/settings/base.py to add the Wagtail test application `'wagtail.tests.testapp'` to the list of `INSTALLED_APPS`. For the admin to work properly with this app, you also need to add `'wagtail.contrib.settings'` to that list and copy the definition of `WAGTAILADMIN_RICH_TEXT_EDITORS` from wagtail/tests/settings.py. 4. `./manage.py migrate` to create your local database. 5. `./manage.py createsuperuser` to create an admin user. 6. Create a new Event Page (http://localhost:8000/admin/pages/add/tests/eventpage/3/). 7. Fill in all required items, and then add multiple speakers under "Speaker Lineup". For each speaker, add at least one Award. Save the page. 8. Try using the up/down arrows to reorder the speakers (the parent InlinePanel), and save the page. 9. Note that when the page reloads, the ordering hasn't been saved. If you debug using the developer tools, you'll notice that this is because the code being modified here selects the child panel items instead of the adjacent parent panel item. --- CHANGELOG.txt | 2 +- CONTRIBUTORS.rst | 1 + docs/releases/2.8.rst | 2 +- wagtail/admin/static_src/wagtailadmin/js/page-editor.js | 8 ++++---- 4 files changed, 7 insertions(+), 6 deletions(-) diff --git a/CHANGELOG.txt b/CHANGELOG.txt index 49d4b9c6a..95e7b71a0 100644 --- a/CHANGELOG.txt +++ b/CHANGELOG.txt @@ -20,7 +20,7 @@ Changelog * Add StreamFieldPanel to available panel types in documentation (Dan Swain) * Add {{ block.super }} example to ModelAdmin customisation in documentation (Dan Swain) * Add ability to filter image index by a tag (Benedikt Willi) - * Add formal support for nested InlinePanels (Matt Westcott) + * Add formal support for nested InlinePanels (Matt Westcott, Sam Costigan, Andy Chosak, Scott Cranfill) * Added cache control headers when serving documents (Johannes Vogel) * Use `sensitive_post_parameters` on password reset form (Dan Braghis) * Fix: Rename documents listing column 'uploaded' to 'created' (LB (Ben Johnston)) diff --git a/CONTRIBUTORS.rst b/CONTRIBUTORS.rst index 09386660f..9f583c159 100644 --- a/CONTRIBUTORS.rst +++ b/CONTRIBUTORS.rst @@ -427,6 +427,7 @@ Contributors * Pete Andrew * Benedikt Willi * Johannes Vogel +* Sam Costigan Translators =========== diff --git a/docs/releases/2.8.rst b/docs/releases/2.8.rst index bb1c3f5c8..aa98fbcd1 100644 --- a/docs/releases/2.8.rst +++ b/docs/releases/2.8.rst @@ -40,7 +40,7 @@ Other features * Add StreamFieldPanel to available panel types in documentation (Dan Swain) * Add {{ block.super }} example to ModelAdmin customisation in documentation (Dan Swain) * Add ability to filter image index by a tag (Benedikt Willi) - * Add formal support for nested InlinePanels (Matt Westcott) + * Add formal support for nested InlinePanels (Matt Westcott, Sam Costigan, Andy Chosak, Scott Cranfill) * Added cache control headers when serving documents (Johannes Vogel) * Use ``sensitive_post_parameters`` on password reset form (Dan Braghis) diff --git a/wagtail/admin/static_src/wagtailadmin/js/page-editor.js b/wagtail/admin/static_src/wagtailadmin/js/page-editor.js index d624dc4dd..7c2218b58 100644 --- a/wagtail/admin/static_src/wagtailadmin/js/page-editor.js +++ b/wagtail/admin/static_src/wagtailadmin/js/page-editor.js @@ -38,13 +38,13 @@ function InlinePanel(opts) { if (opts.canOrder) { $('#' + prefix + '-move-up').on('click', function() { var currentChild = $('#' + childId); - var currentChildOrderElem = currentChild.find('input[name$="-ORDER"]'); + var currentChildOrderElem = currentChild.children('input[name$="-ORDER"]'); var currentChildOrder = currentChildOrderElem.val(); /* find the previous visible 'inline_child' li before this one */ var prevChild = currentChild.prevAll(':not(.deleted)').first(); if (!prevChild.length) return; - var prevChildOrderElem = prevChild.find('input[name$="-ORDER"]'); + var prevChildOrderElem = prevChild.children('input[name$="-ORDER"]'); var prevChildOrder = prevChildOrderElem.val(); // async swap animation must run before the insertBefore line below, but doesn't need to finish first @@ -59,13 +59,13 @@ function InlinePanel(opts) { $('#' + prefix + '-move-down').on('click', function() { var currentChild = $('#' + childId); - var currentChildOrderElem = currentChild.find('input[name$="-ORDER"]'); + var currentChildOrderElem = currentChild.children('input[name$="-ORDER"]'); var currentChildOrder = currentChildOrderElem.val(); /* find the next visible 'inline_child' li after this one */ var nextChild = currentChild.nextAll(':not(.deleted)').first(); if (!nextChild.length) return; - var nextChildOrderElem = nextChild.find('input[name$="-ORDER"]'); + var nextChildOrderElem = nextChild.children('input[name$="-ORDER"]'); var nextChildOrder = nextChildOrderElem.val(); // async swap animation must run before the insertAfter line below, but doesn't need to finish first