Adventures with ASP.NET MVC: EasyMDE

For my jQuery projects, I have started using plugin easyMDE as my defacto Markdown Editor https://github.com/Ionaru/easy-markdown-editor, which is a fork of simpleMDE located at https://github.com/sparksuite/simplemde-markdown-editor – which hasn’t been updated in over two years.

For my latest project, I was able to get easyMDE easily implemented in my ASP.NET MVC application on a Create operation, but the Edit operation didn’t render the text correctly.

My solution was to include a hidden element for the field I wanted to update.

<input asp-for="Description" type="hidden">

Then in my scripts section, I take what is in the hidden element and populate easyMDE with this value.

@section Scripts { 
  <script> 
      var easyMDE = new EasyMDE(); 

      easyMDE.value(document.getElementById("Description").value); 

      document.getElementById("save-button").addEventListener("click", onSaveButtonClick); 

      function onSaveButtonClick() { 
         document.getElementById("Description").value = easyMDE.value(); 
      } 
  </script> 
}

You can also see how I am updating the value of Subscription on the save operation, which fires with the Save button is clicked.