CakePHP 和所见即所得编辑器答案

【问题标题】：CakePHP and WYSIWYG EditorCakePHP 和所见即所得编辑器
【发布时间】：2012-06-15 18:41:28
【问题描述】：

我有一个关于在 CakePHP 中实现所见即所得编辑器的问题。我正在为我工作的员工开发一个内部网。我目前正在使用 CakePHP 1.3。我找到了这个存储库

https://github.com/josegonzalez/cakephp-wysiwyg-helper/tree/1.3

其中包含捆绑在一起的几个不同的所见即所得编辑器。我按照说明进行操作，并确保我下载了 NicEdit 的 JS 发行版（连同 TinyMCE，在我使用 NicEdit 后，仍然无法正常工作）。

我跑

echo $this->Nicedit->input('content');

在我看来。当我在浏览器中加载页面时，输入框会正确显示，但是没有用于文本编辑的工具栏。在页面运行时检查脚本，在此代码块下

<div class="input textarea required"><label for="AnnouncementContent">Content</label><textarea name="data[Announcement][content]" cols="30" rows="6" id="AnnouncementContent" ></textarea></div><script type="text/javascript">
        var area1;
        function makePanel() {
            area1 = new nicEditor({fullPanel : true}).panelInstance(
                'AnnouncementContent',
                {hasPanel : true}
            );
        }
        bkLib.onDomLoaded(function() { makePanel(); });</script>

我收到此错误：Uncaught ReferenceError: bkLib is not defined

我花了几个小时试图解决这个问题，但无济于事。有没有人对解决这个问题有一些见解？

【问题讨论】：

标签： cakephp cakephp-1.3

【解决方案1】：

这是我在最近的 1.3 项目中设置 TinyMCE 的方法，不使用该插件：

从我使用 TinyMCE 编辑器的观点来看：

//tell template to include the tinyMCE javascript file
<?php  
if(isset($javascript)): 
    echo $javascript->link('tiny_mce/tiny_mce.js'); 
endif; 
?>

//Build the form I need
<div class="responses form">
<?php echo $this->Form->create(null, array('controller' => 'Responses', 'action' => 'add')); ?>
    <fieldset>
        <legend>Add Response</legend>
    <?php
        echo $form->hidden('listing_id', array('value' => $tempid));
        echo $this->Form->input('content');
    ?>
    </fieldset>
<?php echo $this->Form->end(__('Submit', true));?>
</div>

//set up the editor
<script type="text/javascript"> 
    tinyMCE.init({ 
        theme : "simple", 
        mode : "textareas", 
        convert_urls : false 
    });
</script>

如果您真的想使用该插件，我知道这并不能真正回答您的问题，但如果您只使用 TinyMCE 没问题，您可以通过这种方式非常轻松地进行设置。最好的部分是，它会自动转换为 HTML，因此您可以将其保存到数据库中。当您从数据库中检索数据时，它将采用格式正确的 html 格式，因此您可以轻松地显示它。

您还可以在 init 方法中更具体地说明您希望它使用哪个文本区域。我很难让它只在特定的文本区域上激活，但你可能会有不同的运气。文档是here。您还可以打开更高级的主题。文档描述了这些选项。

【讨论】：