tacos_tacos_tacos
tacos_tacos_tacos

Reputation: 10585

insertText into a CKEditor through Code Behind

I am trying to get CKEditor.NET to insert some text into my CKEditor when the page loads.

    Private Sub CKEditor_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles myCKEditor.Load

        Dim insertScript As String
        insertScript = "<script type=""text/javascript"">window.CKEDITOR.instances.myWidget_myCKEditor.insertText(""test"");</script>"

        Dim cManager As ClientScriptManager = Parent.Page.ClientScript

        cManager.RegisterStartupScript(Me.GetType, "insertText", insertScript)

    End Sub

My page is organized as follows:

I am getting the following error:

TypeError: Cannot read property 'instances' of undefined

It appears that CKEDITOR is not around when this is called. If I open up the JS console and run the insertScript it works as desired.

I have tried attaching this routine to MyBase.Load and Me.Load as well to no avail, and even tried using window.Load = insertScript, all of which produce the same error.

I noticed that no matter what I do, the last thing in the source is the script that initializes CKEditor, ie

....
<script type="text/javascript">window.CKEDITOR.instances.myWidget_myCKEditor.insertText("test");</script>
<script type="text/javascript">
//<![CDATA[
window.CKEDITOR_BASEPATH = '/ckeditor/';
//]]>
</script>
<script src="/ckeditor/ckeditor.js?t=C6HH5UF" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var CKEditor_Controls=[],CKEditor_Init=[];function CKEditor_TextBoxEncode(d,e){var f;if(typeof CKEDITOR=='undefined'||typeof CKEDITOR.instances[d]=='undefined'){f=document.getElementById(d);if(f)f.value=f.value.replace(/</g,'&lt;').replace(/>/g,'&gt;');}else{var g=CKEDITOR.instances[d];if(e&&(typeof Page_BlockSubmit=='undefined'||!Page_BlockSubmit)){g.destroy();f=document.getElementById(d);if(f)f.style.visibility='hidden';}else g.updateElement();}};(function(){if(typeof CKEDITOR!='undefined'){var d=document.getElementById('myWidget_myCKEditor');if(d)d.style.visibility='hidden';}var e=function(){var f=CKEditor_Controls,g=CKEditor_Init,h=window.pageLoad,i=function(){for(var j=f.length;j--;){var k=document.getElementById(f[j]);if(k&&k.value&&(k.value.indexOf('<')==-1||k.value.indexOf('>')==-1))k.value=k.value.replace(/&lt;/g,'<').replace(/&gt;/g,'>').replace(/&amp;/g,'&');}if(typeof CKEDITOR!='undefined')for(var j=0;j<g.length;j++)g[j].call(this);};window.pageLoad=function(j,k){if(k.get_isPartialLoad())setTimeout(i,0);if(h&&typeof h=='function')h.call(this,j,k);};if(typeof Page_ClientValidate=='function'&&typeof CKEDITOR!='undefined')Page_ClientValidate=CKEDITOR.tools.override(Page_ClientValidate,function(j){return function(){for(var k in CKEDITOR.instances){if(document.getElementById(k))CKEDITOR.instances[k].updateElement();}return j.apply(this,arguments);};});setTimeout(i,0);};if(typeof Sys!='undefined'&&typeof Sys.Application!='undefined')Sys.Application.add_load(e);if(window.addEventListener)window.addEventListener('load',e,false);else if(window.attachEvent)window.attachEvent('onload',e);})();CKEditor_Controls.push('myWidget_myCKEditor');
CKEditor_Init.push(function(){if(typeof CKEDITOR.instances['myWidget_myCKEditor']!='undefined' || !document.getElementById('myWidget_myCKEditor')) return;CKEDITOR.replace('myWidget_myCKEditor',{"htmlEncodeOutput" : true}); });
//]]>
</script>
</form>
 ....

All the evidence suggests that I am invoking the startup script at the wrong time, but I don't know when the "right time" to invoke it is.

Upvotes: 2

Views: 1337

Answers (2)

tacos_tacos_tacos
tacos_tacos_tacos

Reputation: 10585

Kind of a cop-out, but I ended up loading what I needed to insert on the page load and defining the script in the .ascx file.

In my myWidget.ascx:

<script type="text/javascript">
    function ddChange(obj) {
        window.CKEDITOR.instances.myWidget_myCKEditor.insertText(obj.value);
        document.getElementById("myWidget_myCannedPicker").selectedIndex = 0;  
    }
</script>
...
<asp:DropDownList ID="myCannedPicker" Width="400" runat="server" AutoPostBack="false" OnChange="ddChange(this)" /></span></td>

In myWidget.ascx.vb:

    Private Sub fillInitialValues()

        ...
        myCannedPicker.DataSource = dt
        myCannedPicker.DataValueField = "msg_text"
        myCannedPicker.DataTextField = "msg_name"
        myCannedPicker.DataBind()
        myCannedPicker.Items.Insert(0, New ListItem("Please make a selection:", "0"))

    End Sub

Doesn't really answer to the original question, but it was a suitable workaround in my case.

Upvotes: 0

Ratna
Ratna

Reputation: 2319

Yoy can use jquery windows.ready function as below

insertScript = "<script type=""text/javascript"">   <script language="javascript">
        $(document).ready(function() {
           window.CKEDITOR.instances.myWidget_myCKEditor.insertText('test');
            })
        })
</script> ";

    Dim cManager As ClientScriptManager = Parent.Page.ClientScript

    cManager.RegisterStartupScript(Me.GetType, "insertText", insertScript) 

It will make sure your javascript fires only when document get ready and not b4 that.

Upvotes: 2

Related Questions