checkbox 2d array

Question

I have a very tricky situation. I have a list of skills each with a level of 1,2,3 which are represented as check boxes besides each skill name. These skills are pulled out of a database. Without skill levels, the normal thing would be to assign the value of the checkbox to be the ID of the skill ( which goes into the checkbox array ). Is there any way to store the values in a 2 dimensional array so that I can access the skill which was checked and also the skill level that was checked? I also need to validate these via Javascript so that the maximum skill level of all the skills that the user chooses does not exceed 5.

This is the code I have written but I cannot retrieved the checked values via Javascript:

$sql = "select * from Skill where Active=1";
    $res = mysql_query($sql);
    $count=0;
    echo '<tr>';
    while ($rr=mysql_fetch_assoc($res))
    {
    echo '<td>';
    echo "<input type=\"checkbox\" name=\"skill[][".$rr['SkillID']."]\" value=\"1\" /><span></span></input>";
    echo "<input type=\"checkbox\" name=\"skill[][".$rr['SkillID']."]\" value=\"2\" /><span></span></input>";
    echo "<input type=\"checkbox\" name=\"skill[][".$rr['SkillID']."]\" value=\"3\" /><span>".$rr['Name']."</span></input>";
    echo '</td>';
    $count++;
    if ($count % 3 == 0)
    {
    echo '</tr><tr>';
    }
    }

Any help would be much appreciated.

Thanks!

Answer 1

Instead of

<input ... name=\"skill[][".$rr['SkillID']."\" ... />

Try

<input ... name=\"skill[]\" id=\"skill_".$rr['SkillID']."\" value=\"1" ... />

Then, to determine the total skill level checked, you can use jQuery:

<script language="javascript">
    $("input[name=skill[]]").click(function() {
        var total = 0;
        $("input[name=skill[]]:checked").each(function() {
            total += $(this).val();
        });
        if (total > 5) {
            alert("Skill level too high.");
        }
    });
</script>

Answer 2

How about this:

<input name="skill[SKILL_ID][1]" value=1>
<input name="skill[SKILL_ID][2]" value=1>
<input name="skill[SKILL_ID][3]" value=1>
.
.
.
<input name="skill[NEXT_SKILL_ID][1]" value=1>
<input name="skill[NEXT_SKILL_ID][2]" value=1>
<input name="skill[NEXT_SKILL_ID][3]" value=1>