Editor User Control with Ajax

[Marc]

Hi,

I have a problem trying to get the contents of a RadEditor located inside a User control through AJAX. The main page has a Radstrip with a multipage and each pageview has attached an instance of the User control with the editor and a button.

When the User control is created from code behind, some default contents are set from the main page to the Editor and it's working properly. But, if we change that text and we call a postback with AJAX, I cannot get the new value.

I am not sure how to proceed to get new values...

thanks.

The User Control:

<telerik:RadEditor ID="RadEditor1" runat="server" Width="100%" BorderStyle="None" EditModes="Design" ContentAreaCssFile="~/css/EditorContentArea.css" ContentAreaMode="iframe">
    <CssFiles>
        <telerik:EditorCssFile Value="~/css/EditorContentArea.css" />
    </CssFiles>
    <Tools>
        <telerik:EditorToolGroup Tag="MainToolbar">
            <telerik:EditorTool Name="AjaxSpellCheck" />
            <telerik:EditorTool Name="FindAndReplace" />
            <telerik:EditorSeparator />
            <telerik:EditorSplitButton Name="Undo">
            </telerik:EditorSplitButton>
            <telerik:EditorSplitButton Name="Redo">
            </telerik:EditorSplitButton>
            <telerik:EditorSeparator />
            <telerik:EditorTool Name="Cut" />
            <telerik:EditorTool Name="Copy" />
            <telerik:EditorTool Name="Paste" ShortCut="CTRL+V" />
        </telerik:EditorToolGroup>
        <telerik:EditorToolGroup Tag="Formatting">
            <telerik:EditorTool Name="Bold" />
            <telerik:EditorTool Name="Italic" />
            <telerik:EditorTool Name="Underline" />
            <telerik:EditorSeparator />
            <telerik:EditorSplitButton Name="ForeColor">
            </telerik:EditorSplitButton>
            <telerik:EditorSplitButton Name="BackColor">
            </telerik:EditorSplitButton>
            <telerik:EditorSeparator />
            <telerik:EditorDropDown Name="FontName">
            </telerik:EditorDropDown>
            <telerik:EditorDropDown Name="RealFontSize">
            </telerik:EditorDropDown>
        </telerik:EditorToolGroup>
    </Tools>
    <Content>
</Content>
</telerik:RadEditor>
<div style="float:left;">
<telerik:RadSpell ID="RadSpell1" runat="server" ControlToCheck="RadEditor1" ButtonType="PushButton" AllowAddCustom="true" CssClass="floatL" />
<telerik:RadButton ID="RadButton1" runat="server" Text="Save" Height="22px" />
</div>

User Control Code behind:

Imports Telerik.Web.UI

Public Delegate Sub RadButton1_Click(sender As Object, e As System.EventArgs)

Public Class productAttributesEditor
    Inherits System.Web.UI.UserControl
    Public Event SaveClick As RadButton1_Click

    Public singleLang As String

    Public Property RadEditor() As RadEditor
        Get
            Return RadEditor1
        End Get
        Set(value As RadEditor)
            RadEditor1 = value
        End Set
    End Property

    Public Property SpellSingleLanguage() As String
        Get
            Return singleLang
        End Get

        Set(value As String)
            singleLang = value
        End Set
    End Property

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not Page.IsPostBack Then
            RadEditor1.Modules.Clear()
            RadEditor1.Languages.Clear()
            RadEditor1.SpellCheckSettings.AllowAddCustom = True
            RadEditor1.SpellCheckSettings.SpellCheckProvider = SpellCheckProvider.PhoneticProvider

            If String.IsNullOrEmpty(singleLang) Then
                Using ctx As New MyLovelyFood_DynamicStocksEntities()
                    Dim langs = From a In ctx.aux_languageList Where a.Published = True And a.SpellEnabled = True Select a.LanguageCulture, a.Name, a.PrimaryLang Order By PrimaryLang
                    For Each row In langs
                        RadEditor1.Languages.Add(New SpellCheckerLanguage(row.LanguageCulture, row.Name))
                    Next
                End Using
            Else
                RadEditor1.SpellCheckSettings.DictionaryLanguage = singleLang
            End If
        End If
    End Sub

    Protected Sub RadButton1_Click(sender As Object, e As EventArgs) Handles RadButton1.Click
        RaiseEvent SaveClick(Me, e)
    End Sub
End Class

Default page:

    ' Prepare text editor
' For each Tab, create a new Editor...
    Private Sub RadTabStripIngredients_TabDataBound(sender As Object, e As RadTabStripEventArgs) Handles RadTabStripIngredients.TabDataBound
        Dim pageView As New RadPageView()
        pageView.ID = e.Tab.Value
        RadMultiPageIngredients.PageViews.Add(pageView)
    End Sub

    Private Sub RadMultiPageIngredients_PageViewCreated(sender As Object, e As RadMultiPageEventArgs) Handles RadMultiPageIngredients.PageViewCreated
        editorControl = LoadControl("~/common/AttributesEditor.ascx")
        editorControl.ID = e.PageView.ID & "_userControl"

        Using ctx As New DynamicStocksEntities()
            Dim langCulture = From a In ctx.aux_languageList Where a.Id = e.PageView.ID Select a.LanguageCulture
            editorControl.SpellSingleLanguage = langCulture.FirstOrDefault
        End Using

        e.PageView.Controls.Add(editorControl)
        AddHandler editorControl.SaveClick, AddressOf SaveEditor
    End Sub

    Private Sub SaveEditor(ByVal sender As Object, ByVal e As EventArgs)
        Dim editorObj As productAttributesEditor = TryCast(sender, Object)
        Dim content As String = TryCast(editorObj.RadEditor, RadEditor).Text
        MsgBox(content) ' >>>> ERROR, WE JUST RECEIVE THE INITIAL VALUE INSTEAD OF THE MODIFIED VERSION
        If Not String.IsNullOrEmpty(Trim(content)) Then
' DO SOMETHING
        End If
    End Sub

[Rumen]

Hi,

Set the UseSubmitBehavior="false" property to the RadButton control, e.g.

<telerik:RadButton ID="RadButton1" UseSubmitBehavior="false" runat="server" Text="Save" Height="22px" />

as suggested in the following KB article: RadEditor Content Not Saved After Ajax Update in IE9, Firefox, Google Chrome and Safari.

Kind regards,
Rumen
the Telerik team