c# - How do I show a HTML editor in an ASP.NET MVC 4 page -

i have been working on mvc app. use @html.editorfor(model => model.textfield) display textbox.

now want use wysiwyg html editor instead don't know how incorporate razor view. have field set allow html in model.

any advice appreciated.

if want use tinymce can this:

the model

public class editormodel {       [uihint("tinymce_full"), allowhtml]     public string textfield { get; set; } } 

the template under shared -> editortemplates

@* don't forget reference jquery library here, inside view or layout. <script src="@url.content("~/scripts/jquery-x.x.x.min.js")" type="text/javascript"></script> *@  <script src="@url.content("~/scripts/tinymce/jquery.tinymce.js")" type="text/javascript"></script>  <script type="text/javascript">      (function () {          $(function () {              $('#@viewdata.templateinfo.getfullhtmlfieldname(string.empty)').tinymce({                  // location of tinymce script                 script_url: '@url.content("~/scripts/tinymce/tiny_mce.js")',                 theme: "advanced",                  height: "500",                 width: "500",                 verify_html: false,                 plugins: "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist", //,autosave                  // theme options                 theme_advanced_buttons1: "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",                 theme_advanced_buttons2: "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",                 theme_advanced_buttons3: "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",                 theme_advanced_buttons4: "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak,restoredraft,codehighlighting,netadvimage",                 theme_advanced_toolbar_location: "top",                 theme_advanced_toolbar_align: "left",                 theme_advanced_statusbar_location: "bottom",                 theme_advanced_resizing: false,                  // example content css (should site css)                 //            content_css : "@url.content("~/content/style.css")",                 convert_urls: false,                  // drop lists link/image/media/template dialogs                 template_external_list_url: "lists/template_list.js",                 external_link_list_url: "lists/link_list.js",                 external_image_list_url: "lists/image_list.js",                 media_external_list_url: "lists/media_list.js",                  valid_elements: "@@[span]"             });          });      })();  </script>  @html.textarea(string.empty, /* name suffix */     viewdata.templateinfo.formattedmodelvalue /* initial value */ ) 

view implementation

@html.editorfor(m=>m.textfield)