jeudi 31 mars 2016

tinymce get html content and place it as email body using ember.js

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();
}

});




Aucun commentaire:

Enregistrer un commentaire