Using a Rich Text Editor with Dynamic Data

In the following post I will outline how to use the FCKeditor in a Dynamic Data project.  Using the FCKeditor is straight forward especially if you use the .NET FCKeditor control.

Steps:

  1. Read the liscensing and terms of use for the FCKeditor
  2. Download the FCKeditor .Net control, dll, and add a reference
  3. Download the FCKeditor fckeditor dir and all sub dirs/files...place these in the root dir of your Dyanamic Data project
  4. In your dynamic data project, in the Field Templates directory, Add new item -> Dynamic Data Field
  5. Delete the FCkEditor.ascx as we will only be using the control for editing
  6. In FCKeditor_Edit.ascx, remove all of the controls, then add

    <%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
    <FCKeditorV2:FCKeditor ID="TextBox1" Value='<%# FieldValueEditString %>' runat="server"></FCKeditorV2:FCKeditor>
  7. In the code behind, you want to end up with the below (you will want to modify to add your own trickery...)

    protected void Page_Load(object sender, EventArgs e) {

    }

    protected override void ExtractValues(IOrderedDictionary dictionary) {

         dictionary[Column.Name] = ConvertEditedValue(TextBox1.Value);

    }

    public override Control DataControl {

         get { 

              return TextBox1;

         }

    }

  8. Now, create a partial class in the same namespace as your dbml (LINQ) classes...I will be using the FCKeditor for text areas for my LINQ class "AttempPending"

    *Important thing to note is that the UIHint needs to be the name of your user control (minus the _Edit)...for this example, my user control is named "FCKeditor_Edit.ascx"

    [MetadataType(typeof(AttemptPending_Meta))]

    partial class AttemptPending {

         public class AttemptPending_Meta {           

              [UIHint(
    "FCKeditor")]
             
    public object DescriptionLong { get; set; }
         }
    }

    The net result of the above is that when you use a DynamicData field that binds to the Property DescriptionLong, it will render with the FCKeditor

  9. In the page that you would like the FCKeditor, you would add the following (In my case, this is within a DeatilsView)

    <asp:DynamicField DataField="DescriptionLong" HeaderText="Description Long" />  

    And that should result in the FCKeditor appear on your page...

Comments (1) -

  • Thanks for the code, i appreciate you sharing this.

Pingbacks and trackbacks (1)+

Add comment