Alright, a little backstory, I wanna create a little python code runner for my little brother as he doesn't wanna use any IDE's or anything so I made a simple little website (using python, the language this is for), now I know the pythons fine as everything works but I was starting to put in CodeMirror as the code editor, everything was working perfectly and I added a <nav> element above the editor, and added a run button (I know how to do all that, it's the editor that's the issue) now every time i ran it with that button above it, it refused to show the code that I put in it, the .value of it is set correctly, but it doesn't show anything, it just shows this:
now that is very annoying, as you can see I moved the buttons to the left side as it looked better IMO, but it just won't show anything, and I tried removing the button that started all this in the first place but it still won't show any code, I am using CDN to get the script and css:
<!-- HEAD -->
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.54.0/codemirror.min.css'>
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.54.0/theme/shadowfox.min.css'>
<!-- END -->
<!-- BODY -->
<script src='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.54.0/codemirror.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.54.0/mode/python/python.min.js'></script>
<!-- END -->
The script elements are below any html content and above my script, and the css files are below my css file (which doesn't affect the editor) and at the bottom of the head, the following code is the JS I use to initialize the editor:
// At top of file
var PythonEditor = CodeMirror.fromTextArea(document.getElementById("code-editor"), {
mode: "python",
theme: "shadowfox",
lineNumbers: true,
indentWithTabs: true,
indentUnit: 4,
scrollbarStyle: null
});
// This is in a function that runs when it gets the template code to put in it (it's valid python)
PythonEditor.value = data.Code;
setTimeout(function() {
PythonEditor.refresh();
},1);
/* data.Code is set to this:
# This will print "Hello World!" to the console
print("Hello World!")
*/
Now the editor works perfectly, i can write the code just fine, no issues there, but it just will not put the code in it, even if I run the following from the web console it does nothing
// Just setting the value returns the string
PythonEditor.value = "# Hello there";
setTimeout(function() {
PythonEditor.refresh(); // Just running this returns 'undefined'
},1);
// Running all that at once returns '12'
I am really confused, I may be making a rookie mistake as I haven't used HTML, CSS, and JavaScript in awhile, so please point it out if I am doing something wrong (even if it doesn't fix the issue, I love constructive criticism)
Thank you for reading
