Page 1 of 1
Iterate multidimensional checkbox array
Posted: Tue Jul 03, 2007 11:28 am
by Benjamin
I'm trying to Iterate a checkbox array, but the total is always 0
Code: Select all
var total = 0;
for (var i = 0; i < document.form_name.style.length; i++)
{
for (var x = 0; x < document.form_name.style[i].length; x++)
{
if (document.form_name.style[i][x].checked)
{
total += 1;
}
}
}
Posted: Tue Jul 03, 2007 3:16 pm
by feyd
Can you provide the HTML it is working against?
Posted: Tue Jul 03, 2007 3:31 pm
by Benjamin
I'll see if I can grab it today, otherwise I'll post it Monday.
Posted: Tue Jul 03, 2007 3:34 pm
by Gente
Code: Select all
function count_calc()
{
var total = 0;
for (var i = 0; i < document.bar.length; i++)
{
if (document.bar.elements[i].type == 'checkbox')
{
total += 1;
}
}
}
Posted: Tue Jul 03, 2007 3:51 pm
by Benjamin
Thank you for the snippet, I'd rather know why mine is failing.
Here is an html sample..
Code: Select all
<form action="#" method="post" name="form_name">
<input name="style[3563447][2]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563447][1]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563447][8]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563447][4]" type="checkbox" onclick="return count_total();"value="1"/>
</form>
Posted: Tue Jul 03, 2007 4:15 pm
by Gente
Because as far as I know such name 'style[3563447][2]' doesn't mean you get an array in JS. We were discussing relative problems some threads ago.
Every form has elements property that is an associative array of all the inputs in the form.
document.form.input_name just an alias so it should be an input, not the array.
Also if you working with forms you can check this page -
http://developer.mozilla.org/en/docs/DOM:form
I think it will be useful
Posted: Tue Jul 03, 2007 4:16 pm
by feyd
form_name.style won't exist (as an element of the form.) Each of the names is unique therefore not an iterable array. You'll need to iterate the element list of the form like Gente shows.
Posted: Mon Jul 09, 2007 12:02 pm
by Benjamin
Ok, well that works ok, but there are still a few features I would like to add and I thought using the array indexes would be the best route. I believe this is why I am not fond of Javascript.
Say I have some HTML like this..
Code: Select all
<form action="#" method="post" name="form_name">
<input name="style[3563447][2]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563447][1]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563447][8]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563447][4]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563448][2]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563448][1]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563448][8]" type="checkbox" onclick="return count_total();"value="1"/>
<input name="style[3563448][4]" type="checkbox" onclick="return count_total();"value="1"/>
</form>
What would be the best way to ensure that style [3563447][2] and [3563448][2] cannot both be checked at the same time. I can't use radios and it's already done server side. I would like to add this on the client side as well.
Posted: Mon Jul 09, 2007 2:43 pm
by feyd
You'll have to check the name of the element firing the event and match it against the other elements sharing the names.
Posted: Mon Jul 09, 2007 2:51 pm
by Benjamin
Screw it.