ASP.NET MVC View - Problem with FCKEditor

Question

Hi,

I got another problem with the FCKEditor within ASP.NET MVC. Please review the code below

<script type="text/javascript">
            var sBasePath = 'http://localhost:2170/Content/fckeditor/'; 
            var oFCKeditor = new FCKeditor('FCKeditor1');
            oFCKeditor.BasePath = sBasePath;
            oFCKeditor.Height = 300;
            oFCKeditor.Create();
            var timer;

            function ShowContent() {
                var oEditor = FCKeditorAPI.GetInstance('FCKeditor1');
                if (oEditor != undefined) {
                    var ContentText = '<%= Model.Article.ContentText %>';

                    oEditor.SetHTML(ContentText)
                    clearTimeout(timer);
                }
                else {
                    timer = setTimeout("ShowContent()", 1000);
                }
            }
            timer = setTimeout("ShowContent()", 1000);

        </script>

as you can see, the first problem is I have to hardcode the BasePath value, if I set the BasePath to a relative path like Content/fckeditor, then it will look for FCKEditor in http://localhost:2170/Article/Content/fckeditor which will lead to 404 error. Although, it still work fine with absolute path, I have to change these path when deloy into production server.

The second problem is binding value to fckeditor, as the fckeditor only available after the page if fully loaded, I can not directly use SetHTML method when creating fckeditor, because at the moment, the oEditor object is undefined. Instead, I have to use setTimeout function to repeatly check the oEditor object until it is available, and then bind content to it.

I don't know if are there any other ways to solve the two problem above ?

Answer 1

For the first problem, use this:

<%= ResolveUrl("~/Content/fckeditor") %>

Answer 2

Doesn't FCK use the value of the textarea you apply it to to set the content? You shouldn't need to populate it from JavaScript, just set the value from your model in the Html.TextArea call.

Answer 3

Firstly, I'd do all of that work when the page has finished loading (by using the window onload event). This will ensure all the controls have been created and are available to use, secondly set the base path by using the Url.Content method:

var sBasePath = '<%= Url.Content ("~/Content/fckeditor/") %>';

That way, it won't matter where the application is running (http://localhost:PORT or http://dev.someplace.com etc).