Opened 9 years ago

Closed 9 years ago

Last modified 9 years ago

#11439 closed defect (wontfix)

InlineEditBox and Editor on IE can produce Unknown runtime error

Reported by: jchase Owned by:
Priority: high Milestone: tbd
Component: Dijit Version: 1.4.3
Keywords: Cc:
Blocked By: Blocking:

Description (last modified by bill)

In IE8 and IE7, using a dijit.Editor as the editor for a dijit.InlineEditBox widget can produce an Unknown runtime error if the dijit.Editor returns a value containing HTML tags (<p> tags for sure, could be others). The error is severe enough in that the InlineEditBox's value can no longer be changed.

I am using dojo 1.4.3.

To reproduce this error:

  1. Create a widget as follows:
<span dojoType="dijit.InlineEditBox"
   width="700px"
   editor="dijit.Editor"
   renderAsHTML="true"
   autoSave="false"
   onChange="console.debug(arguments[0])"></span>
  1. Enter any content making sure to press the enter key at least once (to be sure the value passed back to the inlineEditBox contains HTML code)
  1. An Unknown runtime error occurs on line 310 of InlineEditBox?.js:
   this.displayNode.innerHTML = val || this.noValueIndicator;
  1. The value is not saved to the InlineEditBox?.
  1. Clicking anywhere else to focus elsewhere, or closing the browser, triggers another error on line 1611 of dijit/_editor/RichText.js:
   this.domNode.innerHTML = save ? this._content : this.savedContent;

Please note that the console shows that the error occurs when the value being returned contains p tags - e.g.

<p>foo</p> 

The error does NOT occur when the value does not contain those tags or when no value was passed back from the Editor to the InlineEditBox?: e.g.

foo 

Attachments (1)

test_InlineEditBox2.html (1.3 KB) - added by jchase 9 years ago.
Place in dijit/tests

Download all attachments as: .zip

Change History (7)

comment:1 Changed 9 years ago by jchase

Just noting that changing

renderAsHTML="false"

eliminates the first error and changes are now saved to the InlineEditBox? (albeit with undesired HTML tags visible), however the 2nd Unknown runtime error still occurs in RichText?.js.

comment:2 Changed 9 years ago by bill

Component: GeneralDijit
Description: modified (diff)
Owner: anonymous deleted

Please attach test cases to all bugs using the attach file button.

test_InlineEditBox.html has an example with a dijit.Editor that's working fine for me on IE8, at least in 1.5. How about you?

Changed 9 years ago by jchase

Attachment: test_InlineEditBox2.html added

Place in dijit/tests

comment:3 Changed 9 years ago by jchase

Ok, so, it's clear this is an issue with IE and nested <p> tags as warned on the test_InlineEditBox.html testing page. However, if you see the attached file, it also fails if using a span tag within a p tag. I've also tried:

  1. eliminating the p tag - success.
  2. using a div instead of a span - success.

And yes, the test_InlineEditBox.html test case works as well.

Clearly I should be using a div instead of a span when using a dijit.Editor as the editor, however it may help to note this little snag somewhere.

comment:4 Changed 9 years ago by jchase

It turns out a div won't work in my situation because I have a unique need for a InlineEditBox? to appear inline within content, but use the rich functionality of a dijit.Editor. As a result, the fix for me was to dojo.extend dijit.InlineEditBox? to strip out any p tags that IE seems insistent upon adding:

(_setValueAttr function - added the following line just before this.displayNode.innerHTML = val || this.noValueIndicator)

   val = val.replace(/<\/?p>/gm, "");

This worked great for me.

comment:5 Changed 9 years ago by bill

Resolution: wontfix
Status: newclosed

OK, glad you found a workaround, although it seems like a better solution would be to use a <div class="dijitInline"> for the outer node.

I agree this should be documented, so I added an Editor section to http://docs.dojocampus.org/dijit/InlineEditBox just now. Thanks for pointing out the lack of doc.

comment:6 Changed 9 years ago by jchase

Thanks! I tried using a wrapping div with class="dijitInline" (and also a div with a style display:inline) however neither worked. I think the reason why is because technically, divs inside a p tag isn't valid markup either. Firefox actually reorganizes the code (seen in firebug) such that the p tags close before the div.

Also thanks for the tip regarding setting the height - it was perfect for what I was doing.

Note: See TracTickets for help on using tickets.