Accessing element properties when using fckeditor 1

[southbeach]

Writing a PHP script using JS and AJAX to manipulate form submission.

I am using fckeditor in lieu of text area where user can enter and format detailed description or content.

JS code is used to loop through the form elements and create an array which is then passed as a parameter to a PHP script via AJAX call.

The problem I am having is that JS is not picking up the value for my fckeditor field. Now, I know that these fields are set within an IFRAME and I suspect that might be the reason. However, the field name is part of the array but not the value.

Here is my JS function

function saveLZMENU() {
	var theForm = document.forms.lzmenuform;
	var alertText = ""; var names = ""; var values = "";
   for(i=0; i<theForm.elements.length; i++)
   {
		alertText += "Element Name: " + theForm.elements[i].name + " - " + theForm.elements[i].type + "<br />\n"
		names += theForm.elements[i].name + '~';
		if(theForm.elements[i].type == "text" || theForm.elements[i].type == "textarea" || theForm.elements[i].type == "button" || theForm.elements[i].type == "password" || theForm.elements[i].type == "hidden")
		{ values += theForm.elements[i].value + '~';
		} else if(theForm.elements[i].type == "checkbox") {
			if(theForm.elements[i].checked) { values += theForm.elements[i].value + '~' } else { values += '~'; }
		} else if(theForm.elements[i].type == "select-one") {
			values += theForm.elements[i].options[theForm.elements[i].selectedIndex].text + '~'
		} else {
			values += theForm.elements[i].value + '~';
		}
   }
   names += "eol"; 
   values += "eol";
   var string = names + '::' + values;
   alert(alertText);
   xajax_call('savelzmenu',string);
   return true;
}

Any ideas?

Thank you all in advance for your assistance!


--
SouthBeach

http://www.fpgroups.com

The good thing about not knowing is the opportunity to learn - Yours truly, 2008.

 

[BabyJeffy]

You need to tell the FCK Editor to write the data from the iframe back to the (now hidden) input on the page.

Use the internal API method: UpdateLinkedField()

Here is some documentation on this:

http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Troubleshooting#AjaxSubmit

Hope that helps,
Jeff

[tt]Visit my blog [!]@[/!]

http://www.coderambler.com/

Visit Code Couch [!]@[/!]

http://www.codecouch.com/

[/tt]

Make sure your web page and css validates properly against the doctype you have chosen - before you attempt to debug a problem!

FAQ216-6094

 

[southbeach]

Jeff,

Thanks for the link, I have added the JS class to my main JS file (external) and chose to use the onclick() method since it is what I am already using to call my ajax routine.

My JS code is exactly as shown on the example

// This class will serve as a HACK to populate FCK fields thus making them
// accessible when submitting form via AJAX
function HackFCK()
{
this.UpdateEditorFormValue = function()
{
for ( i = 0; i < parent.frames.length; ++i )
if ( parent.frames[i].FCK )
parent.frames[i].FCK.UpdateLinkedField();
}
}
// instantiate the class
var FCKHack = new HackFCK();
// END OF FCK HACK

and my button looks like this

<input style="float: right; margin-right: 20px;" type="button" name="save" value="Save" onclick="FCKHack.UpdateEditorFormValue(); saveLZMENU();" />

Upon clicking the button, nothing happen as a JS error is given saying that FCKHack is not defined.

Any suggestions?

Thanks!




--
SouthBeach

http://www.fpgroups.com

The good thing about not knowing is the opportunity to learn - Yours truly, 2008.

 

[southbeach]

OK - It looks like I fixed it.

I changed my onclick() event to this

onclick="var FCKHack = new HackFCK(); FCKHack.UpdateEditorFormValue(); saveLZMENU();"

I now get the value for my FCK field.

Thanks!!!!

--
SouthBeach

http://www.fpgroups.com

The good thing about not knowing is the opportunity to learn - Yours truly, 2008.

 

[BabyJeffy]

Happy to hear it worked for you. We have used the FCK Editor for the past 18 months as part of a Content Management System. Recently we upgraded to the newer version and I had to try to figure out all the "hacks" and "patches" that I had made to the code (partly so I could test if they were still needed, and partly to re-apply them).

As a result, I forced myself to learn the plugin architecture that is used... and I managed to solve all our modifications through writing plugins. It just so happens I was modifying one of the plugins on Friday to handle AJAX callback data So your post was timely!

I hate the (seemingly) poor quality of the API documentation and example documentation. There are plenty of plugins out there (SourceForge has over 100 listed) - and they have been invaluable to me as I dissect them and figure out how they work

Anyway, glad it's all sorted for you.

Jeff

[tt]Visit my blog [!]@[/!]

http://www.coderambler.com/

Visit Code Couch [!]@[/!]

http://www.codecouch.com/

[/tt]

Make sure your web page and css validates properly against the doctype you have chosen - before you attempt to debug a problem!

FAQ216-6094