CODEWITHSUNDEEP
javascriptcsscodemirror
user5191605
user5191605

Reputation:

codemirror can't type to the editor

The problem is that after initialising codemirror plugin i cannot type to the editor if textatea in css is set as display:none;, these are the steps i follow:

a) create and append textarea element:

var txt = document.createElement('TEXTAREA');
document.body.appendChild(txt);

b) initialise codemirror plugin:

var html_edit = CodeMirror.fromTextArea(txt, {
    mode: 'htmlmixed'
});

At that point if textarea is untouched in css i can type to the editor, however is i do this:

textarea {
    display:none;
}

cursor is blinking in editor but i cannot type to the editor.

I am setting textarea to display:none in css because before codemirror scripts are downloaded and initialised user can see for second textarea element which doesnt look very good. However it creates above problem, maybe someone has dealt with similiar situation, how to solve it?

Upvotes: 0

Views: 1902

Answers (1)

Marijn
Marijn

Reputation: 8929

CodeMirror focuses a hidden textarea to handle user input. Your rule will match that element and set it to display none, which means it can not be focused, and thus, you can't focus your CodeMirror instance.

Use a more specific CSS selector, for example by adding a class to your textarea, to so that you only hide the textarea that you created.

Upvotes: 2

Related Questions