CKEditor integration in ASP.NET MVC 2?

I want to use CKEditor for the comment field in my ASP.NET MVC 2 application, but cannot make it work. Here is what I have:

The text box where I am trying to integrate the editor:

<div class="editor-field"> <%: Html.TextAreaFor(model => model.Comment, new { @class = "textarea", @id="Editor1" })%> <%: Html.ValidationMessageFor(model => model.Comment) %> </div> 

Script links in the head:

 <asp:Content ID="Content3" ContentPlaceHolderID="head" runat="server"> <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <script src="../../Scripts/ckeditor/ckeditor.js" type="text/javascript"></script> <script src="../../Scripts/ckeditor/adapters/jquery.js" type="text/javascript"></script> </asp:Content> 

And the document ready function:

 <% using (Html.BeginForm()) {%> <script type="text/javascript"> $(document).ready(function () { $('#Editor1').ckeditor(); }); </script> 

(Etc ...) I do not know if the problem is related to the TextareaFor helper method, where I tried to set the id in Editor1. I'm also pretty new to MVC, so I figured it was how to do it.

In any case, this will not work, and I would appreciate any suggestions regarding what I am doing wrong.

+4
source share
2 answers

Well, I found the answer myself. It looks like there was a conflict on one page with another jQuery plugin, so I needed to use jQuery.noConflict (); and then use jQuery instead of $ in code. The noConflict accommodation is also important. See erhard's Comment on this web page: http://devoracles.com/jquery-error-documentready-is-not-a-function-sure

+1
source

first check if $('#Editor1') desired item.

 alert($('#Editor1').length); alert($('#Editor1')[0].id); 

if not, try using a class selector instead, like $('.ckeditor')

0
source

All Articles