Question

We are using the TinyMceBehavior to add rich text behaviour to our text areas:

public class MandatoryContextTextArea extends TextArea<String> {

    private static final long serialVersionUID = -7837811514253179662L;

    public MandatoryContextTextArea(final String id, final IModel<String> model) {
        super(id, model);

        this.setOutputMarkupId(true);
        this.add(new IBehavior[] { new TinyMceBehavior(CustomTinyMCETextEditorSettings.initSettings()) });
    }
}

Is there anyway to get the position of where the user has the cursor currently located within the rich text area?

I have a requirement to have an 'Insert' button which when clicked, adds some text to the text area at the position the user has their cursor positioned. Is there anything within Wicket or TinyMceBehavior which can provide this location?

Thanks in advance.

Was it helpful?

Solution

You won't be able to get the cursor position on the server side very easily, but you can create a simple button which will handle it all on the client side with some JavaScript.

Something like this perhaps could be added to your button:

public class InsertAtCursorPositionBehaviour extends AttributeModifier
{

    public InsertAtCursorPositionBehaviour(final String content, final TextArea<?> textArea)
    {
        super("onclick", Model.of(getInsertJavaScript(content, textArea)));
    }

    private static String getInsertJavaScript(final String content, final TextArea<?> textArea)
    {
        textArea.setOutputMarkupId(true);
        final StringBuilder jsBuilder = new StringBuilder();
        jsBuilder.append("tinyMCE.get('");
        jsBuilder.append(textArea.getMarkupId());
        jsBuilder.append("').execCommand('mceInsertContent', false, '");
        jsBuilder.append(content);
        jsBuilder.append("');");
        return jsBuilder.toString();
    }
}

The string is the content to insert and the TextArea is the tinymce text area. Referring to the text area directly allows the possibility of having more than one per page.

If the content to insert is on the client side, it might be nice to embed the button into tiny mce itself. Take a look these custom options you could use: http://www.tinymce.com/tryit/button.php

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top