I am using railo and attempting to submit a tinymce text area via ajax.
My problem is upon submission it seems that the html is stripped and the sql isn't actually updated.
here is my code:
function UpdateHome() {
document.getElementById('UpdateProcessing').style.display = '';
document.getElementById('HomeForm').style.display = 'none';
ColdFusion.Ajax.submitForm("HomeForm","action.cfm",HomeUpdateReturn);
}
<form action="action.cfm" method="post" id="HomeForm">
<input type="hidden" name="action" value="HomeUpdate" />
<CFLOOP QUERY="FetchHome">
<textarea id="HomeArea" name="HomeArea" class="tinymce" rows="20" cols="20"
style="width:100%; height:500px" >#Body#</textarea>
</CFLOOP>
<input type="button" class="HomeSubmit" value="Save" onClick="UpdateHome();" />
</form>
<CFQUERY NAME="UpdateHome">
UPDATE Content
SET Body = '#HomeArea#'
WHERE ID = 1
</CFQUERY>
<CFSET UdateHome = ArrayNew(1)>
<CFSET UpdateHome[1] = true>
<CFCONTENT TYPE="application/json" RESET="true">
<CFOUTPUT>#serializeJSON(UpdateHome)#</CFOUTPUT>
When I submit the form without ajax the sql works fine .
does anyone have any idea why this wont submit the html formatted text via ajax?
A few issues here:
I don't believe you can use ColdFusion.Ajax.submitForm()
unless you are using cfform or unless you use <cfajaximport ... />
to import the javascript. Have you confirmed via Firebug or Chrome dev tools that the Javascript isn't throwing an error? I suspect it is. Change your <form ... >
and </form>
tags to <cfform ...>
and </cfform>
and try again.
Also, I don't think that is going to work as you expect since you have both the form and the form handler logic in the same file. I would separate them.
You are referencing a HomeUpdateReturn
return handler function which doesn't exist. You need to write this function in your Javascript code.
You also have a couple other issues I just can't let pass without pointing out:
'#homearea#'
. This could reference any homearea
variable and may not be the one in the form scope you expect. Change this to #form.homearea#
. This will ensure that only the variable in the form scope is used.<cfqueryparam ... />
in your query otherwise you leave yourself open to sql injection attacks. So change the '#homearea#'
to <cfqueryparam cfsqltype="cf_sql_longchar" value="#form.homearea#" />
. (Assuming in your database you are using an large text field) Never allow unchecked user input to go directly into your query without using a parameterized query.All you need to do before you submit the form is to call the javascript line
tinymce.triggerSave()