<!DOCTYPE html PUBLIC "- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Accessing Cached CFCs With AJAX</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function Init(){
var jForm = $( "form:first" );
jForm.submit(
function(){
AddMessage( jForm );
return( false );
}
);
}
function AddMessage( jForm ){
$.ajax(
{
method: "post",
url: "RemoteMessageService.cfc",
data: {
method: "AddMessage",
message: jForm.find( ":text" ).val()
},
dataType: "json",
success: function( objResponse ){
if (objResponse.SUCCESS){
jForm.find( ":text" ).val( "" );
GetMessages();
} else {
AlertErrors( objResponse.ERRORS );
}
}
}
);
}
function GetMessages(){
$.ajax(
{
method: "post",
url: "RemoteMessageService.cfc",
data: {
method: "GetMessages"
},
dataType: "json",
success: function( objResponse ){
var jList = $( "#messages" );
if (objResponse.SUCCESS){
jList.empty();
$.each(
objResponse.DATA,
function( intI, strMessage ){
jList.append(
"<li>" +
strMessage +
"</li>"
);
}
);
} else {
AlertErrors( objResponse.ERRORS );
}
}
}
);
}
function AlertErrors( arrErrors ){
var strErrorMessage = "Please review the following:\n\n";
$.each(
arrErrors,
function( intI, objError ){
strErrorMessage += ( objError.ERROR + "\n" );
}
);
alert( strErrorMessage );
}
$( Init );
</script>
</head>
<body>
<h1>
Accessing Cached CFCs With AJAX
</h1>
<form>
<p>
<label>
New Message:
</label>
<br />
<input type="text" name="message" size="50" />
<input type="submit" value="Add Message" />
</p>
</form>
<h2>
Existing Messages
</h2>
<ol id="messages" />
</body>
</html>