Richtext в Django делает неправильно - PullRequest
Новая
       5

Richtext в Django делает неправильно

0 голосов
/ 08 ноября 2018

Я использую wagtail 2.3 в Django 2.1, и для определенного цикла элементы richtext, содержащие тег <a>, отображаются неправильно.

Этот шаблон используется: 

    <div id="interactions-table">
  {% for interaction in value.interactions %}
    <a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: {{ interaction.interaction_type.colour }}">
      <p class="interaction-table__elem__interaction__name">{{ interaction.drug_name }}</p>
      <div class="d-none interaction-table__elem__interaction">
        <h4>{{ interaction.interaction_type }}</h4>
          {{ interaction.description | richtext }}
      </div>
    </a>
  {% endfor %}
</div>

Фрагмент ниже показывает 3 визуализируемых элемента. Первые два отображаются правильно внутри их <a>, а третий - нет: 

<div id="interactions-table">
  <a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #9BEA8B">
    <p class="interaction-table__elem__interaction__name">Paracetamol</p>
    <div class="d-none interaction-table__elem__interaction">
      <h4>Low risk and no synergy</h4>

        <div class="rich-text"><p>...</p></div>

    </div>
  </a>

  <a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #9BEA8B">
    <p class="interaction-table__elem__interaction__name">Ibuprofen</p>
    <div class="d-none interaction-table__elem__interaction">
      <h4>Low risk and no synergy</h4>

        <div class="rich-text"><p>content.... </p></div>

    </div>
  </a>

  <a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #F37A70">
    <p class="interaction-table__elem__interaction__name">Tricyclics</p>
  </a>
  <div class="d-none interaction-table__elem__interaction">
    <a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #F37A70">
      <h4>Dangerous</h4>
    </a>
    <div class="rich-text">
      <a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #F37A70"></a>
      <p>
        <a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #F37A70">
          beginning of content...
        </a>
        <a href="/somewhere">
          link in original content
        </a> 
        end of content 
      </p>
    </div>
  </div>
</div>

Спасибо.

1 Ответ

0 голосов
/ 08 ноября 2018

На самом деле это не проблема трясогузки. Здесь Wagtail просто делает то, что говорит ваш шаблон, и помещает ссылку внутри другой ссылки, которая не является допустимым HTML. Затем ваш браузер пытается восстановиться после этого, закрыв ссылку перед открытием новой, которую вы видите (предположительно) на панели инструментов разработчика. Если вместо этого вы используете в браузере параметр «Просмотр источника», вы увидите (недействительные) вложенные ссылки.

Вам нужно будет либо найти другой способ реализации вашего взаимодействия с Javascript, не требующий вложенных ссылок, либо запретить ссылки в этом поле с помощью аргумента features в RichTextField / RichTextBlock.

...