Hi Stefdv
The code that Thomas added works fine, the problem in my site wound up being that I had two forms (one hidden) where the text area field had the same name and therefore the same ID, which then made the javascript unable to work correctly as there was not a unique ID.

So based on Thomas' code below you need to create a file in the mysite/code folder called 'FrontendHtmlEditorField.php' and then whatever page you are using it on the form would be something like...

public function MyForm(){
    $contentfield = new FrontendHtmlEditorField('Content', _t("ContentEntry.CN",'Content'));
    
    $fields = new FieldList(
         //your other fields
         $contentfield
                 );
    
     $actions = new FieldList(
			new FormAction('submitForm', 'Submit')
		);
     
     $form = new Form($this, 'MyForm', $fields, $actions);	
     
      return $form;

}

Then you would have your 'submitForm' function for processing the form and in the template you would just have $MyForm wherever you want the form to appear.

Tx for the reply,
a little over my head though ;)

I don't even think this is what i need.

I need students to work on a 'digital book' where they can only edit certain parts ( like answering questions ) .
I guess i need something like a frontend editor.

If you post some of your code and what you are trying to achieve I may be able to help or point you in the right direction.

You can email me if you like.

I have tried implementing FrontendHtmlEditorField - it works in a way of showing the editor, but it submits blank fields.

This is really upsetting - the functionality that SHOULD work does not work for years now, and noone fixed it :(

If anyone has a solution - please post it here.

Thanks.

The code that Thomas posted in response to my original query did work for me.

My problem was that I had two forms on one page, one that was hidden until you clicked another link (then the first form was hidden). As the HTMLEditorField had the same id in both forms that stopped the JQuery from working correctly (it did not have a unique id to attach the content to). When I changed the fields name (and therefore its automatically generated ID from Silverstripe) so that both editor fields had a unique ID, it then worked correctly as expected.

Perhaps if this is not working for you, try changing the field to a normal 'TextAreaField' and seeing if that actually submits the data or if perhaps it is an error elsewhere.

You might also need to add this:

<script>
$(window).load(function(){
		$('#your_field_id').css('visibility', 'visible');
});

</script>

OK,

we have sorted it out . the FrontendHtmlEditorField hack from Thomas works fine for ONE field. However - we had 5 HTML areas, so the script would iterate several times including required JS , and that would break it . SO in my example i had to change from

class FrontendHtmlEditorField extends HtmlEditorField {

public function __construct($name, $title = null, $value = '') {
parent::__construct($name, $title, $value);
self::include_js();
}

public static function include_js() {
parent::include_js();
Requirements::customScript("ssTinyMceConfig.editor_selector='frontendhtmleditor';
ssTinyMceConfig.theme_advanced_buttons1='bold,italic,bullist';
ssTinyMceConfig.theme_advanced_buttons2='';
ssTinyMceConfig.theme_advanced_buttons3='';
ssTinyMceConfig.theme_advanced_buttons3='';
ssTinyMceConfig.valid_elements='p,strong/b,em,br,ul,li';
tinyMCE.init(ssTinyMceConfig);");
}
} 

to

class FrontendHtmlEditorField extends HtmlEditorField {

public function __construct($name, $title = null, $value = '') {
parent::__construct($name, $title, $value);

}
} 

(Which basically mean you can use standard HtmlEditorField, as nothing is left in this class )

and placing

ssTinyMceConfig.editor_selector='frontendhtmleditor';
ssTinyMceConfig.theme_advanced_buttons1='bold,italic,bullist';
ssTinyMceConfig.theme_advanced_buttons2='';
ssTinyMceConfig.theme_advanced_buttons3='';
ssTinyMceConfig.theme_advanced_buttons3='';
ssTinyMceConfig.valid_elements='p,strong/b,em,br,ul,li';
tinyMCE.init(ssTinyMceConfig);

into one JS file in $(document).ready(function() {});
then including it through requirements on a Page.php

The normal HTMLEditorField works just fine in the frontend, you just need to implement HtmlEditorField_Toolbar yourself.

See doc here: http://doc.silverstripe.org/framework/en/topics/rich-text-editing#using-the-editor-outside-of-the-cms

Bump

Having exactly this issue

@thomas.paulson
Your code worked perfectly
That has saved me a couple hours worth of head scatching
So thanks a lot