CodeMirror: Set Focus at End of Line
CodeMirror is a WYSIWYG-like editor that allows for rich text editing on a small scale, oftentimes used to allow Markdown editing, much like ReviewBoard uses it for. One problem I've found, however, is that calling a CodeMirror instance's focus method put the cursor at the beginning of the input, which is annoying when there is input in the field. In theory you'd always want to put the cursor at the end so that the user can continue adding to the text that's already there.
Here's a snippet that will set the cursor to the end of existing input:
cmInstance.focus();
// Set the cursor at the end of existing content
cmInstance.setCursor(cmInstance.lineCount(), 0);
You would think that there would be a method which would accomplish this task, or even have focus set the cursor to the end of input by default if the instance has existing text. Anyways, this is the code that will put the cursor at the end of your CodeMirror input instance!
![39 Shirts – Leaving Mozilla]()
In 2001 I had just graduated from a small town high school and headed off to a small town college. I found myself in the quaint computer lab where the substandard computers featured two browsers: Internet Explorer and Mozilla. It was this lab where I fell...
![Create a CSS Flipping Animation]()
CSS animations are a lot of fun; the beauty of them is that through many simple properties, you can create anything from an elegant fade in to a WTF-Pixar-would-be-proud effect. One CSS effect somewhere in between is the CSS flip effect, whereby there's...
![Create a Dojo-Powered WordPress Website View]()
Yesterday I showed you WordPress' awesome JSON plugin named JSON API. Now that I can get my blog posts in JSON format, it's time to create an awesome AJAX'ed web app with that data. I've chosen to use the power of Dojo and Dijit to...
![CSS Columns]()
One major gripe that we've always had about CSS is that creating layouts seems to be more difficult than it should be. We have, of course, adapted and mastered the techniques for creating layouts, but there's no shaking the feeling that there should be a...
HI David,
I was able to set cursor at end of the code mirror lines on tab with your code, but after that i want to get out of code mirror window and should move focus to next button.With above code, not able to get focus out of code mirror, can you suggest a way to do that? Thanks.
This is how i am writing it, also set tabindex=0 for next button available.
_editor.setOption('extraKeys', { Tab(cm) { cm.focus(); cm.setCursor(cm.lineCount(), 0); }, });