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.
Related
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]"
TinyMCE has an option that lets you make items in the editor not editable but I cannot find anything similar for CKEditor. Is there a way to make elements in the editor not editable?
You can change the configuration like this:
config.readOnly = true;
Or
You can use disabled attribute in textarea.
See the documentation here Read Only Mode
You can set contenteditable='false' on the element and CKEditor will handle it correctly as read only.
Works in 3.4+, 4 also definitely works, 5 probably does as well.
Reference:
This link has information on it [slightly out of date, but still applicable for the core concept]:
(https://docs-old.ckeditor.com/CKeditor_3.x/Users_Guide/NonEditable_Contents)
I'm trying to make a twitter-like rich-text editor wherein the characters that go over the character limit are highlighted. I saw this question and tried editing it.
I used Kendo UI's Editor and also Tim Down's rangy library. Using Kendo's inline editor, the rangy library works great.
<div contenteditable="true" class="rte"></div>
Although I need it to work when attached to a textarea.
<textarea class="rte" maxlength="50"></textarea>
The rangy library doesn't work on the textarea quite like the inline editor maybe because Kendo uses an iframe for this. The characters that go over the limit are highlighted but the cursor goes back to the start of the content.
Does anyone know how to fix this? Here's a sample I've been working on: http://jsfiddle.net/G4jn7/12/
This is easily fixed: you just need to pass in editor into the rangy.getSelection() call to tell it to get the selection from the iframe's rather than the main document.
Demo: http://jsfiddle.net/G4jn7/13/
In rangy.getSelection(x), x can be any of several things to identify the document to use: a Window, Document, an <iframe> element or a non-iframe element within the document.
I'm developing an application that requires very specific WYSIWYG functionality. I need a way to generate HTML consistently and around elements that my application generates. The container used must be a DIV element, there must be a way to block/strip formatting when pasting, and the tags used in the HTML must be consistent between browsers. Also, it is important to have hooks for the backspace key, so that any special elements that I insert into the DIV from my application can be handled appropriately. Anyone have any suggestions? Maybe a good starting point?
Have you looked at tinyMCE?
If i select a portion of text and try to make it underlined (using the U-Button) it works and the html looks like <u>...Text...</u> as expected. But when i initialize an editor with those u-tags in the content they are getting removed.
Does anyone know a work around?
I found out that the valid_elements setting was causing tinymce to remove the u-tags. Never had this problem with exactly this setting in former versions of tinymce, but this looks somewhat better and makes sense: I updated the setting and added
-u,
This solved the problem. Here the full valid_elements 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]," +
"#p,-ol,-ul,-li,br,img[src],-sub,-sup,-b,-i,-u," +
"-span,hr",