Django-ckeditor: editor-element-conflict

Django-ckeditor в цикле for корректно отображается только для первой итерации. На остальных итерациях отображается форма шаблона по умолчанию, как показано ниже. В документации я вижу ошибку конфликта элементов, но там ничего не сказано, как решить. ckeditor.js:21 [CKEDITOR] Код ошибки: editor-element-conflict. Заранее спасибо! 

Here is my template code 
 <div  class="d-none" id="comment-{{answer.id}}" >
                        {% for comment in answer.comment_set.all %}
                        <div class="card mb-2" >
                            <div class="card-body">
                                <p>{{comment.comment|safe}}</p>
                                <p> <a href="#">{{comment.user.username}}</a> </p>
                            </div>
                        </div>
                        {% endfor %}
                </div>
            
               <div class="d-none" id="commentForm-{{answer.id}}"> 
                {% if user.is_authenticated %}             
                    <div class="commentform">
                    <form method="post">
                        <div class="form-group">
                        {% csrf_token %}
                        {{ commentForm.media }}
                        {{commentForm|crispy}}
                        <input type="hidden" name="answerid" value="{{ answer.id }}">
                        <input type="submit" name="submit" value="Submit" >
                        </div>
                </form>
                </div>
                {% endif %}

element-conflict

enter image description here

Я разобрался! Это происходит потому, что поля имеют одинаковый ID, и CKEditor путается, потому что находит несколько элементов с одинаковым ID. Решение: менять ID динамически во время генерации страницы.

Я не знаю структуру вашей модели, но могу предположить, что ваша форма определена следующим образом:

class CommentForm(forms.ModelForm):
    class Meta:
        model = Comment
        fields = “__all__”

Тогда вам нужно изменить его следующим образом:

from ckeditor.widgets import CKEditorWidget

class CommentForm(forms.ModelForm):
    base_textarea_id = "id_comment"

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.textarea_id_counter = 0
        self.fields['comment'].widget = CKEditorWidget(attrs={'id': self.get_textarea_next_id})

    def get_textarea_next_id(self):
        result = self.base_textarea_id + str(self.textarea_id_counter)
        self.textarea_id_counter += 1
        return result

    class Meta:
        model = Comment
        fields = “__all__”

На вашем месте я бы сделал имя переменной формы с использованием змеиного регистра и изменил бы название поля "comment" внутри модели Comment на что-то другое (даже "text" было бы лучше), но решать, конечно, вам.

Вернуться на верх