Ajax and Coldfusion
by Chris, 09/12/2017
Coldfusion and Ajax work great together. Long past are the days of pages refreshing to grab data.
The following is a simple cfc that returns some user info in json format with a type of query.
<cfcomponent> <cffunction name="getUsers" access="remote" returnformat="json" returntype="query"> <cfquery name="data" datasource="ds"> select username, address, birthday from employees; </cfquery> <cfreturn data/> </cffunction> </cfcomponent>
The next step is to grab the column information passed back from Coldfusion and then map it to the data object supplied.
$.ajax({ type: "GET", url: "cfc/data.cfc?method=data", returnformat: "json", error: function(res) {alert('some error');}, success: function(res) { var sampleArray = []; var resultSet = $.parseJSON(res); var columnMapping = {}; //add our column values to our mapping object for (var i = 0; i < resultSet.COLUMNS.length; i++) { columnMapping[resultSet.COLUMNS[i]] = i; } //loop through the data object and get the corresponding value as it maps to the column. //for this example, we will add the query row to an array and then dump the output. $.each(resultSet.DATA, function (index, item) { //Coldfusion returns fields in caps. sampleArray.push({ username: item[columnMapping.USERNAME], address: item[columnMapping.ADDRESS], birthday: item[columnMapping.BIRTHDAY] }); }); console.log(sampleArray); } });
That's it! You now have an array of objects from coldfusion.