ajaxSubmit is giving me an error

I have page using Coldfusion and jquery and I am trying to get a form submitted using ajaxSubmit. I am finding that with some text I get an error and I do not understand why.

I have created a demo page at http://www.demo.adreflex.com/debug_edit.cfm and http://www.demo.adreflex.com/debug_edit.cfm?dbg=3 that illustrates my problem.

The file, SaveInlineEdit_dbg.cfm, exists but its contents are empty.

When you access this page using the first link you get the following error:

Forbidden

You don't have permission to access /inc/SaveInlineEdit_dbg.cfm on this server.

Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.

When you access the page using the second link everything works fine. The only difference is the text being submitted in the form.

I am hoping someone can shed some light on this and help me fix this problem.

Below is a copy of the code found in debug_edit.cfm

<cfparam name="url.dbg" default="1">
<link type="text/css" href="jqueryui/css/smoothness/jquery-ui.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" type="text/javascript"></script>
<script type="text/javascript">
	window.jQuery || document.write('<script src="jqueryui\/1.12.2\/jquery.min.js" type="text\/javascript"><\/script><script src="jqueryui\/js\/jquery-ui-1.11.4.min.js" type="text\/javascript" ><\/script>;');
</script>

<script src="jqueryui/js/jquery.form.min.js"></script>

<div id="formstate"></div>
<form name="InlineForm" id="InlineForm" style="margin:0px;" action="/inc/SaveInlineEdit_dbg.cfm" method="post" enctype="multipart/form-data">
	<cfif url.dbg eq 1>
		<input type="hidden" name="PageContent" id="PageContent" size="200" value='<p>CONVERT MORE with search engine optimization and responsive design.</p>' /><br>

		<input disabled="disabled" type="text" name="PageContent_disp" id="PageContent_disp" size="200" value='<p>CONVERT MORE with search engine optimization and responsive design.</p>' /><br>
	<cfelse>

		<input type="hidden" name="PageContent" id="PageContent" size="200" value='<p>responsive design</p>' /><br>

		<input disabled="disabled" type="text" name="PageContent_disp" id="PageContent_disp" size="200" value='<p>responsive design</p>' /><br>

	</cfif>
</form>


<script type="text/javascript">
var optionsSaveDoc = 
{ 
	error: errorHandlerSaveDoc,
	success: callbackSaveDoc 
}; 


//callback handler for form submit
$("#InlineForm").submit(function(e)
{
	// submit the form 
	$(this).ajaxSubmit(optionsSaveDoc); 
	// return false to prevent normal browser submit and page navigation 
	e.preventDefault(); //STOP default action
	return false; 
});

$("#InlineForm").submit(); //Submit the FORM
   
function callbackSaveDoc(responseText, statusText, xhr, $form)
{
	$('div#formstate').html('It worked');
}

function errorHandlerSaveDoc(msg)
{
	$('div#formstate').html(msg.responseText);
	console.log(msg.responseText);
}
</script>

Select allOpen in new window