I have made this nice little table:
testPage.cfm:
<html>
<head>
<title>Test Page</title>
<style>
.blue{
background:#66CCFF;
padding: 1px 20px;
}
.red{
background:red;
padding: 1px 20px;
}
.blank{
background:#FFF;
padding: 1px 20px;
}
</style>
</head>
<body>
<cfform>
<cfinput type="checkbox" name="filters" value="blue" checked="yes"> Blue
<br />
<br />
<cfinput type="checkbox" name="filters" value="red" checked="yes"> Red
</cfform>
<cfdiv id="content" bind="cfc:TestCFC.displayTable({filters})"></cfdiv>
</body>
</html>
TestCFC.cfc:
<cfcomponent>
<cfscript>
remote function displayTable(filters){
var html = "";
var data = ArrayNew(1);
data[1] = 1;
data[2] = 2;
data[3] = 3;
data[4] = 4;
html = html & "<table>";
for(row = 0; row < 4; row++){
html = html & "<tr>";
for(column = 0; column < 2; column++){
html = html & '<td class="' & getCSS(data[row + 1], filters) & '">' & data[row + 1] & '</td>';
}
html = html & "</tr>";
}
return html;
}
private function getCSS(value, filters){
if(isIn("blue", filters) and value LTE 2)
return "blue";
else if(isIn("red", filters) and value GTE 3)
return "red";
else
return "blank";
}
private function isIn(item, list){
var array = ListToArray(list);
for(ndx = 1; ndx LTE ArrayLen(array); ndx += 1)
if(array[ndx] EQ item)
return True;
return False;
}
</cfscript>
</cfcomponent>
this works fine in FireFox but not so well in Internet Explorer, (hint: to get it to respond in IE you have to click an additional time somewhere on the screen)
IE version 7.0.6002.18005
ColdFusion 9
I found my own answer. Change
to
here’s the post that got me pointed in the right direction.