[SOLVED] Javascript, binary counting, and check boxes

[guyfromfl]

I am building a calculator for customers so they can configure their product easier.

 

The section in question is CV21

http://bli.servehttp.com/bli/knowledgebase/calculator.php#cv21

 

What should happen is each Fx has a binary bit weight so if it is checked the corresponding bit should be set to 1.

 

Basically what that means, if you select the front template, all boxes are checked, the decimal value should be 255 and binary should be 11111111.

 

I am getting 36 and 00100100 on the front instead.

 

Here is the code I am using:

/*
* Get Decimal value for CV21 by what boxes are checked
*/
function calcCV21() {

var me = document.frmCVCalc;	// Document shortcut
var funcList = me.cv21F;		// Checkbox array
var cv21 = 0;					// Reset CV21

// Loop Each element in array and add binary value if checked
for (var i=0; i<funcList.length; i++) {
	if (funcList[i].checked == true) {
		cv21 += 2^(i+1);
	}
}

// send back the goods
return cv21;

}

/*
* Validate the form, and configure it depending on what the user wants
*/

function calcCV21Config(config) {
var me = document.frmCVCalc;	// Document shortcut
var cv21 = 0;					// Cumulative value of CV21
var cv21Check = 0;				// Running balance of CV21

// Clear all check boxes
for (var i=0; i < me.cv21F.length; i++) {
	me.cv21F[i].checked = false;
}

// Select default configurations if template is selected		
switch(config) {
	case ("front"):
		// Select all
		for (var i=0; i<me.cv21F.length; i++) {
			me.cv21F[i].checked = true;
		}
		break;
	case ("middle"):
		me.cv21F[7].checked = true;
		break;
	case ("rear"):
		me.cv21F[7].checked = true;
		break;
}

// Get cv21 value by what is checked	
cv21 = calcCV21();

cv21Check = cv21;					// test variable
me.cv21DEC.value = cv21;			// set Decimal value in textbox
me.cv21BIN.value = decTObin(cv21);	// set Binary value in textbox

// Run throuh each element and do some binary math
if ((cv21 - 127) > 0) {
	me.cv21F[7].checked = true;
	cv21Check -= 127;

} 

if ((cv21Check - 63) > 0) {
	me.cv21F[6].checked = true;
	cv21Check -= 63;
}

if ((cv21Check - 31) > 0) {
	me.cv21F[5].checked = true;
	cv21Check -= 31;
}

if ((cv21Check - 15) > 0) {
	me.cv21F[4].checked = true;
	cv21Check -= 15;
}

if ((cv21Check - 7) > 0) {
	me.cv21F[3].checked = true;
	cv21Check -= 7;
}

if ((cv21Check - 3) > 0) {
	me.cv21F[2].checked = true;
	cv21Check -= 3;
}

if ((cv21Check - 1) > 0) {
	me.cv21F[1].checked = true;
	cv21Check -= 1;
}

if (cv21Check > 1) {
	me.cv21F[0].checked = true;
}


}

 

and suggestions???

[KevinM1]

Why are you subtracting at the end of your validation function?  calcCV21 already returns the accumulated binary value based on what's been checked.

[guyfromfl]

I was subtracting because it was figuring what bits were used..

 

I changed the code to run through the array and do it there by raising 2 to that power..

(bit0 is 2^0, bit1 2^1 and so on)

 

I still don't get the right results.

 

Here is the cleaned up code:

function calcCV21() {
// Declare variables
var me = document.frmCVCalc;				// Document shortcut
var funcList = me.cv21F;					// Checkbox array
var cv21 = 0;								// Reset CV21

// Loop Each element in array and add binary value if checked
for (var i=0; i<funcList.length; i++) {
	if (funcList[i].checked == true) {
		cv21 += 2^(i);
	}
}

// Set output values
me.cv21DEC.value = cv21;					// Decimal value
me.cv21BIN.value = decTObin(cv21);			// Binary value


// return
return;

}

function calcCV21Config(config) {
// Declare variables
var me = document.frmCVCalc;	// Document shortcut
var cv21 = 0;					// Cumulative value of CV21

// Clear all check boxes
for (var i=0; i<me.cv21F.length; i++) {
	me.cv21F[i].checked = false;
}

// Select default configurations if template is selected		
switch(config) {
	case ("front"):
		// Select all
		for (var i=0; i<me.cv21F.length; i++) {
			me.cv21F[i].checked = true;
		}
		break;
	case ("middle"):
		me.cv21F[7].checked = true;
		break;
	case ("rear"):
		me.cv21F[7].checked = true;
		break;
}

// Get cv21 value by what is checked	
calcCV21();
}

[KevinM1]

Figured it out.  To use an exponent in JavaScript, you need to use:

Math.pow(a, b); //a^b

 

The '^' isn't an exponent operator in this language.

 

EDIT: Working test code:

<html>
<head>
   <title>Blah</title>
   <script type="text/javascript">
      function decToBin(num)
      {
         var bits = [];
         var dividend = num;
         var remainder = 0;

         while(dividend >= 2)
         {
            remainder = dividend % 2;
            bits.push(remainder);
            dividend = (dividend - remainder) / 2;
         }

         bits.push(dividend);
         bits.reverse();
         return bits.join("");
      }

      window.onload = function()
      {
         var checkboxes = document.getElementsByTagName("input");
         var checkboxesLength = checkboxes.length;
         var decResults = document.getElementById("decResults");
         var binResults = document.getElementById("binResults");

         for(var i = 0; i < checkboxesLength; i++)
         {
            checkboxes[i].onclick = function()
            {
               var results = 0;

               for(var j = 0; j < checkboxesLength; j++)
               {
                  if(checkboxes[j].checked)
                  {
                     results += Math.pow(2, j);
                  }
               }

               decResults.innerHTML = "Decimal number: " + results;
               binResults.innerHTML = "Binary equivalent: " + decToBin(results);
            };
         }
      }
   </script>
</head>

<body>
   <form action="#" method="post">
      1 <input type="checkbox" name="binary" /> 
      2 <input type="checkbox" name="binary" /> 
      3 <input type="checkbox" name="binary" /> 
      4 <input type="checkbox" name="binary" /> 
      5 <input type="checkbox" name="binary" /> 
      6 <input type="checkbox" name="binary" /> 
      7 <input type="checkbox" name="binary" /> 
      8 <input type="checkbox" name="binary" /> 
   </form>

   <div id="decResults"></div>
   <div id="binResults"></div>
</body>

</html>

[guyfromfl]

Thats it!!

 

Thanks for the help!