jrief / django-admin-sortable2

Generic drag-and-drop ordering for objects in the Django admin interface
https://django-admin-sortable2.readthedocs.io/en/latest/
Other
774 stars 180 forks source link

Uncaught error when using SortableAdminBase in admin view #309

Closed avelosa closed 2 years ago

avelosa commented 2 years ago

Seeing the same error as described in https://github.com/jazzband/django-admin-sortable/issues/256

python version == 3.9.11 Django version == 4.0.4 adminsortable2 version == 2.0.3

It's a little bit more of a pain for us because we have cypress ui automation tests that fail due to the console error.

FWIW I think there are a couple issues:

  1. the django admin change_list.html template is missing the element with id="admin_sortable2_config". In the JavaScript class SortableBase the constructor does: this.config=JSON.parse(document.getElementById("admin_sortable2_config") and thus the error mentioned above. SortableAdminBase is missing the change_list template override.

  2. In the JS the ActionForm class assumes an element with id="changelist-form-step" exists. The following error appears in the browser console:

    Uncaught TypeError: this.stepInput is null
    be http://localhost:8000/static/adminsortable2/js/adminsortable2.min.js:1
    <anonymous> http://localhost:8000/static/adminsortable2/js/adminsortable2.min.js:1
    EventListener.handleEvent* http://localhost:8000/static/adminsortable2/js/adminsortable2.min.js:1
    <anonymous> http://localhost:8000/static/adminsortable2/js/adminsortable2.min.js:1

    I think this is due to SortableAdminBase not having action_form = MovePageActionForm set.

  3. Probably not an issue for most Django users: we have admin users who are not superusers and so we restrict access to the admin change list dropdown select element and do not render it. This element matches the query selector select[name="action"] in ActionForm. I think it would be helpful if the conditional for creating a new ActionForm in the window.addEventListener function would check for the select[name="action"] element in addition to the #changelist-form element.

... I'll probably open a pull request.

jrief commented 2 years ago

In order to reproduce this error, please follow the steps described in https://django-admin-sortable2.readthedocs.io/en/latest/contributing.html#run-the-demo-app

You may clone the repository, add your model changes to the testapp, and commit it. I then will try to run it in my environment.

avelosa commented 2 years ago

I didn't have to change any model or add a new one to reproduce the issue. When running the App I went to the listing page of the 5th book (UnsortedBookAdmin) in the Test App and I saw the javascript error in the console.

https://user-images.githubusercontent.com/1669158/167904994-80c4d531-c222-439a-b565-5b59aa725519.mov

jrief commented 2 years ago

Thanks for reporting. This issue has been fixed in version 2.0.4

herrbenesch commented 2 years ago

Thank you for fixing this @jrief 🌞