Lately I have started using simpleMDE in my website, and I ran into a problem loading a local text file to my markdown editor, using a input button. I was also unable to delete the previous data and change it to "". I built my website using flask, and I am using flask simpleMDE to load simpleMDE to my website. my code:
hello.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Flask-SimpleMDE example</title>
{{ simplemde.css }}
{{ simplemde.js }}
</head>
<body>
<div>
<input type="file">
<textarea>
Some Markdown Text Here
</textarea>
</div>
<script>
let input = document.querySelector('input')
let textarea = document.querySelector('textarea')
// This event listener has been implemented to identify a
// Change in the input section of the html code
// It will be triggered when a file is chosen.
input.addEventListener('change', () => {
let files = input.files;
if (files.length == 0) return;
/* If any further modifications have to be made on the
Extracted text. The text can be accessed using the
file variable. But since this is const, it is a read
only variable, hence immutable. To make any changes,
changing const to var, here and In the reader.onload
function would be advisible */
const file = files[0];
let reader = new FileReader();
reader.onload = (e) => {
const file = e.target.result;
// This is a regular expression to identify carriage
// Returns and line breaks
const lines = file.split(/\r\n|\n/);
textarea.value = lines.join('\n');
};
reader.onerror = (e) => alert(e.target.error.name);
reader.readAsText(file);
});
var simplemde = new SimpleMDE({
autofocus: true,
autosave: {
enabled: true,
uniqueId: "MyUniqueID",
delay: 1000,
},
});
</script>
</body>
</html>
my app:
from flask import Flask, render_template,request
from flask_simplemde import SimpleMDE
app = Flask(__name__)
app.config['SIMPLEMDE_JS_IIFE'] = True
app.config['SIMPLEMDE_USE_CDN'] = True
SimpleMDE(app)
@app.route('/')
def hello():
return render_template('hello.html')
if __name__ == '__main__':
app.run(debug=True)
When I try running the file without the flask, I obviously can't see the simplemde but seeing the textarea and able to load a text file into it using the input button, and when running the flask app I am able to see the simpleMDE but unable to load a text file into it.
any suggestings?