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!
![9 Mind-Blowing WebGL Demos]()
As much as developers now loathe Flash, we're still playing a bit of catch up to natively duplicate the animation capabilities that Adobe's old technology provided us. Of course we have canvas, an awesome technology, one which I highlighted 9 mind-blowing demos. Another technology available...
![CSS Animations Between Media Queries]()
CSS animations are right up there with sliced bread. CSS animations are efficient because they can be hardware accelerated, they require no JavaScript overhead, and they are composed of very little CSS code. Quite often we add CSS transforms to elements via CSS during...
![Morphing Elements Using MooTools and CSS]()
Morphing an element between CSS classes is another great trick the MooTools JavaScript library enables you to do. Morphing isn't the most practical use of MooTools, but it's still a trick at your disposal.
Step 1: The XHTML
The block of content that will change is...
![Full Width Textareas]()
Working with textarea widths can be painful if you want the textarea to span 100% width. Why painful? Because if the textarea's containing element has padding, your "width:100%" textarea will likely stretch outside of the parent container -- a frustrating prospect to say the least. Luckily...
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); }, });