TinyMCE, Bootstrap Modal & URL Parameter: wp is not defined

Question

使用 Bootstrap 5 和 WordPress 6.2

我正在构建一个 WordPress 插件。我有一个仪表板和一个所有内容页面。

Dashboard页面列出了最近创建的内容；列表中的每个条目都有一个编辑链接，用户可以单击该链接将他们带到显示 Bootstrap 模态的所有内容页面，其中包含可编辑的内容数据。

仪表板上的编辑链接是这样的：

• admin.php?page=my-plugin-all-content&the_content=65

65 是数据库中的内容 ID，my-plugin-all-content.php 页面正在等待 $_GET['the_content'] 可用，并根据 ID 从数据库中检索内容数据。

从数据库中检索数据的函数将javascript添加到输出以初始化tinymce：

$sections_scripts.= '<script>
                            wp.editor.initialize(\'my_plugin_section_'.$section_count.'_text\',{
                                tinymce: {
                                  wpautop: true,
                                  plugins : \'charmap colorpicker compat3x directionality fullscreen hr lists media paste tabfocus textcolor wordpress wpautoresize wpdialogs wpeditimage wpemoji wpgallery wplink wptextpattern wpview\',
                                  toolbar1: \'bold italic underline strikethrough | bullist numlist | blockquote hr wp_more | alignleft aligncenter alignright | link unlink | fullscreen | wp_adv\',
                                  toolbar2: \'formatselect alignjustify forecolor | pastetext removeformat charmap | outdent indent | undo redo | wp_help\',
                                  valid_elements: \'*\',
                                  verify_html: false
                                },
                                quicktags: true,
                                mediaButtons: true,
                              });</script>';

$sections_scripts 变量，现在填充了所有文本区域的初始化脚本，无论有多少文本区域，都放在 Bootstrap Modal 的底部，因此文本区域有时间创建。

一切正常； Bootstrap Modal 中的所有字段都填充了正确的数据，等等。

不起作用的是 Bootstrap Modal 中的文本区域在初始化时不会更改为 wp_editor (tinymce)；它给了我一个“wp is not defined”错误（引用 wp.editor.initialize 行）。

如果我直接转到 admin.php?page=my-plugin-all-content 并单击其中列出的内容的任何编辑链接，Bootstrap Modal 将通过 jQuery 完美显示；正确的 wp_editors 是用 jQuery POST 而不是 $_GET 变量初始化的。

所以似乎 $_GET 和 wp.editor.initialize 的使用不想工作？

有什么想法吗？如果需要，很高兴尝试更好地解释这一点或发布更多代码。

提前致谢！

Answer 1

看到这个答案和一些额外的修补后，我能够回答我自己的问题。

在从 $_GET 变量填充数据后，我使用 javascript 显示 Bootstrap Modal。

我没有将 $sections_scripts 放在 Modal 本身中，而是在 javascript 之后将它放在一些 jQuery 中以显示 Modal：

<?php
echo '<script>
var content_modal = new bootstrap.Modal(document.getElementById("my_plugin_edit_box"), {});
document.onreadystatechange = function () {
  content_modal.show();}</script>
  <script>
  jQuery("#my_plugin_edit_box").on("shown.bs.modal", function () {
  '.$sections_scripts.'
  });
  </script>';
?>