<script type='text/javascript'>_ajaxConfig = {'_cfscriptLocation':'query.cfc', '_jsscriptFolder':'../js'};</script> <script type='text/javascript' src='../js/ajax.js'></script> <script type="text/javascript"> function doQuery() { // send data to CF DWRUtil.useLoadingMessage(); DWREngine._execute(_ajaxConfig._cfscriptLocation, null, 'queryAll', null, doQueryResults); } // call back function function doQueryResults (r) { DWRUtil.removeAllRows("tableBody"); var getCheckBox = function (thisRow) { return '<input type="checkbox" onclick="if(this.checked) this.parentNode.parentNode.style.backgroundColor=\'6666CC\'; else this.parentNode.parentNode.style.backgroundColor=\'white\';">' } var getFirstName = function (thisRow) { return thisRow.fname; } var getLastName = function (thisRow) { return thisRow.lname; } var getPhone = function (thisRow) { return '<input type="text" name="phone" value="' + thisRow.phone + '">'; } var getActions = function (thisRow) { return '<input type="button" value="Edit User" onclick="alert(\'My UserId is ' + thisRow.id + '\')">'; } DWRUtil.addRows("tableBody", r, [getCheckBox, getFirstName, getLastName, getPhone, getActions], null); } </script> <fieldset> <legend>ajaxCFC query retrieval example using DWRUtil.addRows</legend> <table> <tbody id="tableBody"></tbody> </table> </fieldset>
<cfcomponent extends="ajax"> <cfscript> // didn't want to rely on a real db, so I defined manually the query here variables.q = queryNew('id,fname,lname,phone,location'); queryAddRow(q,1); querySetCell(q, 'id', 1); querySetCell(q, 'fname', 'Rob'); querySetCell(q, 'lname', 'Gonda'); querySetCell(q, 'phone', '954-555-5555'); querySetCell(q, 'location', 'Florida'); queryAddRow(q,1); querySetCell(q, 'id', 2); querySetCell(q, 'fname', 'Steve'); querySetCell(q, 'lname', 'Smith'); querySetCell(q, 'phone', '305-555-5555'); querySetCell(q, 'location', 'Miami'); queryAddRow(q,1); querySetCell(q, 'id', 3); querySetCell(q, 'fname', 'John'); querySetCell(q, 'lname', 'Dow'); querySetCell(q, 'phone', '212-555-5555'); querySetCell(q, 'location', 'New York'); </cfscript> <cffunction name="queryAll" output="no" access="private"> <cfreturn q /> </cffunction> </cfcomponent>