FCKEditor: Variable Width is Undefined
We use FCKEditor a lot in our backend area coding. Folks on Macs would always complain they were getting the error: Variable Width is Undefined I did some research today and was not able to find anything concrete on the error so I went to one of our graphics guys who has a Mac. He received the error too and sent me a screenshot. Turns out that there in an issue in fckeditor.cfc The width and height variables were not scoped properly. Here is the bad code from around line 132 of fckeditor.cfc
<div>
<textarea name="#this.instanceName#" rows="4" cols="40" style="WIDTH: #width#; HEIGHT: #height#">#HTMLEditFormat(this.value)#</textarea>
</div>
I was able to immediately see how to fix it, but to be sure I went to the top of the function to look at any variable declarations:
<textarea name="#this.instanceName#" rows="4" cols="40" style="WIDTH: #width#; HEIGHT: #height#">#HTMLEditFormat(this.value)#</textarea>
</div>
<cfparam name="this.instanceName" type="string" />
<cfparam name="this.width" type="string" default="100%" />
<cfparam name="this.height" type="string" default="200" />
<cfparam name="this.toolbarSet" type="string" default="Default" />
<cfparam name="this.value" type="string" default="" />
<cfparam name="this.basePath" type="string" default="/fckeditor/" />
<cfparam name="this.checkBrowser" type="boolean" default="true" />
<cfparam name="this.config" type="struct" default="#structNew()#" />
I changed the width and height variables to be scoped with the This. Scope and everything was A OK.
Here is the corrected code.
<cfparam name="this.width" type="string" default="100%" />
<cfparam name="this.height" type="string" default="200" />
<cfparam name="this.toolbarSet" type="string" default="Default" />
<cfparam name="this.value" type="string" default="" />
<cfparam name="this.basePath" type="string" default="/fckeditor/" />
<cfparam name="this.checkBrowser" type="boolean" default="true" />
<cfparam name="this.config" type="struct" default="#structNew()#" />
<div>
<textarea name="#this.instanceName#" rows="4" cols="40" style="WIDTH: #this.width#; HEIGHT: #this.height#">#HTMLEditFormat(this.value)#</textarea>
</div>
Also I was able to duplicate the error using Opera.
The question I have is why does it work fine in FireFox and IE, but throws an error inside of Safari and Opera? The error that is thrown is a CF error so it shouldn't be browser specific.. I received the error as soon as I hit the page.
Also this may be fixed in the latest version of the FCKEditor I did not check.
<textarea name="#this.instanceName#" rows="4" cols="40" style="WIDTH: #this.width#; HEIGHT: #this.height#">#HTMLEditFormat(this.value)#</textarea>
</div>
TrackBacks
There are no trackbacks for this entry.
Trackback URL for this entry:
http://www.cfedge.com/trackback.cfm?741A9EBE-9AC6-14EB-15A9156119888241
http://www.cfedge.com/trackback.cfm?741A9EBE-9AC6-14EB-15A9156119888241
The reason it was only happening on certain browsers is that error was in the showTextArea function. That function is only processed for un-supported browsers. The other browsers (IE/Firefox) passed the isCompatible check:
if( find( "msie", sAgent ) and not find( "mac", sAgent ) and not find( "opera", sAgent ) )
so they got the showHTMLEditor function instead.