0

我使用https://github.com/CakeDC/TinyMCE下载插件，并按照所有步骤集成到我的 cakePHP 项目中。所以现在，所有的textarea都成功地改成了tinyMCE编辑器

但是当点击“提交”提交我的表单时，页面无法提交和发布数据。无需加载编辑器，我的表单就可以提交和发布数据。

有任何jquery问题吗？请给我提意见。

谢谢你。

Bootsrab.php

CakePlugin::load('TinyMCE');
Configure::write('TinyMCE.editorOptions', array('width' => '500px','height'=>'250px' ));

控制器：

public $helpers=array('Html','Form','TinyMCE.TinyMCE');

看法：

$this->TinyMCE->editor(array('theme' => 'advanced', 'mode' => 'textareas'));
echo $this->Form->input('user_requirements',array('required'=>true) );

布局：默认加载js文件：

echo $this->Html->script(array('ddsmoothmenu','jquery-1.7.1.min','jquery-ui-1.8.17.custom.min'));
4

1 回答 1

1

您已将该字段设置为required，因此您遇到的问题可能是基于浏览器的表单验证。

问题是验证在TinyMCE 将内容注入到 textarea 之前应用，因此验证将始终失败，因为 textarea 为空。这是一个众所周知的“错误”顺便说一句：

http://www.tinymce.com/develop/bugtracker_view.php?id=4768 http://www.tinymce.com/develop/bugtracker_view.php?id=5671

在 Firefox 中，您可能会注意到屏幕左下角出现在浏览器“后面”的验证气泡，例如在 Chrome 中，它会抛出以下错误：“带有 name='...' 的无效表单控件是不可聚焦”。

快速而肮脏的解决方法是设置required为false. 为了将required类保留在生成的容器上，div您必须使用以下div选项手动设置：

'div' => array('class' => 'input text required')

也可以通过novalidate在表单上定义属性来完全禁用浏览器验证：

$this->Form->create('ModelName', array('novalidate' => true));

或使用formnovalidate提交按钮上的属性：

$this->Form->submit('Submit', array('formnovalidate' => true));

理论上，也可以监听invalid事件并显示自定义验证气泡，但这里的问题是浏览器行为不一致，即在 Chrome 中无法验证不可见（使用display或visibility）字段。此外，文本区域字段中的内容仍然会丢失。

似乎有用opacity的是隐藏字段，这样可以将文本区域定位在编辑器下，并且验证气泡会正确显示。Enter但是，这也需要在按下和单击提交按钮时手动将编辑器内容注入文本区域（或者使用适当的编辑器更改事件可能更简单）。稍后我会看看我是否可以为此提出一个示例。

更新：我已经以 TinyMCE 4.x 插件的形式实现了修复/解决方法，因为这也在我自己的一些应用程序中困扰着我，请参阅https://github.com/ndm2/tinymce-validatable

于 2013-10-25T12:29:19.160 回答