<table id="tab1" align="center">
<tr>
<td>

<input type="checkbox" onclick="return callme();"
<cfif structKeyExists(form,'chkbox3')> checked="checked"</cfif> name="chkbox3" id="chkbox3">
<strong> All Employees</strong>

<input type="checkbox" onclick="return callme1();" <cfif NOT structKeyExists(form,'fieldnames') OR structKeyExists(form,'chkbox1') OR (structKeyExists(form,'fieldnames') and structKeyExists(form,'chkbox1'))> checked="checked"</cfif> name="chkbox1" id="chkbox1" />
<strong> Agreement Only</strong>

<input type="checkbox" onclick="return callme1();" <cfif NOT structKeyExists(form,'fieldnames') OR structKeyExists(form,'chkbox2') OR (structKeyExists(form,'fieldnames') and structKeyExists(form,'chkbox2'))> checked="checked"</cfif> name="chkbox2" id="chkbox2"/>
<strong>Active Employees</strong>

</th>
<td><input type="Submit" name="submitnow" value="View Selected" class="button1">
</th>
<td><input type="button" name="Back" value="Back to Previous Menu" onclick="javascript:document.location.href('qualyrs_maint.cfm');" class="button1"></th>

</tr>
</table>

I have 3 checkboxes , out of which the last two needs to be checked on page load and show query results accordingly. When the first one is checked when the last two should be unchecked and show the query results accordingly.

Now I have a sorting column feature on the page. Like this

<cfif isdefined("form.order_by") and form.order_by eq "EMPLID">
background-color:##<cfif sort_order eq "asc">666666<cfelse>000000</cfif></cfif>;"
onClick="sortBy('EMPLID');Sorting.style.display='block';">
EMPLID
<cfif isdefined("form.sort_order") and isdefined("form.order_by") and ucase(form.sort_order) eq 'ASC' and ucase(form.order_by) eq 'EMPLID'>
<img src="images/desc.jpg">
<cfelseif isdefined("form.sort_order") and isdefined("form.order_by") and ucase(form.sort_order) eq 'DESC' and ucase(form.order_by) eq 'EMPLID'>
<img src="images/asc.jpg">
</cfif>

This is the JS for that

<script language="Javascript">
function sortBy(order) {
foo = document.getElementById("order_by_id");
bar = document.getElementById("sort_order_id");
<!---if (foo.value == order) {
//same thing again, so flip the sort
if (bar.value == 'DESC'){
bar.value = 'ASC';
}
else{
bar.value = 'DESC';}
//bar.value = bar.value == "ASC" ? "DESC" : "ASC";
} else {
//new sort order, so make it ASC
bar.value = "ASC";
}--->
foo.value = order;
sort.submit();
}



function callme1() {
var one= document.getElementById('chkbox1');
var two= document.getElementById('chkbox2');
var three= document.getElementById('chkbox3');
if (one.checked == true || two.checked == true)
{
three.checked = false;
return true;

}

}

</script>

I have everything working as I need, except that, on the page load when the last two checkboxes are checked, and I hit the sort column icon, then the page is submitted and the first checkbox is getting checked. Please advice as to where my code is going wrong. thanks