I have insert a line break within TinyMCE
tinyMCE.execCommand('mceInsertContent',false, "<br/>");
However the cursor currently stays where it was before.. which makes sense, however I would like code which moves the cursor the end of the html I just inserted?
Adding a space after the <br/> will reposition the cursor:
So change:
tinyMCE.execCommand('mceInsertContent',false, "<br/>");
to
tinyMCE.execCommand('mceInsertContent',false, "<br/> ");
Example: http://codepen.io/anon/pen/PbKQpJ (demo links above editor)
Related
Hey I have a TextField and a controller for it through which I access its current text value and add some text like (Some Special Asterix or text with angular brackets just like hashnode's text editor) to it when needed, adding text at the end is easy.
controller.text += "Something";
The above code will add Something to the end. But I need to know the current TextFields Cursor position and add text according to it.
I really love to know how we can do it in flutter efficiently
Try this to get the cursor position
print(controller.selection.baseOffset);
print(controller.selection.extentOffset);
if they are the same, it is current cursor position.
if not, it means that some of text is selected, baseOffset is start position and extentOffset is end positon.
I have an empty span and I would like to set cursor position on it. My codes works in Edge, Chrome, FireFox but not for IE.
I have tried set cursor on empty tag but the solution is not applicable for me.
This is the sample empty span:
<span id="ABC"></span>
My codes to set cursor position:
ed.on("focus", function (e) {
ed.focus();
var node= ed.dom.select("span#ABC");
ed.selection.setCursorLocation(node[0], 0);
});
The technique we use in the editor is adding a zero-width character ("\uFFEF" in JS) into the span and selecting that. It's a fairly reliable cross-browser way to put the cursor in places the browser doesn't normally support.
These characters are stripped when the content is serialised so there's no impact on the output HTML.
I've been using TinyMCE (v4 at the moment, but this question is valid for v5 as well) as an editor for content that is eventually turned into Word documents.
Pressing shift + enter on TinyMCE inserts a line break <br /> rather than a return (i.e., creating a new <p>). Is there any way to make shift + enter behave just as enter? In other words, is there any way to disable shift + enter?
If anyone's interested as to why I'm asking:
To make it as similar to editing text on Word as possible, I made it so that <p> elements have no margins at all. This way, the document looks the same on the editor and on Word. Line breaks look the same on the editor, but when converted to Word, their behaviour is different when the text orientation is set to justified. Lines ending with a line break get stretched to the full width of the document; lines ending with a return don't get stretched at all. That's the behaviour I'd like to have.
TinyMCE has APIs you can use to be notified when a key is pressed and you can look at that event to see if Shift + Enter has been pressed. The code to do this can go in your configuration:
setup: function(editor) {
editor.on('keydown', function (event) {
if (event.keyCode == 13 && event.shiftKey) {
console.log(event);
event.preventDefault();
event.stopPropagation();
return false;
}
});
}
Here is a complete TinyMCE Fiddle: http://fiddle.tinymce.com/LQgaab
My PHP generates a Word document, but it will not render carriage returns. My CKEditor translates a carriage return into either,
<br>, or <div>asdf</div>
When the Word document is created, it will display those HTML tags, so I strip them out. What replacement code, character, ascii, or tag can I use so that when the page is rendered, it shows the text like it did in the Editor?
Current example - if you have the text "Don't jump off the" [then hit Enter, so that the next word is below it]...
"cliff." Instead, currently, that gets saved into SQL as:
Don't jump off the <br>cliff.
Don't jump off the <div>cliff</div>.
...depending on which browser is used. In the msWord output, any tags left in the content [exceptions to strip_tags function] get displayed literally in msWord. Or, if I replace the tags with ASCII
it displays that literally, too. Not sure if this helps, but this is defined at the top of my php report_generator.php file:
require_once '/var/www/PhpWord/src/PhpWord/Autoloader.php';
\PhpOffice\PhpWord\Autoloader::register();
include "/var/www/ncpcphp/NCPC_PHP_Functions.php";
DEFINE("WRITEtoFDOCS", "NO");
DEFINE("FDOCSDIRECTORY", "Contract Attachments");
DEFINE("MIMETYPE","application/vnd.openxmlformats-officedocument.wordprocessingml.document" );
Help - what can I use to cause the output to show the carriage return?
Thank you, Cindy. Your answer is a piece of the solution. My CKEditor saves carriage returns as either
<br>, <br />, or <div></div>
depending on which browser is used Chrome[div] or Firefox[br] - that goes into my msSQL. Yet, if my editor has turned-on an "Enter filter" [keycode-13] in order to prevent someone from enter-editing a [[Placeholder]] (ckeditor read-onlyplugin) then saved editor text strips out the Enter. So, I did this: kept in the enter filter because it is necessary, then after the text carriage returns are saved as br's or div's, when I run my report generator, I replace
<br>, <br />, and <div></div>
with "\n" like you said. Then I explode the text variable like this:
$show_cad = explode("\n", $show_cad);
foreach($show_cad as $line) {
$section->addText(htmlspecialchars($line));
}
The code in the editor needed to filter out the Enters only when Enter is pressed in the [[Placeholder]] plug in is more complex, and I got largely from CKEditor themselves. They request that I do not post their full solutions, but if you like I could show you pieces of it. Basically, I had to register the Placeholder widget. Then when Enter is pressed, it checks if the context is with Placeholder. If so, filter the Enter [then it disappears from the saved editor text], but if Enter is pressed elsewhere, it gets saved and used properly.
Thank you for your help!
I have nicEdit implemented in the backend for uploading news items, and in the frontend each newsitem has a square in front of the beginning of the text body (image attached). This only occurs in the first paragraph of the text.
Due to the paragraph tags added by nicEdit, the text is displayed on a different line than the square. I have searched in the nicEdit docs and in previously answered questions on here but could not find a solution. Is there any way to change the paragraph formatting in nicEdit to use br at the end of a paragraph instead of having it wrap the text with p tags? Or if not, to have Nicdit automatically add the square to the beginning of each text?
Thank you in advance for any help!!
http://i.stack.imgur.com/dxxtu.png
Edit: Turns out the p tags were not caused by the nicedit but by the users copy-pasting the articles. I have used this to remove formatting from pasted text, but the tags are still there (it seems to only remove font properties).
As a temporary fix I have added the square to the nicedit wysiwyg as initial text, so that it is sent to the db along with the rest of the text and inside the same paragraph.
I realized there's a line in the code you modified that specifies all the unwanted tags. You should add the paragraph there.
Search for
/* remove undwanted tags */
newSnippet = newSnippet.replace(/<(div|span|style|meta|link){1}.*?>/gi,'');
in the nicEditorInstance class, and change it to
/* remove undwanted tags */
newSnippet = newSnippet.replace(/<(div|p|span|style|meta|link){1}.*?>/gi,'');
Notice the "p" has been added. That will prevent nicEdit to wrap the paragraphs in tags.