CODEWITHSUNDEEP
asp.netasp.net-mvctinymce
Libor Zapletal
Libor Zapletal

Reputation: 14102

ASP.NET MVC Rich Text Editor not showing buttons

I have problem with implementing Rich Text Editor (all that i tried, e.g. TinyMCE). I tried many tutorials and articles but all same. When i am trying do it the best what i get is working editor in IE (8) but other browser not (Opera, FF, Chrome). Samples that i download work fine in all browsers. I am using VS2010 ASP.NET MVC2 and e.g. i tried this http://www.billsternberger.net/asp-net-mvc/tinymce-samples-with-asp-net-mvc/ Thanks for help

Upvotes: 0

Views: 1178

Answers (2)

Phil Strong
Phil Strong

Reputation: 1014

I used the following ViewUserControl 

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>
    <script type="text/javascript">

    // note that the editor text area must have an id of articleBody
    tinyMCE.init({
            elements: "articleBody",
            theme: "advanced",
            mode: "exact",
            height: "300",
            plugins: "safari,spellchecker,pagebreak,autosave,table,advimage,iespell,inlinepopups,paste,nonbreaking,template,fullscreen,paste",
            theme_advanced_buttons1: "bold,italic,underline,forecolor,|,undo,redo,|,link,unlink,pastetext,|,justifyleft,justifycenter,justifyright,|,blockquote,bullist,numlist",
            theme_advanced_buttons2: "",
            theme_advanced_buttons3: "",
            theme_advanced_toolbar_location: "top",
            theme_advanced_toolbar_align: "left"                             
        });
</script>

Note: that in Scripts/ there is a tiny_mce directory with the source /langs /plugins /themes /utils

To include it on my page:

<% Html.RenderPartial("Editor"); %>
<%= Html.TextAreaFor(model => model.Draft.Body, new { name = "content", @class = "text", id = "articleBody", style = "width:100%" })%>

You would place your TextArea wherever on the page you see fit and remember that it will expand to either the width of the total buttons you include or 100% of the wrapping div

Upvotes: 1

Aristos
Aristos

Reputation: 66641

Its is probably a problem finding the images.

Locate your theme css and edit all the background:url to show the path that you have place the img. 

background:url(img/button_bg.png)

for example, in every page that you use the TinyMCE, the img/button_bg.png must be found.

If you are in /MyDir/MyPage.aspx
and the file are on /themes/advanced/skin/default/img/buttons.png

there is not way to found the buttons from my page with the code url(img/button_bg.png)

Upvotes: 1

Related Questions