Question

Not sure if this is an actual problem per se but I’m using Epic Editor to input and save markdown in my GAE application (webpy with mako as the templating engine).

I’ve got a hidden input element in the form which gets populated by the EpicEditor’s content when I submit the form but all the white spaces are replaced by  . Is this an intended feature? If I check the same code on the EpicEditor site, it clearly returns spaces instead of   so what’s different about mine?

<form>
<!-- form elements -->
<input id="content" name="content" type="hidden" value></input>
<div id="epiceditor"></div>
<button type="submit" name="submit" id="submit">submit</button>
</form>

<script type="text/javascript">
    $('button#submit').click(function(){
        var content = editor.getElement('editor').body.innerHTML; //all the spaces are returned as &nbsp; and breaks are <br>
        $('input#content').html(content);
    });
</script>

NOTE: I want to save my content as markdown in a TextProperty field my data store and generate the html tags when I retrieve it using marked.js

Answer 1

I’m the creator of EpicEditor. You shouldn’t be getting the innerHTML. EpicEditor does nothing to the innerHTML as you write. The text and code you are seeing will be different between all the browsers and it’s how contenteditable fields work. For example, some browsers insert UTF-8 characters for spaces some &nbsp.

EpicEditor gives you methods to normalize the text tho. You shouldn’t ever be trying to parse the text manually.

$('button#submit').click(function(){
    var content = editor.exportFile();
    $('input#content').html(content);
});

More details on exportFile: http://epiceditor.com/#exportfilefilenametype

P.S. You don’t need to do input#content. Thats the same as just #content 🙂