Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

Form Questions /

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

HTMLEditorField not working as expected on frontend form


Go to End


5 Posts   3005 Views

Avatar
Dr. J

Community Member, 8 Posts

23 September 2012 at 11:05pm

Edited: 01/10/2012 11:40am

I am trying to create a frontend form containing an HTMLEditorField. I have set up the form fields as below

$description = new HtmlEditorField('Description');
$description->setRows(10);
$fields = new FieldList(new TextField('Title', 'Job Title'),
						new TextField('JobType','Type'),
						new DateField('ClosingDate','Closing Date'),
						new TextField('Reference'),
						new TextField('ContactName','Contact'),
						new EmailField('ContactEmail','Email'),
						$description);

and created the database table for the corresponding DataObject to include a corresponding HTMLText field
class JobVacancy extends DataObject
{
    static $db = array(
		'Title' => 'Text',
		'JobType' => 'Text',
		'ClosingDate' => 'Date',
		'Reference' => 'Text',
		'ContactName' => 'Text',
		'ContactEmail' => 'Text',
		'Description' => 'HTMLText'
    );
}

The form is rendered as expected in that it contains the description field as follows
<div id="Description" class="field htmleditor">
	<label class="left" for="Form_CreateVacancyForm_Description">Description</label>
	<div class="middleColumn">
		<textarea name="Description" value="" class="htmleditor" id="Form_CreateVacancyForm_Description" rows="10" cols="10" tinymce="true" style="width: 97%; height: 160px"></textarea>
	</div>
</div>

and the entire form appears like the attached image.

I am expecting this type of field to behave on my frontend form exactly the same way it does when I use this type of field on a tab in the CMS, consequently I have two problems:

Problem 1: On submission, the record is created but the content of the HTMLText field is the same as the text entered in the form, that is plain text rather than the expected HTML markup. If I include markup directly to the field the record contains the markup I entered. Is this expected behaviour?

Problem 2: There is no TinyMCE toolbar visible. Do I need to configure the page to display this? Is the absence of the TinyMCE toolbar related to Problem 1?

I appreciate any assistance understanding and hopefully resolving this issue.

Thanks

Attached Files
Avatar
Willr

Forum Moderator, 5523 Posts

30 September 2012 at 6:33pm

Is the TinyMCE javascript loaded on the page or do you get a javascript error preventing it from loading?

Avatar
Dr. J

Community Member, 8 Posts

1 October 2012 at 1:58pm

Hi Willr

I am not getting any js errors when the pages loads and Firebug indicates that the scripts declared at the end of the page

</div>
<script type="text/javascript" src="/tamsec.com.au/framework/thirdparty/tinymce/tiny_mce_gzip.php?m=1348579864&js=1&amp;plugins=contextmenu,table,emotions,paste,spellchecker&amp;themes=advanced&amp;diskcache=true&amp;src=false"></script>
<script type="text/javascript" src="/tamsec.com.au/framework/thirdparty/jquery/jquery.js?m=1348579864"></script>
<script type="text/javascript" src="/tamsec.com.au/framework/thirdparty/jquery-ui/jquery-ui.js?m=1348579860"></script>
<script type="text/javascript" src="/tamsec.com.au/framework/javascript/DateField.js?m=1348579851"></script>
<script type="text/javascript">//<![CDATA[
if((typeof tinyMCE != 'undefined')) {
var ssTinyMceConfig = {"friendly_name":"(Please set a friendly name for this config)","priority":0,"mode":"specific_textareas","editor_selector":"htmleditor","width":"100%","auto_resize":false,"theme":"advanced","theme_advanced_layout_manager":"SimpleLayout","theme_advanced_toolbar_location":"top","theme_advanced_toolbar_align":"left","theme_advanced_toolbar_parent":"right","blockquote_clear_tag":"p","table_inline_editing":true,"safari_warning":false,"relative_urls":true,"verify_html":true,"plugins":"contextmenu,table,emotions,paste,spellchecker","theme_advanced_buttons1":"bold,italic,underline,strikethrough,separator,justifyleft,justifycenter,justifyright,justifyfull,formatselect,separator,bullist,numlist,outdent,indent,blockquote,hr,charmap","theme_advanced_buttons2":"undo,redo,separator,cut,copy,paste,pastetext,pasteword,spellchecker,separator,advcode,search,replace,selectall,visualaid,separator,tablecontrols","theme_advanced_buttons3":""};
}
//]]></script></body>
</html>

are loading correctly.

I am not explicitly setting configuration for the HTMLEditorField as I felt that the default would be sufficient to add the 'basics'. Could this be contributing to the behaviour I am seeing?

Avatar
Willr

Forum Moderator, 5523 Posts

1 October 2012 at 7:20pm

Avatar
Dr. J

Community Member, 8 Posts

20 October 2012 at 3:21am

Edited: 23/10/2012 2:33am

... but definitely related to this: HTMLEditor Field in frontend (SS3)

(snap)