0

I am trying to have multi-coloured textarea on my page. So basically I am planing have one textarea input and one <p> object. When user type in textarea, the <p> will be updated with jQuery, as soon as user type any letters in textarea.

Similar to Stackoverflow.

When the user finishes typing, he will select a text from the textarea and click the red or blue button. The system will read the selected text, find the index of starting text and append

 <span> style='color:red;'> 

at the end of the text add

 </span>

To be honest, I am not sure this is the best way to do it. I have seen lots of RichText editor but they don't have any save button.

Anyway. So far what I did:

<div class="row">
<a href="#" name="BtnRed" id="BtnRed" class="btn btn-danger">Red</a>
<a href="#" name="BtnBlue" id="BtnBlue" class="btn btn-primary">Blue</a>

<form asp-action="Save" method="post">
    <textarea rows="10" style="width:100%" id="DetailText" name="DetailText">
        This email and any files whom this email is addressed. &lt;span&gt; style='color:red;'>This suppose to be red&lt;/span&gt;  
        Any unauthorised use, retention, distribution, copying or disclosure is strictly prohibited.
        If you have received this email in error)
    </textarea>
</form>
<hr />
@Html.Raw("<p id='viewText'></ p >");

<script src="~/lib/jquery/dist/jquery.js"></script>
 <script>

$(document).ready(function () {
    $("#viewText").text($("#DetailText").val());
    $("#DetailText").on('input',function () {
        $("#viewText").text(   $("#DetailText").val());
    });        
});

ISSUE Html.Raw() doesn't complie the text and shows HTML code instead. style='color:red;'>This suppose to be red enter image description here

Jeroen
  • 1,168
  • 1
  • 12
  • 24
AliAzra
  • 889
  • 1
  • 9
  • 28
  • `Html.Raw` doesn't compile anything. It emits whatever you pass to it without escaping it. – Panagiotis Kanavos Dec 10 '19 at 10:19
  • 1
    Does this answer your question? [How does Html.Raw MVC helper work?](https://stackoverflow.com/questions/35105587/how-does-html-raw-mvc-helper-work) – Panagiotis Kanavos Dec 10 '19 at 10:20
  • 1
    Executing jQuery and emiting the resulting HTML is *NOT* trivial. It's not available out-of-the-box either. . Stackoverflow doesn't work that way anyway - it parses the Markdown text posted by users and renders it as HTML using a Markdown parser. – Panagiotis Kanavos Dec 10 '19 at 10:22

0 Answers0