[Dojo-interest] dojo editor2 content display problem

Sajan shakesajan at gmail.com
Fri Aug 31 05:01:44 UTC 2007


Hi all,
          I am working with Editor2. If I create and show an editor, I can
work fine. But when I tried to get the same editor and display it,
everything is working fine except the editing area. We are not able to
modify the content of the editor as it is not showing the content at all.
          I am using firefox. But when I used IE, its working(though not
well formated) fine. It shows the previous content and can modify it. The
following is the test case for this problem.
<code>
<html>
	<head>
		<title>Testing Dojo Editor...</title>
		<script type="text/javascript">
			String.prototype.trim = function()
			{
				return this.replace(/^\s+|\s+$/, '');
			}
			var djConfig = {isDebug: true};
		</script>
		<script type="text/javascript"
src="../../../../../../dojo/dojo.js"></script>
		<script language="JavaScript" type="text/javascript">
			dojo.require('dojo.widget.*');
			dojo.require('dojo.widget.Editor2');
			dojo.require('dojo.widget.ContentPane');
		</script>
		<script>
			dojo.addOnLoad(function()
			{
				var editor = dojo.widget.createWidget('Editor2', {
						widgetId: 'editorId',
						width: '100%', height: '100%',
						style: 'border: 3px solid black'
				});
				var msg = editor;
				dojo.debug('\nMessage: ' + msg);
			});

			var showEditor = function (e)
			{
				var editor = dojo.widget.byId('editorId');
				var scd = dojo.byId('scId');
				var content = editor.getEditorContent();
				scd.innerHTML += '<br/>Editor Content(from ContentPane 2): ' + content;

				var ed = dojo.widget.byId('edId');
				ed.addChild(editor);

				var msg = editor;
				dojo.debug('\nThis: ' + this);
				dojo.debug('\nMessage: ' + msg);
			}

			var showSecondEditor = function (e)
			{
				var editor = dojo.widget.byId('editorId');
				var scd = dojo.byId('scId');
				var content = editor.getEditorContent();
				scd.innerHTML += '<br/>Editor Content(from ContentPane 1): ' + content;

				var ed2 = dojo.widget.byId('edId2');
				ed2.addChild(editor);

				var msg = editor;
				dojo.debug('\nThis: ' + this);
				dojo.debug('\nMessage: ' + msg);
			}

			var removeEditor = function (e)
			{
				var scd = dojo.byId('scId');
				var ed = dojo.widget.byId('edId');
				var children = ed.children

				for(var i = 0; i < children.length; i++)
				{
					if(children[i] && children[i] instanceof dojo.widget.Editor2)
					{
						var content = children[i].getEditorContent();
						if(content.trim() == '')
						{
							alert('No Content typed. So cannot remove...');
							return;
						}
						scd.innerHTML += '<br/> Editor Content: ' + content;
						ed.removeChild(children[i])
						var msg = children[i];
						dojo.debug('\nThis: ' + this);
						dojo.debug('\nMessage: ' + msg);
					}
				}
			}
		</script>
	</head>
	<body style="padding: 10px;">
		<p>Testing Dojo Editor...</p>
		<br/>
		<table cellpadding=3>
			<tr>
				<td>
					<button dojoType='Button' widgetId='seId' onClick='showEditor'
							caption='show Editor'>
					</button>
				</td>
				<td>
					<button dojoType='Button' widgetId='reId' onClick='removeEditor'
							caption='Remove Editor'>
					</button>
				</td>
				<td>
					<button dojoType='Button' widgetId='seId2' 
                                                       
onClick='showSecondEditor' caption='Show Second Editor'>
					</button>
				</td>
			</tr>
		</table>
		</div>
		<br/>
		<div id='edId' dojoType='ContentPane' widgetId='edId'
				style='border: 1px solid black; height:100px'>
		</div>
		<div id='scId'>
		</div>
		<br/>
		<div id='edId2' dojoType='ContentPane' widgetId='edId2'
						style='border: 1px solid black; height:100px'>
		</div>
		<br/><br/>
	</body>
</html>

Here I am having 3 buttons;
 i) Show editor in first content pane. Displays the editor content in
another div.
 ii) Remove the editor from First content pane(if any). It also prints the
editor content in the div.
 iii) Show the same editor in the second content pane. Prints the editor
content in the div.

The flow is: 1) click on the first button.
2) Modify the editor content.
3) click on the last button(to show editor in second div).
     Now problem. Editor is displayed without any content. That is, the
iframe used for editor  is changed. If we retrieve the editor content, we
get the initial content.

     Is this a known issue??? Please let me know if anyone finds any
solution.

thanks. http://www.nabble.com/file/p12381860/test_Editor.html
test_Editor.html 
-- 
View this message in context: http://www.nabble.com/dojo-editor2-content-display-problem-tf4346087.html#a12381860
Sent from the Dojo mailing list archive at Nabble.com.



More information about the Dojo-interest mailing list