...

View Full Version : Resolved access table cell values in row with checked checkbox?



sophie_pocket
01-04-2012, 11:37 PM
I was wondering if anyone could help me with getting this working.

I'm using html to create a table which has at least 1 row but no max number of rows - as they can be added/removed by the user - and 4 columns, 1st contains a checkbox and the last 2 contain drop down menus.

I wish to be able to store the values of those menus in an array only if that row's checkbox has been checked. e.g if the first row has 1 and A as it's dropdown values and the second row has 2 and B. If only row 1 has been checked the array should only contain [1,A]. Instead mine holds all the values including the non-checked ones i.e [1,A,2,B].

My code for javascript function and html table are below:



function calculate(textID){
var table = document.getElementById('course'); //id of table
var rowCount = table.rows.length;
var array = []; //array to hold the values
var c = 0;

dmenus = document.getElementByTagName("select"); //get the drop down menus

for(var a = 1; a < rowCount; i++){ //a = 1 as the 1st row contains column headings
var row = table.rows[a];
var check = row.cells[0].childNodes[0];
if(null != check && true == check.checked){
for(var b = 0; b < dmenus.length; b++){
val = dmenus[b].options[dmenus[b].selectedIndex].value;
array[c] = val; //set index of array to equal value of dropdown box
c++;
}
}else{
b++;
}
}

Html code for table:


<table id="course">
<tr>
<td><input type="checkbox" name="ucheck" id="ucheck" onclick="checkAll('course')"/></td>
<th style="color:white">Course Title</th>
<th style="color:white">Credits</th>
<th style="color:white">Grade</th>
</tr>
<tr>
<td><input type="checkbox" name="tick" id="tick"/></td>
<td><input type="text"/></td>
<td>
<select name="credits" id="credits">
<option...</select></td>
<td>
<select name="grade" id="grade">
<option...</td>


It works only for the first row but if there are more than 1 row it doesn't do what it's supposed to. The coding platform I'm working on does not seem to support jquery so javascript code will be most appreciated. Thanks :)

sophie_pocket
01-06-2012, 07:19 PM
Finally got it! rearranged code for it below:



var array = [];
var narray = [];
var a = 0;
var b = 0;
var c = 0;

ddownselects = document.getElementsByTagName("select");

//get all elements into one array
for(var j = 0; j<ddownselects.length; j++){
val = ddownselects [j].options[els[j].selectedIndex].value;
array[a] = val;
a++;
}

var rlen = array.length/2; //number of rows
for(var i = 1; i<= rlen; i++){
var row = table.rows[i];
var check = row.cells[0].childNodes[0];
if(check.checked){
narray[b] = array[c]; //set array values to new array only if that row is checked
b++;
c++;
narray[b] = array[c];
b++;
c++;

}else{
c+=2; //if not checked, got to next row's values
}
}

There's probably a more efficient way of doing it but hey works for me :D



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum