'Using Froala editor in Wagtail 2.14
I have been using Froala within Wagtail v1.13 and it works great, using the following: https://github.com/jaydensmith/wagtailfroala
Now upgraded to Wagtail 2.14. But the above plugin doesn't support v2 but there is a fork and a pull request that say they support Wagtail v2+
So I've tried manually implemented the changes from each of the following:
https://github.com/jaydensmith/wagtailfroala/pull/5/commits/d64d00831375489cfacefa7af697a9e76fb7f175
The editor seems to works apart from trying to insert an image, it shows the image library, but then when you try to select an image rather than allowing you to select image formats it loads the following URL:
http://127.0.0.1:8000/admin/images/chooser/133/select_format/
Which returns the following JSON:
html: "\n\n\n\n\n<header class=\" \">\n \n <div class=\"row nice-padding\">\n <div class=\"left\">\n <div class=\"col header-title\">\n <h1>\n Choose a format</h1>\n </div>\n \n </div>\n <div class=\"right\">\n \n \n \n </div>\n </div>\n</header>\n\n\n<div class=\"row row-flush nice-padding\">\n <div class=\"col6\">\n <img alt=\"Photo\" class=\"show-transparency\" height=\"450\" src=\"/media/images/Photo.max-800x600_zft9HEG.png\" width=\"800\">\n </div>\n <div class=\"col6\">\n <form action=\"/admin/images/chooser/133/select_format/\" method=\"POST\" novalidate>\n <input type=\"hidden\" name=\"csrfmiddlewaretoken\" value=\"5q5yNdUY3xt8BPbIbrulWQopP6bp7iqGYRDuzQQpee4LhJ0eMxRxM1xOaxpufXo8\">\n <ul class=\"fields\">\n \n \n<li class=\"required label-above \">\n \n<div class=\"field choice_field radio_select \" data-contentpath=\"format\">\n <label for=\"id_image-chooser-insertion-format_0\">Format:</label>\n <div class=\"field-content\">\n <div class=\"input \">\n \n <ul id=\"id_image-chooser-insertion-format\">\n <li><label for=\"id_image-chooser-insertion-format_0\"><input type=\"radio\" name=\"image-chooser-insertion-format\" value=\"fullwidth\" required id=\"id_image-chooser-insertion-format_0\">\n Full width</label>\n\n</li>\n <li><label for=\"id_image-chooser-insertion-format_1\"><input type=\"radio\" name=\"image-chooser-insertion-format\" value=\"left\" required id=\"id_image-chooser-insertion-format_1\">\n Left-aligned</label>\n\n</li>\n <li><label for=\"id_image-chooser-insertion-format_2\"><input type=\"radio\" name=\"image-chooser-insertion-format\" value=\"right\" required id=\"id_image-chooser-insertion-format_2\">\n Right-aligned</label>\n\n</li>\n</ul>\n \n\n \n <span></span>\n </div>\n \n\n \n </div>\n\n \n</div>\n\n</li>\n \n \n<li class=\" label-above \">\n \n<div class=\"field boolean_field checkbox_input \" data-contentpath=\"image_is_decorative\">\n <label for=\"id_image-chooser-insertion-image_is_decorative\">Image is decorative:</label>\n <div class=\"field-content\">\n <div class=\"input \">\n \n <input type=\"checkbox\" name=\"image-chooser-insertion-image_is_decorative\" id=\"id_image-chooser-insertion-image_is_decorative\">\n \n\n \n <span></span>\n </div>\n \n\n \n </div>\n\n \n</div>\n\n</li>\n \n \n<li class=\" label-above \">\n \n<div class=\"field char_field text_input \" data-contentpath=\"alt_text\">\n <label for=\"id_image-chooser-insertion-alt_text\">Alt text:</label>\n <div class=\"field-content\">\n <div class=\"input \">\n \n <input type=\"text\" name=\"image-chooser-insertion-alt_text\" value=\"Photo\" id=\"id_image-chooser-insertion-alt_text\">\n \n\n \n <span></span>\n </div>\n \n\n \n </div>\n\n \n</div>\n\n</li>\n \n <li><input type=\"submit\" value=\"Insert image\" class=\"button\" /></li>\n </ul>\n </form>\n </div>\n</div>\n"
step: "select_format"
Also trying to click on "next page" within the image library dialog doesn't work either, instead it seems to send the click to the main page under the dialog.
Any idea's?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
