agusmakmun / agusmakmun/django-markdown-editor

JavaScript issue with autocomplete_fields and Semantic UI

Đang mở
#271 0 bình luận 0 reaction 0 người được giao Xem trên GitHub
Ngôn ngữ chính
JavaScript
Star
901
Fork
1.3k
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

Related to issue #100, but slightly different - the latest version may have fixed the bug when Bootstrap is used, but there's a Javascript issue that arises when Semantic is used. I suspect this is due to a namespacing issue with the Select2 widget. When `autocomplete_fields` are defined on a ModelAdmin, the select2 Javascript gets included in the ``. This is the order:

```

... [other stuff]
[at the very bottom]
```

The error I get in console looks like this:
```
Uncaught TypeError: o.find(...).dropdown is not a function
at HTMLDivElement. (martor.semantic.min.js:9:12540)
at Function.each (jquery.js:383:19)
at jQuery.fn.init.each (jquery.js:205:17)
at fn.martor (martor.semantic.min.js:9:344)
at HTMLDocument. (martor.semantic.min.js:9:14373)
at mightThrow (jquery.js:3489:29)
at process (jquery.js:3557:12)
```

Which is triggered by the use of `$().dropdown()` and `$().tab()` in martor.semantic.js:

```js
// Handle tabs.
mainMartor.find('.ui.martor-toolbar .ui.dropdown').dropdown();
mainMartor.find('.ui.tab-martor-menu .item').tab();
```

And here's a screenshot of how it looks:
![image](https://github.com/user-attachments/assets/5e28b653-4f5c-4544-a95f-e3e6e763b9aa)

## Steps to reproduce

To reproduce in the demo app, in settings.py change `MARTOR_THEME = 'bootstrap'` to `MARTOR_THEME = 'semantic'` and then navigate to /admin/app/post/add/. Django version 5.1.4, Martor version 1.6.45, and Chrome 131.0.6778.139.

Possible solutions: to change MARTOR_THEME back to bootstrap (which might work for the demo app, but doesn't really work if I already have Semantic for my project) or to turn off autocomplete. I also tried merely removing the corresponding 2 offending lines from martor.semantic.min.js but it breaks the functionality of the Editor/Preview tabs.

I've also tried installing django-semantic-admin, which seems to automatically turn manytomany fields into Semantic UI dropdown widgets (bypassing select2) without the need to list autocomplete_fields. So far it seems to work, but it would be nice to be able to use Martor and autocomplete_fields together without having to install a different app.

(Thanks for all your work on this @agusmakmun! It's such a useful app.)

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Hướng nghiên cứu

Start by reproducing the issue in the demo app at /admin/app/post/add/ after changing MARTOR_THEME in settings.py to 'semantic'. Inspect martor.semantic.js and its minified counterpart around the dropdown and tab initialization, then verify the fix with autocomplete_fields enabled. Done means the Semantic UI editor loads without the dropdown error and its Editor/Preview tabs still work.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
django, javascript
Lĩnh vực
frontend
Loại issue
Lỗi
Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
45/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.