如何从WicketStuff的TinyMCE中获取用户的输入

Question

很直截了当的问题，但我哪儿也找不到。我正在使用WicketStuff的TinyMCE在我的应用程序中创建一个富文本编辑器，并且在任何地方都找不到如何从文本区域获取输入。为了简洁起见，下面是我正在使用的代码的简化版本。

    private String input;
    ...

    TinyMCESettings settings = new TinyMCESettings(TinyMCESettings.Theme.simple);

    TextArea<String> textArea = new TextArea<String>("editor", new PropertyModel<String>(this, "input"));
    textArea.add(new TinyMceBehavior(settings));

    form.add(textArea);

使用这一点，我希望通常的方式只是使用我的字符串‘输入’，因为它是作为模型设置的。这总是导致null，因为模型没有被更新。

我试着使用自动保存插件，以防它期望单击“保存”按钮(这也不会更新模型)，两者都不起作用。要获得用户的输入，我唯一能做的就是添加一个HiddenField，使用一个新的模型，并进行JavaScript调用，如下所示

document.getElementById('hiddenField').value = tinyMCE.get('editor').getContent();

但是，这也导致了试图在所需的地方调用JS并使其正常工作的其他问题。无论如何，我觉得这不应该是必要的，因为肯定有人已经实现了一种方法来获取使用的文本区域的内容。

任何帮助都将不胜感激。

Answer 1

感谢Nevermind的博客帖子，更新模型的方法是在表单的提交按钮中添加以下JavaScript：

onclick="tinyMCE.triggerSave(true,true);"

我的文本区域在面板内，面板外面的按钮，所以它不直接为我工作。诀窍是将JavaScript调用添加到按钮的onSubmit中，将逻辑移动到onAfterSubmit中，并使按钮MultiPart能够在执行与模型关联的其他逻辑之前调用保存触发器。

希望这可能对未来的其他一些人有所帮助。

Answer 2

您必须向submit按钮添加一个修饰符，以便模型可以更新。

AjaxButton btnSubmit = new AjaxButton("btnSubmit", new Model()) {
    @Override
    public void onSubmit(AjaxRequestTarget target, Form<?> form) {
        doSomething();
    }
};
btnSubmit.add(new TinyMceAjaxSubmitModifier());

查看这里以获取更多信息