CODEWITHSUNDEEP
javascriptasp.net-mvc-2templates
Oleg Sh
Oleg Sh

Reputation: 9013

ASP.NET MVC Template problem

I try to create template and this template should be from 1 element - textarea, but this textarea should be extended to TinyMCE control. I try to do it via following ascx control:

<textarea id="SubComment" name="SubComment" style="width: 80%">
<% = Html.Encode(ViewData.TemplateInfo.FormattedModelValue) %></textarea>
   <script type="text/javascript" src="/Scripts/jquery-1.3.2.min.js"></script>
   <script type="text/javascript">
        tinyMCE.init({
            // General options
            mode: "textareas",
            theme: "advanced",
            plugins: "spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,nonbreaking,xhtmlxtras,template,imagemanager,videoupload",

            // Theme options
            theme_advanced_buttons1: <% = txtAdvButtons %>,
            theme_advanced_buttons2: "tablecontrols",
            theme_advanced_buttons3: "",
            theme_advanced_toolbar_location: "top",
            theme_advanced_toolbar_align: "left",
            theme_advanced_statusbar_location: "",
            theme_advanced_resizing: true,
            onchange_callback: "changed",

            // Example content CSS (should be your site CSS)
            content_css: "css/example.css",

            // Drop lists for link/image/media/template dialogs
            template_external_list_url: "js/template_list.js",
            external_link_list_url: "js/link_list.js",
            external_image_list_url: "js/image_list.js",
            media_external_list_url: "js/media_list.js",

            // Replace values for the template plugin
            template_replace_values: {
                username: "Some User",
                staffid: "991234"
            },

            setup: function(editor) {
                editor.addButton('myupload', {
                    title: 'Insert image',
                    image: '/tiny_mce/plugins/imagemanager/pages/im/img/insertimage.gif',
                    onclick: function() {
                        mcImageManager.upload({
                            path: '{0}',
                            onupload: function(info) {
                                var i, html = '';

                                for (i = 0; i < info.files.length; i++)
                                    html += '<img src="' + info.files[i].url + '" />';

                                editor.execCommand('mceInsertContent', false, html);
                            }
                        });
                    }
                });
            }

        });
</script>

but when I try to use this template I see simple textarea. How to apply this javascript extention (it works correctly out of ascx control)? Thanks

Upvotes: 0

Views: 295

Answers (1)

John Kalberer
John Kalberer

Reputation: 5790

So I read up on the documentation for tinyMCE and it turns out that the code you posted there should be placed in the Head tag or another script file.

Change your textarea to this:

<textarea name="SubComment" class="tinyMCETextArea" style="width: 80%">

And in your tinyMCE initialization code:

$(function(){
    tinyMCE.init({
        /// all your options
        editor_selector: "tinyMCETextArea",
        /// More stuff
    });
});

Upvotes: 1

Related Questions