FCKeditor 2.x/Developers Guide/FAQ/JavaScript - Revision history

Fredck at 11:27, 29 May 2008

2008-05-29T11:27:35Z

Fredck at 11:27, 29 May 2008

2008-05-29T11:27:15Z

Fredck: FCKeditor 2.x/Developers Guide/FAQ/JavaScirpt moved to FCKeditor 2.x/Developers Guide/FAQ/JavaScript: Fixed typo in the title.

2008-02-05T13:11:40Z

FCKeditor 2.x/Developers Guide/FAQ/JavaScirpt moved to FCKeditor 2.x/Developers Guide/FAQ/JavaScript: Fixed typo in the title.

W.olchawa at 16:44, 18 January 2008

2008-01-18T16:44:38Z

W.olchawa at 16:42, 18 January 2008

2008-01-18T16:42:25Z

W.olchawa at 16:34, 18 January 2008

2008-01-18T16:34:51Z

W.olchawa at 16:33, 18 January 2008

2008-01-18T16:33:22Z

W.olchawa: New page: == Frequently Asked Questions : JavaScript == * How do I apply a tabindex on the FCKeditor? * [[#changeContentHow do I dynamically change the content in the editor with Java...

2008-01-18T16:32:38Z

New page: == Frequently Asked Questions : JavaScript == * How do I apply a tabindex on the FCKeditor? * [[#changeContentHow do I dynamically change the content in the editor with Java...

New page

== Frequently Asked Questions : JavaScript ==

* [[#tabindex|How do I apply a tabindex on the FCKeditor?]]
* [[#changeContentHow do I dynamically change the content in the editor with JavaScript?]]
* [[#sethtmlnotworking|.SetHTML doesn't work! Why not?]]
* [[#javascriptParentHow do I call a javascript function on the page containing the editor from a plugin?]]
* [[#OnkeyEvent|How do I capture an onkey event within FCKeditor?]]

=== <span id="tabindex">How do I apply a tabindex on the FCKeditor?</span> ===

@@ Line 11: / Line 11: @@
 <pre>function getEditorValue( instanceName )
+{
-// Get the editor instance that we want to interact with.
+    // Get the editor instance that we want to interact with.
-var oEditor = FCKeditorAPI.GetInstance( instanceName )&nbsp;;
+    var oEditor = FCKeditorAPI.GetInstance( instanceName )&nbsp;;
-// Get the editor contents as XHTML.
+    // Get the editor contents as XHTML.
-return oEditor.GetXHTML( true )&nbsp;; // "true" means you want it formatted.
+    return oEditor.GetXHTML( true )&nbsp;; // "true" means you want it formatted.
+}
 function setEditorValue( instanceName, text )
+{
-// Get the editor instance that we want to interact with.
+    // Get the editor instance that we want to interact with.
-var oEditor = FCKeditorAPI.GetInstance( instanceName )&nbsp;;
+    var oEditor = FCKeditorAPI.GetInstance( instanceName )&nbsp;;
-// Set the editor contents.
+    // Set the editor contents.
-oEditor.SetHTML( text )&nbsp;;
+    oEditor.SetHTML( text )&nbsp;;
+}
 </pre>
 === <span id="javascriptParent">How do I call a javascript function on the page containing the editor from a plugin?</span>  ===

@@ Line 1: / Line 1: @@
 __NOTOC__
-== Frequently Asked Questions&nbsp;: JavaScript ==
+== Frequently Asked Questions&nbsp;: JavaScript  ==
-* [[#tabindex|How do I apply a tabindex on the FCKeditor?]]
+*[[#changeContent|How do I dynamically change the content in the editor with JavaScript?]]
-* [[#changeContent|How do I dynamically change the content in the editor with JavaScript?]]
+*[[#javascriptParent|How do I call a javascript function on the page containing the editor from a plugin?]]
-* [[#sethtmlnotworking|.SetHTML doesn't work! Why not?]]
+*[[FCKeditor 2.x/Developers Guide/FAQ/JavaScirpt/OnkeyEvent|How do I capture an onkey event within FCKeditor?]]
-=== <span id="tabindex">How do I apply a tabindex on the FCKeditor?</span> ===
+=== <span id="changeContent">How do I dynamically change the content in the editor with JavaScript?</span>  ===
-By adding some Javascript:
+Just use the FCKeditor JavaScript API:
 <pre>function getEditorValue( instanceName )
+{
@@ Line 46: / Line 26: @@
 oEditor.SetHTML( text )&nbsp;;
+}
 </pre>
-=== <span id="sethtmlnotworking">.SetHTML doesn't work! Why not?</span> ===
+=== <span id="javascriptParent">How do I call a javascript function on the page containing the editor from a plugin?</span>  ===
 If you want to call a function contained in the page that instantiates the FCKeditor, you will need to add "parent." to the function name in the plugin.js.
 Let's say that in fun.html I have a function named "SetSelected". If I were writing a plugin for use on the fun.html page, and I wanted it to call the&nbsp;!SetSelected() function from plugin.js, I would simply have to add parent to it.
 E.g. '''parent'''.''SetSelected();'' Sometimes you may have nested the editor another level; just add another parent like: ''parent.parent.SetSelected();''

@@ Line 1: / Line 1: @@
-== Frequently Asked Questions : JavaScript ==
+__NOTOC__
 * [[#tabindex|How do I apply a tabindex on the FCKeditor?]]
@@ Line 5: / Line 6: @@
 * [[#sethtmlnotworking|.SetHTML doesn't work! Why not?]]
 * [[#javascriptParent|How do I call a javascript function on the page containing the editor from a plugin?]]
-* [[#OnkeyEvent|How do I capture an onkey event within FCKeditor?]]
+* [[FCKeditor 2.x/Developers Guide/FAQ/JavaScirpt/OnkeyEvent|How do I capture an onkey event within FCKeditor?]]
 === <span id="tabindex">How do I apply a tabindex on the FCKeditor?</span> ===
@@ Line 28: / Line 29: @@
 Just use the FCKeditor JavaScript API:
-<pre>
+<pre>function getEditorValue( instanceName )
+{
-  // Get the editor instance that we want to interact with.
+// Get the editor instance that we want to interact with.
-  var oEditor = FCKeditorAPI.GetInstance( instanceName ) ;
+var oEditor = FCKeditorAPI.GetInstance( instanceName )&nbsp;;
-  // Get the editor contents as XHTML.
+// Get the editor contents as XHTML.
-  return oEditor.GetXHTML( true ) ;  // "true" means you want it formatted.
+return oEditor.GetXHTML( true )&nbsp;; // "true" means you want it formatted.
+}
 function setEditorValue( instanceName, text )
+{
-  // Get the editor instance that we want to interact with.
+// Get the editor instance that we want to interact with.
-  var oEditor = FCKeditorAPI.GetInstance( instanceName ) ;
+var oEditor = FCKeditorAPI.GetInstance( instanceName )&nbsp;;
-  // Set the editor contents.
+// Set the editor contents.
-  oEditor.SetHTML( text ) ;
+oEditor.SetHTML( text )&nbsp;;
+}
 </pre>
 === <span id="sethtmlnotworking">.SetHTML doesn't work! Why not?</span> ===
 One possibility is that the argument passed to the .SetHTML function is of the javascript type 'object'. Then the .SetHTML function may not work. If necessary, you can convert an object to a string by calling .toString() on it. So:
-<pre>
+<pre>oEditor.SetHTML( yourObject.toString());
-oEditor.SetHTML( yourObject.toString());
+</pre>
 To find out the type of a given object, just call the typeof() function on it. So:
-<pre>
+<pre>typeof(yourObject);
-typeof(yourObject);
+</pre>
 You can find more samples on how to use the editor API in the "_samples/html/sample08.html" file.
@@ Line 64: / Line 61: @@
 If you want to call a function contained in the page that instantiates the FCKeditor, you will need to add "parent." to the function name in the plugin.js.
-Let's say that in fun.html I have a function named "SetSelected". If I were writing a plugin for use on the fun.html page, and I wanted it to call the !SetSelected() function from plugin.js, I would simply have to add parent to it.
+Let's say that in fun.html I have a function named "SetSelected". If I were writing a plugin for use on the fun.html page, and I wanted it to call the&nbsp;!SetSelected() function from plugin.js, I would simply have to add parent to it.
 E.g. '''parent'''.''SetSelected();'' Sometimes you may have nested the editor another level; just add another parent like: ''parent.parent.SetSelected();''

@@ Line 11: / Line 11: @@
 By adding some Javascript:
-On the field just before the FCKEditor: <input ... onKeyDown="focusIframeOnTab(this, "idOfYourFckEditorIframe", event);if(!document.all) return false;">
+On the field just before the FCKEditor: &lt;input ... onKeyDown="focusIframeOnTab(this, "idOfYourFckEditorIframe", event);if(!document.all) return false;"&gt;
 Use this function:
 <pre>
-function focusIframeOnTab(caller, tabTargetId, callEvent)
+function getEditorValue( instanceName )
+{
-    // If keypress TAB and not SHIFT+TAB
+  // Get the editor instance that we want to interact with.
-    if(callEvent.keyCode == 9 && !callEvent.shiftKey)
+  var oEditor = FCKeditorAPI.GetInstance( instanceName ) ;
-        document.getElementById(tabTargetId).contentWindow.focus();
+}
 </pre>
-((Please feel free to write to fredrik@demomusic.dot.nu for suggestions on improving this function. Verified to work in Firefox 1.5 and IE 6 on WinXP)
+=== <span id="sethtmlnotworking">.SetHTML doesn't work! Why not?</span> ===

← Older revision		Revision as of 16:34, 18 January 2008
Line 8:		Line 8:

	=== <span id="tabindex">How do I apply a tabindex on the FCKeditor?</span> ===		=== <span id="tabindex">How do I apply a tabindex on the FCKeditor?</span> ===
		+
		+	By adding some Javascript:
		+
		+	On the field just before the FCKEditor: <input ... onKeyDown="focusIframeOnTab(this, "idOfYourFckEditorIframe", event);if(!document.all) return false;">
		+
		+	Use this function:
		+	<pre>
		+	function focusIframeOnTab(caller, tabTargetId, callEvent)
		+	{
		+	// If keypress TAB and not SHIFT+TAB
		+	if(callEvent.keyCode == 9 && !callEvent.shiftKey)
		+	document.getElementById(tabTargetId).contentWindow.focus();
		+	}
		+	</pre>
		+	Remember that the id of the iframe should look like "identifier___Frame".
		+
		+	((Please feel free to write to fredrik@demomusic.dot.nu for suggestions on improving this function. Verified to work in Firefox 1.5 and IE 6 on WinXP)

← Older revision	Revision as of 13:11, 5 February 2008
(No difference)