i have created an online assessment form and have been able to total the form as a percentage. I now need to sum certain radio buttons which have been categorised by category and insert the results in the table at the bottom of the page in the "results" table. I have been trying to figure this out for 3 days now and would greatly appreciate some help with the coding. My script is very long as I have 8 categories and 40 questions in this form so if you coiuld please view it live online and assist: www.creditincontrol.co.za . Thanks a million!
You have only to make tests to know if the names of buttons contain keywords like : career, home, money, personal, recreation, relationship, spirit and wellness. With an array (cat) for category and ttc for totals, you have only to modify the total function
Code:
function total(frm) {
var tot=0,ttc=[0,0,0,0,0,0,0,0];
var cat="career,home,money,personal,recreation,relationship,spirit,wellness".split(',');
var cct="10/6,...".split(',');
for(var i=0; i<frm.elements.length; i++) {
if(frm.elements[i].type=="checkbox" || frm.elements[i].type=="radio") {
if(frm.elements[i].checked) tot+=Number(frm.elements[i].value);
for(var j=0; j<cat.length; j++) {
if (new RegExp(cat[j]).test(frm.elements[i].name)) {ttc[j]++;break;}
}
}
}
document.getElementById("totalDiv").firstChild.data=tot*4/8+"%";
// Display the values with id (for the td tags *) : idcareer, idhome, idmomey...
for(var j=0; j<cat.length; j++) {// to adapt with coefficients by category
document.getElementById("id"+cat[j]).innerHTML=ttc[j]*cct[j]+"%";}
}
}
NB : It's not useful to insert div in td tags and you have to div with the same id (which must be unique) totalDiv
You're a genius!!!! Thanks so much! Please can you help me with the code in getting these category totals to display in the "results" table at the bottom of the page? They should start displaying a result as soon as the first radio button group is clicked.
The div and font tags of the last table (with an id lasttable) would be to replace by an unique style (align-left is the default value).
Code:
<style type "text/css">
#lasttable td{font-size:3}
</style>
NB : An error (among others ?) : the ttc[j]++ (in total function) is probably to replace by a ttc[j]+=Number(frm.elements[i].value);
Last remark : it could be better to define an local var currentElement = frm.elements[i]; in the first loop of this function to avoid multiple calls to this global indicated variable.
Thanks for the additional coding. I've done as you advised and have changed the necessary code....no errors coming up but the results for individual categories are not displaying in the "results" table... Please can you look at my last updated code and see what I have done wrong? Thanks a million for your help....it's greatly appreciated!
This function (brackets were missing) and an id="idmoney" instead an id="idmomey" should solve your problems...
Code:
function total(frm) {
var tot=0,ttc=[0,0,0,0,0,0,0,0];
var cat="career,home,money,personal,recreation,relationship,spirit,wellness".split(',');
for(var i=0; i<frm.elements.length; i++) {
var curElement = frm.elements[i];
if(curElement.type=="radio" && curElement.checked) {
tot+= Number(curElement.value);
for(var j=0; j<cat.length; j++){
if (new RegExp(cat[j]).test(curElement.name)){// alert(j+' '+curElement.name)
ttc[j]+=Number(curElement.value);break;}}}
}
document.getElementById("totalTd").innerHTML=(tot>>1)+"%";
for(var j=0; j<cat.length; j++) {
document.getElementById("id"+cat[j]).innerHTML=(ttc[j]<<2)+"%";
frm["current"+cat[j]+"total"].value=(ttc[j]<<2)+"%";
}
}
I remove the curElement.checkbox (no checkbox) and the array cct (all coefficients are 4). I add a last line to fill too the hidden inputs of the form...
I remove to the useless div totalD and add an id totalTd.
Then the page finish like this
Thanks a million for the additional code. Have now finished phase 2 of 4 of this project. Next phase (3) is to insert radar chart to show results per category. Am researching options today...
See the Raphaël library to build a radar chart. I use it to build this new clock...
An minor error which round the results.
Code:
// This line which make a integer division
document.getElementById('totalTd').innerHTML = (tot >> 1) + '%';
// is to replace by this
document.getElementById('totalTd').innerHTML = (tot/2) + '%';
Sum radio buttons by category
Reply With Quote
Bookmarks