I'm using tinymce editor for sending an email.While sending actual email in mscrm activities and ember.js framework ,Email body is sent as HTML source not as actual HTML format. E.g while receiving an email I got format as '<'strong'>test<'/strong'>'
not as 'test' in bold.Please suggest.
below is the init function i have used
RichTextArea = Ember.TextArea.extend({
editor: null, _suspendValueChange: false, didInsertElement: function () { debugger; var id = "#" + this.get("elementId"); var view = this; tinyMCE.init({ width: "700", height: "400", plugins : "table,inlinepopups",
// Style formats
style_formats : [
{title : 'Bold text', inline : 'b'},
{title : 'Red text', inline : 'span', styles : {color : '#ff0000'}},
{title : 'Red header', block : 'h1', styles : {color : '#ff0000'}},
{title : 'Example 1', inline : 'span', classes : 'example1'},
{title : 'Example 2', inline : 'span', classes : 'example2'},
{title : 'Table styles'},
{title : 'Table row 1', selector : 'tr', classes : 'tablerow1'}
],
formats : {
alignleft : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'left'},
aligncenter : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'center'},
alignright : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'right'},
alignfull : {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', classes : 'full'},
bold : {inline : 'span', 'classes' : 'bold'},
italic : {inline : 'span', 'classes' : 'italic'},
underline : {inline : 'span', 'classes' : 'underline', exact : true},
strikethrough : {inline : 'del'},
customformat : {inline : 'span', styles : {color : '#00ff00', fontSize : '20px'}, attributes : {title : 'My custom format'}}
},
mode: "specific_textareas",
editor_selector : "mceEditor",
theme: "advanced",
theme_advanced_resizing: true,
//// Theme options
// theme_advanced_buttons1: "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,|,table,removeformat,code",
// theme_advanced_buttons2: "",
// theme_advanced_buttons3: "",
// theme_advanced_buttons4: "",
// theme_advanced_toolbar_location: "top",
// theme_advanced_toolbar_align: "left",
// theme_advanced_statusbar_location: "bottom",
// theme_advanced_resizing: true,
theme_advanced_buttons1: "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,formatselect,fontselect,fontsizeselect",
theme_advanced_toolbar_location: "top",
selector: id,
element_format : 'html',
setup : function(ed) {
view.set("editor", ed);
ed.onKeyUp.add(function (ed, e) {
view.suspendValueChange(function () {
view.set("value", ed.getContent());
});
});
},
valid_styles: {
'*': 'border,font-size',
'div': 'width,height'
}
});
},
suspendValueChange: function(cb) {
this._suspendValueChange = true;
cb();
this._suspendValueChange = false;
},
valueChanged: function() {
if (this._suspendValueChange) { return; }
var content = this.get("value");
this.get("editor").setContent(content);
}.observes("value"),
willClearRender: function() {
this.get("editor").remove();
}
});
