13

プロジェクトにdjango Grappelliスキンを使用しています。

表形式のインライン関数を備えた ModelAdmin があります。

ページがロードされたときに空白行が自動的に挿入されるのを防ぐために、extra = 0 を使用します。それは正常に動作します。

ここで、+ 記号をクリックして新しい行を挿入すると、行が読み込まれますが、tinymce テキストフィールドは編集できません。

この問題の理由と解決方法を知っている人はいますか?

ドキュメントを読んだ後：

http://django-grappelli.readthedocs.org/en/latest/customization.html#using-tinymce

私は気づく：

TinyMCE を Inlines で使用するのは、空のフォームが隠されているため、少し注意が必要です。カスタム テンプレートを作成し、インライン コールバックを使用して

onInit: 空のフォームから TinyMCE インスタンスを削除します。

onAfterAdded: フォームから TinyMCE インスタンスを初期化します。

onBeforeRemoved: フォームから TinyMCE インスタンスを削除します。

インラインを使用した TinyMCE は、デフォルトではサポートされていません。

これのサンプルはありますか？変更する必要があるのは TinyMCE 関数であることに気付きました。

4

2 に答える 2

4

これをもっと徹底的に調べる時間がなかったので、もっと良い解決策があると確信していますが、これは私にとってはうまくいくようです（django-grappelli2.3.5とdjango-tinymce1.5.1a2でテスト済み） 。

スタックインラインを使用していると想定しています。

grappelliからテンプレートをオーバーライドする必要がありますtemplates/admin/edit_inline/stacked.html。inline_admin_formset|formsetsort:sortable_field_nameネストされたforループの反復の直後に、forループの反復の内部に、次のinline_admin_formスニペットを追加します。

{% if forloop.last %}
  <script type="text/javascript">
    if (tinyMCE != undefined) {
      django.jQuery('textarea', '.empty-form').each(function() {
        tinyMCE.execCommand('mceRemoveControl', false, django.jQuery(this).attr('id'));
      });
    }
  </script>
{% endif %}

tinyMCEウィジェット用にレンダリングされたインラインjavascriptによって初期化された、非表示の「空のフォーム」のtextarea要素のtinyMCEコントロールを無効にする必要があります。

元のgrappelliテンプレートの133行目のあたりに、の呼び出しが表示されますgrp_inline()。引数を追加/変更します。

$("#{{ inline_admin_formset.formset.prefix }}-group").grp_inline({
  prefix: "{{ inline_admin_formset.formset.prefix }}",
  onBeforeRemoved: function(f) {
    if (tinyMCE != undefined) {
      // make sure tinyMCE instances in empty-form are inactive
      django.jQuery('textarea', '.empty-form').each(function() {
        tinyMCE.execCommand('mceRemoveControl', false, django.jQuery(this).attr('id'));
      });
    }
  },
  [...]
  onAfterAdded: function(form) {
    if (tinyMCE != undefined) {
      // re-initialise tinyMCE instances
      $('textarea', form).each(function(k,v) {
        var tid = $(this).attr('id');
        tinyMCE.execCommand('mceRemoveControl', false, tid);
        tinyMCE.execCommand('mceAddControl', false, tid);
      });
      // make sure tinyMCE instances in empty-form are inactive
      django.jQuery('textarea', '.empty-form').each(function() {
        tinyMCE.execCommand('mceRemoveControl', false, django.jQuery(this).attr('id'));
      });
    }
    [...]
  }
  [...]

ソート可能ファイルを使用する場合は、ドラッグされているインラインのテキスト領域でtinyMCEコントロールも無効にする必要があります。初期化を探しsortable()、「start」コールバックを変更します。

start: function(evt, ui) {
  ui.placeholder.height(ui.item.height() + 12);
  if (tinyMCE != undefined) {
    // make sure tinyMCE instances in empty-form are inactive
    $('textarea', ui.item).each(function(k,v) {
      var tid = $(this).attr('id');
      tinyMCE.execCommand('mceRemoveControl', false, tid);
    });
  }
},
[...]

これにより、この厄介な問題を回避する方法の大まかなアイデアが得られるはずです...

于 2011-10-15T22:05:23.747 に答える