My goal is to store form data in localStorage, but I'm facing an issue with rich text fields not saving their data. Regular HTML fields like textboxes work fine.
In my Razor markup for the field (using MVC), here is an example:
<div class="form-group">
@Html.LabelFor(model => model.Actions, htmlAttributes: new { @class = "control-label col-md-2" })
@Html.TextAreaFor(model => model.Actions, new { @class = "form-control", rows = "4" })
@Html.ValidationMessageFor(model => model.Actions, "", new { @class = "text-danger" })
</div>
The HTML generated by the above code snippet looks like this:
<div class="form-group">
<label class="control-label col-md-2" for="Actions">Actions</label>
<textarea class="form-control" cols="20" id="Actions" name="Actions" rows="4"></textarea>
<span class="field-validation-valid text-danger" data-valmsg-for="Actions" data-valmsg-replace="true"></span>
</div>
When it comes to saving and retrieving from localStorage, I use the following code snippet which works for other fields but not for rich text fields:
//save
localStorage.setItem('Actions', document.getElementById('Actions').value);
//restore
var Actions = localStorage.getItem('Actions');
document.getElementById('Actions').value = Actions;
I have tried using
document.getElementById('Actions').textContentlocalStorage object only shows limited text from my Actions field, unless using .textContent.
I suspect that the issue might be related to using Summernote for rich text functionality. However, I am unsure of what steps to take next as there are no errors reported in the console.