We Keep Coding

TinyMCE4 - valid_elements property not working for 'em'

Want to allow certain tags & properties while pasting from Word/WebPage to TinyMCE4 Editor. I tried to set the configuration as below :
oEvent.getParameters().configuration.valid_elements="em,a[href|target=_blank],strong/b,div[align],br,p[align]";
Now I am able to paste only paragraph,bold & link not text with em tag.
Any idea why its not working ?
I want to allow only certains tags like Paragraph,Stong,StrikeThrough,Bullets.
Any help will be highly appreciated. Thank you.

I don't see any issue with using that valid_elements setting. Please see this TinyMCE fiddle:
http://fiddle.tinymce.com/Dmgaab
One editor allows EM and the other does not ... and TinyMCE works as I would expect.

Pasting content from word is quite a complicated problem - you'll likely be able to make some functions carry over nicely on your own / with the free version, but tinymce has an extensive paid plugin to handle pastes if that's what you want.
For now, I would try adding span to your list of valid_elements. It would depend on your text source, but I know that tinymce handles italics internally through <span> elements.
valid_elements: "span,em,a[href|target=_blank],strong/b,div[align],br,p[align]"

Froala Editor doesn't work

I use froala editor first time and now I have problems. On the first page froala works very good, but on the second page - editor doesn't work. When I click on toolbar buttons I have noting. Text length always equals zero and placeholder doesn't hide. Please Help me to fix this problem.
<script src="/public/bower_components/froala-wysiwyg-editor/js/froala_editor.pkgd.min.js"></script>
And.
$("#page_x2j1").froalaEditor();

I ended up using this reference to do the initialization on load and everything worked great.
$.getScript("js/froala_editor.pkgd.min.js", function () {

It looks like there might be a conflict with something else on the page. It would worth checking if there aren't other JS libraries which are preventing the editor editor toolbar to work correctly.

TinyMCE removes the ng-click event Angularjs

editor.insertContent(" sign up ");
this is code line my simple pluging for TinyMCE editor.
it work but with some problem.
The problem with this is that it removes ng-click="signup()" from like. in other words this produce following content
sign up
Intead of
sign up
I will be thanks full if some help me in this case. I just want to create a small plugin for tinymce insert just above code line in correct way

You need to set ng-click as valid tinymce attribute of a-Tags. Try this setting:
// The valid_elements option defines which elements will remain in the edited text when the editor saves.
valid_elements: "#[id|class|title|style]," +
"a[name|href|target|title|alt|ng-click]," +
"#p,blockquote,-ol,-ul,-li,br,img[src|height|width],-sub,-sup,-b,-i,-u," +
"-span,hr",

I wanted to share my solution too. Might not be suitable for all the use cases as it leaves you vulnerable to XSS. For my closed environment its fine thou.
I also wanted to allow using any other angular attributes, so listing them all isn't very feasible.
I simply added following:
valid_elements: '*[*]'
This allows using any elements with any attributes.

CLeditor uses the HTML 'align' attribute. How can I change that to CSS 'text-align'?

I've set up the CLeditor on a site I'm working on. Currently I'm setting it up so that as you type and edit within the editor, you can see a live preview of the results just above it, a lot like what you get when typing a StackOverflow question, though much more basic.
It works by simply copying the inner HTML of the iframe contents to another place on the page. However I've run into an annoying issue. When I use the alignment buttons (left, center, right), it adds the attribute align="right", for example, to the selected text. While it works in the editor, it does not work on the page itself, probably because that attribute is pretty much obsolete.
...
I actually figured out how to get around this issue while typing this question. Still, I'll post this question with my solution. Plus I have a relevant question to add to this.
Originally I tried applying the following CSS to the page:
div[align="right"] {
text-align:right!important;
}
This worked for initially loading the data onto the page, but while dynamically changing alignment in the editor, the live preview was not reflecting the changes. I thought at first that this was because the styles were applied at load time only.
Well, that was a brain fart because I know better than that. The real problem was that I was selecting a DIV element and the align attribute isn't necessarily applied to a DIV. Changing div[align="right"] to *[align="right"] works perfectly.
However, even though I found a workaround for this specific issue, I still can't figure out how the cleditor builds the HTML output for the iframe. Where does the align attribute come from in the code and how does it know to put it (and all of the other elements/attributes) into the HTML? If I had a way of manipulating this, I could simply tell it to use inline CSS for the alignment rather than the deprecated align HTML attribute. Please note that I do not wish to enable the cleditor's built-in "useCSS" feature.
Thanks for any information you can share, and please do not downvote this question just because I already solved the initial problem. I want this to be able to help others if they run into the same issue. (I'll also post my answer as an answer).

Applying the following CSS to the live-preview of the page works perfectly:
*[align="right"] {
text-align:right!important;
}
Don't forget to do the same for left and center as well.

Weird issue in IE when setting element's innerHTML attribute to contain a script element

I'm having a weird issue in IE when I set an elements innerHTML attribute to a string that contains a script element.
What happens is, when innerHTML is set like:
domEl.innerHTML = "<script type=\"text/javascript\">alert(\"hello world\");</script>"
alert(domEl.innerHTML);
The alert box doesn't show any text, as if the script element was removed completely. In addition, checking the element's childNodes collection also shows that the script element is not present as domEl.childNodes.length = 0.
However, if you add some text before the script tag like so:
domEl.innerHTML = "start text<script type=\"text/javascript\">alert(\"hello world\");</script>"
alert(domEl.innerHTML);
The script element is present when the alert box is shown.
Why is this happening and how can I fix it properly? Is this a bug in IE? It works fine in the latest versions of Chrome and Firefox. I'm using IE 8 for this.

looks like a bug, or some weird security consideration in IE.
try using XMP tags around your text. it might work, but that depends on what you were trying to achieve.