1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
7 <meta http-equiv="content-type" content="text/html; charset=undefined" />
8 <meta name="generator" content="JsDoc Toolkit" />
11 <title>JsDoc Reference - Roo.form.HtmlEditor</title>
14 <link rel="stylesheet" type="text/css" href="../../css/roojs.css" />
15 <link rel="stylesheet" type="text/css" href="../default.css" />
18 <script type="text/javascript" src="../page.js">
25 <body onload="RooDocsPage.onload();">
28 <div class="body-wrap">
30 <!-- ============================== links to methods. ================================= -->
32 <div class="top-tools">
34 <a class="inner-link" href="#Roo.form.HtmlEditor-props"><img src="resources/s.gif" class="item-icon icon-prop">Properties</a>
35 <a class="inner-link" href="#Roo.form.HtmlEditor-methods"><img src="resources/s.gif" class="item-icon icon-method">Methods</a>
36 <a class="inner-link" href="#Roo.form.HtmlEditor-events"><img src="resources/s.gif" class="item-icon icon-event">Events</a>
37 <a class="inner-link" href="#Roo.form.HtmlEditor-configs"><img src="resources/s.gif" class="item-icon icon-config">Config Options</a>
38 <a class="bookmark" href="NEED_TO_CREATE_DIRECT_LINK_HREF"><img src="resources/s.gif" class="item-icon icon-fav">Direct Link</a>
43 <!-- ============================== inheritance Block. ================================= -->
45 <div class="inheritance res-block">
46 <pre class="res-block-inner">Ext.form.Field
47 <img src="../../images/default/s.gif" height="1" width="20"/><img class="elbow" src="../../images/default/tree/elbow-end.gif"/>Roo.form.HtmlEditor
52 <!-- ============================== class title / details ============================ -->
55 <h1 class="classTitle">
57 Class Roo.form.HtmlEditor
60 <table cellspacing="0" class="class-summary-table">
62 <tr><td class="label">Package:</td><td class="hd-info">Roo.form</td></tr>
64 <tr><td class="label">Defined In:</td><td class="hd-info">
66 <a href="./src/Roo_form_HtmlEditor.js.html">Roo/form/HtmlEditor.js</a>.
69 <tr><td class="label">Class:</td><td class="hd-info">HtmlEditor</td></tr>
74 <tr><td class="label">Extends:</td><td class="hd-info">
83 <!-- ============================== class summary ========================== -->
84 <div class="description">
85 Provides a lightweight HTML Editor component.<br/><br/>This has been tested on Fireforx / Chrome.. IE may not be so great..<br/><br/><br><br><b>Note: The focus/blur and validation marking functionality inherited from Ext.form.Field is NOT<br/>supported by this editor.</b><br/><br/><br/>An Editor is a sensitive component that can't be used in all spots standard fields can be used. Putting an Editor within<br/>any element that has display set to 'none' can cause problems in Safari and Firefox.<br/><br/>
89 <!-- ============================== Class comment block... ========================== -->
91 <div class="comments">
92 <b>Class Comments / Notes</B> =>
93 <u onclick="parent.CommentDialog.showCommentId = 'Roo.form.HtmlEditor';">[Add Your comment/notes about this class]</u>
95 <iframe frameborder="0" id="comments-Roo.form" style="border: none;width:100%;"
96 src="/blog.php/GtkDjsComments/Roo.form.HtmlEditor.html"></iframe>
101 <!-- ============================== config options ========================== -->
106 <div class="hr"></div>
107 <a id="Roo.form.HtmlEditor-configs"></a>
113 <table cellspacing="0" class="member-table">
114 <caption>Config Options (Usually are also Properties)</caption>
118 <th class="sig-header" colspan="2">Options</th>
120 <th class="msource-header">Defined By</th>
127 <tr class="config-row expandable config-row-alt0 notInherited">
128 <td class="micon"><a class="exi" href="#expand"> </a></td>
131 <a id="Roo.form.HtmlEditor-cfg-createLinkText" name=".createLinkText"></a>
132 <div class="fixedFont">
133 <b class="itemname">createLinkText</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
139 <div class="short">The default text for the create link prompt</div>
143 <div class="long">The default text for the create link prompt</div>
157 <tr class="config-row expandable config-row-alt1 notInherited">
158 <td class="micon"><a class="exi" href="#expand"> </a></td>
161 <a id="Roo.form.HtmlEditor-cfg-defaultLinkValue" name=".defaultLinkValue"></a>
162 <div class="fixedFont">
163 <b class="itemname">defaultLinkValue</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
169 <div class="short">The default value for the create link prompt (defaults to http:/ /)</div>
173 <div class="long">The default value for the create link prompt (defaults to http:/ /)</div>
187 <tr class="config-row expandable config-row-alt0 notInherited">
188 <td class="micon"><a class="exi" href="#expand"> </a></td>
191 <a id="Roo.form.HtmlEditor-cfg-height" name=".height"></a>
192 <div class="fixedFont">
193 <b class="itemname">height</b> : <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a>
199 <div class="short">(in pixels)</div>
203 <div class="long">(in pixels)</div>
217 <tr class="config-row expandable config-row-alt1 notInherited">
218 <td class="micon"><a class="exi" href="#expand"> </a></td>
221 <a id="Roo.form.HtmlEditor-cfg-resizable" name=".resizable"></a>
222 <div class="fixedFont">
223 <b class="itemname">resizable</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
229 <div class="short">'s' or 'se' or 'e' - wrapps the element in a<br/> Roo.resizable.</div>
233 <div class="long">'s' or 'se' or 'e' - wrapps the element in a<br/> Roo.resizable.</div>
247 <tr class="config-row expandable config-row-alt0 notInherited">
248 <td class="micon"><a class="exi" href="#expand"> </a></td>
251 <a id="Roo.form.HtmlEditor-cfg-stylesheets" name=".stylesheets"></a>
252 <div class="fixedFont">
253 <b class="itemname">stylesheets</b> : <a href="./Array.html#constructor" roo:cls="Array.html#constructor">Array</a>
259 <div class="short">url of stylesheets.</div>
263 <div class="long">url of stylesheets. set to [] to disable stylesheets.</div>
277 <tr class="config-row expandable config-row-alt1 notInherited">
278 <td class="micon"><a class="exi" href="#expand"> </a></td>
281 <a id="Roo.form.HtmlEditor-cfg-toolbars" name=".toolbars"></a>
282 <div class="fixedFont">
283 <b class="itemname">toolbars</b> : <a href="./Array.html#constructor" roo:cls="Array.html#constructor">Array</a>
289 <div class="short">Array of toolbars.</div>
293 <div class="long">Array of toolbars. - defaults to just the Standard one</div>
307 <tr class="config-row expandable config-row-alt0 notInherited">
308 <td class="micon"><a class="exi" href="#expand"> </a></td>
311 <a id="Roo.form.HtmlEditor-cfg-width" name=".width"></a>
312 <div class="fixedFont">
313 <b class="itemname">width</b> : <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a>
319 <div class="short">(in pixels)</div>
323 <div class="long">(in pixels)</div>
347 <!-- ============================== public properties ==================== -->
351 <a id="Roo.form.HtmlEditor-props"></a>
357 <table cellspacing="0" class="member-table">
358 <caption class="Empty">Public Properties - Has None</caption>
364 <!-- ============================== methods summary / details ======================== -->
367 <a id="Roo.form.HtmlEditor-methods"></a>
368 <!-- constructor?? -->
375 <!-- then dynamics first -->
382 <table cellspacing="0" class="member-table">
383 <caption>Public Methods</caption>
385 <th class="sig-header" colspan="2">Method</th>
386 <th class="msource-header">Defined By</th>
396 <tr class="method-row config-row-alt0 notInherited">
397 <td class="micon"><a class="exi" href="#expand"> </a></td>
401 <a id="Roo.form-method-HtmlEditor" name=".HtmlEditor"></a>
402 <div class="fixedFont">
403 <span class="attributes">new <B>Roo.form.</B></span><b class="itemname">HtmlEditor</b>
413 <div class="short">Create a new Roo.form.HtmlEditor</div>
420 Create a new Roo.form.HtmlEditor
443 <tr class="method-row config-row-alt1 expandable notInherited">
444 <td class="micon"><a class="exi" href="#expand"> </a></td>
448 <a id="Roo.form.HtmlEditor-method-cleanHtml" name=".cleanHtml"></a>
449 <div class="fixedFont">
450 <span class="attributes"></span><b class="itemname">cleanHtml</b>
452 (<a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>html</i></B>)
459 <div class="short">Protected method that will not generally be called directly.</div>
465 Protected method that will not generally be called directly. If you need/want<br/>custom HTML cleanup, this is the method you should override.
472 <dl class="detailList">
473 <dt class="heading">Parameters:</dt>
476 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>html</b>
479 <dd>The HTML to be cleaned<br/>return {String} The cleaned HTML</dd>
505 <tr class="method-row config-row-alt0 expandable notInherited">
506 <td class="micon"><a class="exi" href="#expand"> </a></td>
510 <a id="Roo.form.HtmlEditor-method-createToolbar" name=".createToolbar"></a>
511 <div class="fixedFont">
512 <span class="attributes"></span><b class="itemname">createToolbar</b>
514 (HtmlEditor <B><i>editor</i></B>)
521 <div class="short">Protected method that will not generally be called directly.</div>
527 Protected method that will not generally be called directly. It<br/>is called when the editor creates its toolbar. Override this method if you need to<br/>add custom toolbar buttons.
534 <dl class="detailList">
535 <dt class="heading">Parameters:</dt>
538 <span class="fixedFont">HtmlEditor</span> <b>editor</b>
567 <tr class="method-row config-row-alt1 expandable notInherited">
568 <td class="micon"><a class="exi" href="#expand"> </a></td>
572 <a id="Roo.form.HtmlEditor-method-execCmd" name=".execCmd"></a>
573 <div class="fixedFont">
574 <span class="attributes"></span><b class="itemname">execCmd</b>
576 (<a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>cmd</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/Boolean <B><i>value</i></B>)
583 <div class="short">Executes a Midas editor command directly on the editor document.</div>
589 Executes a Midas editor command directly on the editor document.<br/>For visual commands, you should use {<b>link</b> <b>relayCmd</b>} instead.<br/><b>This should only be called after the editor is initialized.</b>
596 <dl class="detailList">
597 <dt class="heading">Parameters:</dt>
600 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>cmd</b>
603 <dd>The Midas command</dd>
606 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/Boolean</span> <b>value</b>
609 <dd>(optional) The value to pass to the command (defaults to null)</dd>
635 <tr class="method-row config-row-alt0 expandable notInherited">
636 <td class="micon"><a class="exi" href="#expand"> </a></td>
640 <a id="Roo.form.HtmlEditor-method-getDocMarkup" name=".getDocMarkup"></a>
641 <div class="fixedFont">
642 <span class="attributes"></span><b class="itemname">getDocMarkup</b>
651 <div class="short">Protected method that will not generally be called directly.</div>
657 Protected method that will not generally be called directly. It<br/>is called when the editor initializes the iframe with HTML contents. Override this method if you<br/>want to change the initialization markup of the iframe (e.g. to add stylesheets).
686 <tr class="method-row config-row-alt1 expandable notInherited">
687 <td class="micon"><a class="exi" href="#expand"> </a></td>
691 <a id="Roo.form.HtmlEditor-method-insertAtCursor" name=".insertAtCursor"></a>
692 <div class="fixedFont">
693 <span class="attributes"></span><b class="itemname">insertAtCursor</b>
695 (<a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>text</i></B>)
702 <div class="short">Inserts the passed text at the current cursor position.</div>
708 Inserts the passed text at the current cursor position. Note: the editor must be initialized and activated<br/>to insert tRoo.
715 <dl class="detailList">
716 <dt class="heading">Parameters:</dt>
719 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>text</b>
722 <dd>| dom node..</dd>
748 <tr class="method-row config-row-alt0 expandable notInherited">
749 <td class="micon"><a class="exi" href="#expand"> </a></td>
753 <a id="Roo.form.HtmlEditor-method-pushValue" name=".pushValue"></a>
754 <div class="fixedFont">
755 <span class="attributes"></span><b class="itemname">pushValue</b>
764 <div class="short">Protected method that will not generally be called directly.</div>
770 Protected method that will not generally be called directly. Pushes the value of the textarea<br/>into the iframe editor.
799 <tr class="method-row config-row-alt1 expandable notInherited">
800 <td class="micon"><a class="exi" href="#expand"> </a></td>
804 <a id="Roo.form.HtmlEditor-method-rangeIntersectsNode" name=".rangeIntersectsNode"></a>
805 <div class="fixedFont">
806 <span class="attributes"></span><b class="itemname">rangeIntersectsNode</b>
815 <div class="short">Range intersection.</div>
821 Range intersection.. the hard stuff...<br/> '-1' = before<br/> '0' = hits..<br/> '1' = after.<br/> [ -- selected range --- ]<br/> [fail] [fail]<br/><br/> basically..<br/> if end is before start or hits it. fail.<br/> if start is after end or hits it fail.<br/><br/> if either hits (but other is outside. - then it's not
850 <tr class="method-row config-row-alt0 expandable notInherited">
851 <td class="micon"><a class="exi" href="#expand"> </a></td>
855 <a id="Roo.form.HtmlEditor-method-relayCmd" name=".relayCmd"></a>
856 <div class="fixedFont">
857 <span class="attributes"></span><b class="itemname">relayCmd</b>
859 (<a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>cmd</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/Boolean <B><i>value</i></B>)
866 <div class="short">Executes a Midas editor command on the editor document and performs necessary focus and<br/>toolbar updates.</div>
872 Executes a Midas editor command on the editor document and performs necessary focus and<br/>toolbar updates. <b>This should only be called after the editor is initialized.</b>
879 <dl class="detailList">
880 <dt class="heading">Parameters:</dt>
883 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>cmd</b>
886 <dd>The Midas command</dd>
889 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/Boolean</span> <b>value</b>
892 <dd>(optional) The value to pass to the command (defaults to null)</dd>
918 <tr class="method-row config-row-alt1 expandable notInherited">
919 <td class="micon"><a class="exi" href="#expand"> </a></td>
923 <a id="Roo.form.HtmlEditor-method-syncValue" name=".syncValue"></a>
924 <div class="fixedFont">
925 <span class="attributes"></span><b class="itemname">syncValue</b>
934 <div class="short">Protected method that will not generally be called directly.</div>
940 Protected method that will not generally be called directly. Syncs the contents<br/>of the editor iframe with the textarea.
969 <tr class="method-row config-row-alt0 expandable notInherited">
970 <td class="micon"><a class="exi" href="#expand"> </a></td>
974 <a id="Roo.form.HtmlEditor-method-toggleSourceEdit" name=".toggleSourceEdit"></a>
975 <div class="fixedFont">
976 <span class="attributes"></span><b class="itemname">toggleSourceEdit</b>
978 (<a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a> <B><i>sourceEdit</i></B>)
985 <div class="short">Toggles the editor between standard and source edit mode.</div>
991 Toggles the editor between standard and source edit mode.
998 <dl class="detailList">
999 <dt class="heading">Parameters:</dt>
1002 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a></span> <b>sourceEdit</b>
1005 <dd>(optional) True for source edit, false for standard</dd>
1023 <td class="msource">
1034 <!-- ============================== events summary / details ======================== -->
1037 <a id="Roo.form.HtmlEditor-events"></a>
1046 <table cellspacing="0" class="member-table">
1047 <caption>Events</caption>
1050 <th class="sig-header" colspan="2">Event</th>
1051 <th class="msource-header">Defined By</th>
1060 <tr class="method-row expandable config-row-alt0 notInherited">
1061 <td class="micon"><a class="exi" href="#expand"> </a></td>
1064 <a id="Roo.form.HtmlEditor-event-*activate"></a>
1066 <div class="fixedFont">
1067 <b class="itemname">activate</b> (HtmlEditor <B><i>this</i></B>)
1073 <div class="short">Fires when the editor is first receives the focus.
1079 Fires when the editor is first receives the focus. Any insertion must wait<br/>until after this event.
1085 <dl class="detailList">
1086 <dt class="heading">Parameters:</dt>
1089 <span class="fixedFont">HtmlEditor</span> <b>this</b>
1110 <td class="msource">
1115 <tr class="method-row expandable config-row-alt1 notInherited">
1116 <td class="micon"><a class="exi" href="#expand"> </a></td>
1119 <a id="Roo.form.HtmlEditor-event-*beforepush"></a>
1121 <div class="fixedFont">
1122 <b class="itemname">beforepush</b> (HtmlEditor <B><i>this</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>html</i></B>)
1128 <div class="short">Fires before the iframe editor is updated with content from the textarea.
1134 Fires before the iframe editor is updated with content from the textarea. Return false<br/>to cancel the push.
1140 <dl class="detailList">
1141 <dt class="heading">Parameters:</dt>
1144 <span class="fixedFont">HtmlEditor</span> <b>this</b>
1150 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>html</b>
1171 <td class="msource">
1176 <tr class="method-row expandable config-row-alt0 notInherited">
1177 <td class="micon"><a class="exi" href="#expand"> </a></td>
1180 <a id="Roo.form.HtmlEditor-event-*beforesync"></a>
1182 <div class="fixedFont">
1183 <b class="itemname">beforesync</b> (HtmlEditor <B><i>this</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>html</i></B>)
1189 <div class="short">Fires before the textarea is updated with content from the editor iframe.
1195 Fires before the textarea is updated with content from the editor iframe. Return false<br/>to cancel the sync.
1201 <dl class="detailList">
1202 <dt class="heading">Parameters:</dt>
1205 <span class="fixedFont">HtmlEditor</span> <b>this</b>
1211 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>html</b>
1232 <td class="msource">
1237 <tr class="method-row expandable config-row-alt1 notInherited">
1238 <td class="micon"><a class="exi" href="#expand"> </a></td>
1241 <a id="Roo.form.HtmlEditor-event-*editmodechange"></a>
1243 <div class="fixedFont">
1244 <b class="itemname">editmodechange</b> (HtmlEditor <B><i>this</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a> <B><i>sourceEdit</i></B>)
1250 <div class="short">Fires when the editor switches edit modes
1256 Fires when the editor switches edit modes
1262 <dl class="detailList">
1263 <dt class="heading">Parameters:</dt>
1266 <span class="fixedFont">HtmlEditor</span> <b>this</b>
1272 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a></span> <b>sourceEdit</b>
1275 <dd>True if source edit, false if standard editing.</dd>
1293 <td class="msource">
1298 <tr class="method-row expandable config-row-alt0 notInherited">
1299 <td class="micon"><a class="exi" href="#expand"> </a></td>
1302 <a id="Roo.form.HtmlEditor-event-*editorevent"></a>
1304 <div class="fixedFont">
1305 <b class="itemname">editorevent</b> (HtmlEditor <B><i>this</i></B>)
1311 <div class="short">Fires when on any editor (mouse up/down cursor movement etc.
1317 Fires when on any editor (mouse up/down cursor movement etc.) - used for toolbar hooks.
1323 <dl class="detailList">
1324 <dt class="heading">Parameters:</dt>
1327 <span class="fixedFont">HtmlEditor</span> <b>this</b>
1348 <td class="msource">
1353 <tr class="method-row expandable config-row-alt1 notInherited">
1354 <td class="micon"><a class="exi" href="#expand"> </a></td>
1357 <a id="Roo.form.HtmlEditor-event-*initialize"></a>
1359 <div class="fixedFont">
1360 <b class="itemname">initialize</b> (HtmlEditor <B><i>this</i></B>)
1366 <div class="short">Fires when the editor is fully initialized (including the iframe)
1372 Fires when the editor is fully initialized (including the iframe)
1378 <dl class="detailList">
1379 <dt class="heading">Parameters:</dt>
1382 <span class="fixedFont">HtmlEditor</span> <b>this</b>
1403 <td class="msource">
1408 <tr class="method-row expandable config-row-alt0 notInherited">
1409 <td class="micon"><a class="exi" href="#expand"> </a></td>
1412 <a id="Roo.form.HtmlEditor-event-*push"></a>
1414 <div class="fixedFont">
1415 <b class="itemname">push</b> (HtmlEditor <B><i>this</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>html</i></B>)
1421 <div class="short">Fires when the iframe editor is updated with content from the textarea.
1427 Fires when the iframe editor is updated with content from the textarea.
1433 <dl class="detailList">
1434 <dt class="heading">Parameters:</dt>
1437 <span class="fixedFont">HtmlEditor</span> <b>this</b>
1443 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>html</b>
1464 <td class="msource">
1469 <tr class="method-row expandable config-row-alt1 notInherited">
1470 <td class="micon"><a class="exi" href="#expand"> </a></td>
1473 <a id="Roo.form.HtmlEditor-event-*sync"></a>
1475 <div class="fixedFont">
1476 <b class="itemname">sync</b> (HtmlEditor <B><i>this</i></B>, <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a> <B><i>html</i></B>)
1482 <div class="short">Fires when the textarea is updated with content from the editor iframe.
1488 Fires when the textarea is updated with content from the editor iframe.
1494 <dl class="detailList">
1495 <dt class="heading">Parameters:</dt>
1498 <span class="fixedFont">HtmlEditor</span> <b>this</b>
1504 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a></span> <b>html</b>
1525 <td class="msource">
1537 <!-- ============================== footer ================================= -->
1538 <div class="fineprint" style="clear:both">
1540 Documentation generated by <a href="http://www.akbkhome.com" target="_blankt">Introspection Doc Generator</a> on Tue Apr 01 2014 13:12:15 GMT+0800 (HKT)
1542 <a href="http://www.jsdoctoolkit.org/" target="_blank">JsDoc Toolkit</a>