By default, the requiredfield validator control will not work properly when it is used with a textarea that is configured with CKEditor 4.3.3. This is due to the fact that, the CKEditor content will not be synched to the page element(textarea) properly when the validator control fires.
To get past the validator control even if I have content in the text box, I have to submit the form twice.
How can I overcome this difficulty? Does anyone have any code that they can share?
I have the following block of code in my form which defines the asp textbox in question:
<asp:UpdatePanel ID="UPNL_Editor" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:RequiredFieldValidator ID="rfvBody" ControlToValidate="HTMLEditorBody" Display="Dynamic" Text="(!)" ErrorMessage="Please enter the body text.." runat="server" Font-Bold="true" Enabled="false" ForeColor="Red" /> <asp:TextBox ID="HTMLEditorBody" TextMode="MultiLine" runat="server" Height="300" Width="100%" Columns="50" Rows="20" CausesValidation="true"></asp:TextBox> <script> //Replace the <textbox id="HTMLEditorBody"> with a CKEditor instance, using the default configuration. PCG. 05132014. CKEDITOR.replace('<% = HTMLEditorBody.ClientID %>'); CKEDITOR.config.height = 500; //This will force the height of the CKEditor window to match the height of the HTMLEditorBody asp Textbox. PCG. 07142017. </script> </ContentTemplate> </asp:UpdatePanel>
NOTE: This is now resolved.
Success. Finally.
Added this at the top of the page within a script tag:
//11052014. PCG. Force auto update on any CKEditor content. CKEDITOR.on('instanceReady', function(){ $.each( CKEDITOR.instances, function(instance) { CKEDITOR.instances[instance].on("change", function(e) { for ( instance in CKEDITOR.instances ) CKEDITOR.instances[instance].updateElement(); }); }); });
No errors at all now.