Using CodeMirror. I cannot get the getCursor() function to work. I have a jsFiddle with codemirror sources attached.
----> see here JSfiddle <----
I'm trying to insert text into the editor, then force the cursor to move back a specified number of spaces. I'm just trying to get the cursor location with getCursor() but I can't seem to get it to work. Any thoughts?
$(document).ready(function() {
//Changing the textarea to a CodeMirror rich text editor
var editor = CodeMirror.fromTextArea(document.getElementById('theZone'), {
mode: 'text/html',
lineWrapping : true,
lineNumbers : true,
extraKeys : {
"Tab": "indentMore",
"Shift-Tab": "indentLess",
"'>'": function(cm) { cm.closeTag(cm, '>'); },
"'/'": function(cm) { cm.closeTag(cm, '/'); }
} ,
onCursorActivity: function(cm) {
cm.setLineClass(hlLine, null, null);
hlLine = cm.setLineClass(cm.getCursor().line, null, "activeline");
}
});
//When SELECT changes - insert the value into the CM editor, set focus, get cursor position, move cursor back [x] amount of spaces.
$('#sel').change(function() {
var selected = $(this).find('option:selected');
var mynum = selected.data('val');
editor.replaceSelection($(this).val(), focus);
editor.focus();
var start_cursor = editor.getCursor(); //I need to get the cursor position
alert(start_cursor); //Cursor position always es up [object Object]
//write code to move cursor back [x] amount of spaces. [x] is the data-val value.
});
});
Using CodeMirror. I cannot get the getCursor() function to work. I have a jsFiddle with codemirror sources attached.
----> see here JSfiddle <----
I'm trying to insert text into the editor, then force the cursor to move back a specified number of spaces. I'm just trying to get the cursor location with getCursor() but I can't seem to get it to work. Any thoughts?
$(document).ready(function() {
//Changing the textarea to a CodeMirror rich text editor
var editor = CodeMirror.fromTextArea(document.getElementById('theZone'), {
mode: 'text/html',
lineWrapping : true,
lineNumbers : true,
extraKeys : {
"Tab": "indentMore",
"Shift-Tab": "indentLess",
"'>'": function(cm) { cm.closeTag(cm, '>'); },
"'/'": function(cm) { cm.closeTag(cm, '/'); }
} ,
onCursorActivity: function(cm) {
cm.setLineClass(hlLine, null, null);
hlLine = cm.setLineClass(cm.getCursor().line, null, "activeline");
}
});
//When SELECT changes - insert the value into the CM editor, set focus, get cursor position, move cursor back [x] amount of spaces.
$('#sel').change(function() {
var selected = $(this).find('option:selected');
var mynum = selected.data('val');
editor.replaceSelection($(this).val(), focus);
editor.focus();
var start_cursor = editor.getCursor(); //I need to get the cursor position
alert(start_cursor); //Cursor position always es up [object Object]
//write code to move cursor back [x] amount of spaces. [x] is the data-val value.
});
});
Share
Improve this question
asked Jul 18, 2013 at 16:33
SanyaSanya
1,2805 gold badges22 silver badges51 bronze badges
2 Answers
Reset to default 6The code seems to work just fine. alert() will not display objects. use console.log() instead. I added the rest of the code.
$('#sel').change(function() {
var selected = $(this).find('option:selected');
var mynum = selected.data('val');
editor.replaceSelection($(this).val(), focus);
editor.focus();
var start_cursor = editor.getCursor(); //I need to get the cursor position
console.log(start_cursor); //Cursor position
var cursorLine = start_cursor.line;
var cursorCh = start_cursor.ch;
//Code to move cursor back [x] amount of spaces. [x] is the data-val value.
editor.setCursor({line: cursorLine , ch : cursorCh -mynum });
});
The onCursorActivity
was not working for me.
This is what worked for me:
let myCodeMirror = CodeMirror.fromTextArea(myTextArea, {
lineNumbers: true,
});
CodeMirror.on(myCodeMirror, "cursorActivity", (instance, obj)=>{
console.log(instance.doc.getCursor())
}
This will log an object every time the cursor changes it's position which contains line
number and a ch
number.