Som den er nu, er den stærkt afhængig af navngivningsskemaet, og det vil være irriterende at lave det ret meget om, men du kan jo teste om den gør som den skal:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<title>Tomt dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;border:0px;padding:0px;font-family:tahoma,verdana,arial,sans-serif;font-size:small;}
table{border-collapse:collapse;}
td{padding:0 5px;vertical-align:bottom;text-align:center;border-bottom:1px solid black;}
h5{margin:2px 0;color:#c06;}
h6{margin:4px 0;color:red;font-style:italic;margin:0;padding:0;line-height:1;}
.noBorder{border:0;}
.marked{background:#6c3;font-weight:bold;}
</style>
<script type="text/javascript">
var pakke = new Array();
pakke[1] = ['vare1','vare2','vare3','vare4','vare5'];
pakke[2] = ['vare1','vare7','vare13','vare14','vare18'];
pakke[3] = ['vare6','vare8','vare13','vare17','vare19'];
function visBestilling(elm){
var f = elm.form,abort=false;
var varer = new Array(),txt="",num=0,pakkefuld;
for(i=1;i<=20;i++)varer[i]=false;
for(i=1;i<=3;i++){
pakkefuld = true;
for(j=0;j<pakke[i].length;j++){
pakkefuld = pakkefuld&&f.elements[pakke[i][j]].checked;
if(elm.name == pakke[i][j] && !elm.checked)
abort = true;
}
if(pakkefuld){
f.elements['pakke'+i].checked = true;
}else if(abort){
f.elements['pakke'+i].checked = false;
}
if(f.elements['pakke'+i].checked){
for(j=0;j<pakke[i].length;j++){
f.elements[pakke[i][j]].checked = true;
num = +pakke[i][j].replace(/^.*?(\d+)$/,"$1");
varer[num] = true;
}
txt += 'pakke' + i + "<br>";
}
}
for(i=1;i<=20;i++)
if(f.elements['vare'+i].checked&&!varer[i])
txt += 'vare' + i + "<br>";
document.getElementById('bestilling').innerHTML = txt;
}
</script>
</head>
<body>
<form style="float:left;margin:0 20px;">
<table>
<tr>
<td style="text-align:right;width:100px;"><h6 style="text-align:right;">Med i pakke:</h6></td>
<td> </td>
<td><h5>1</h5></td>
<td><h5>2</h5></td>
<td><h5>3</h5></td>
</tr>
<tr>
<td class="noBorder"><h6>Vare</h6></td>
<td class="noBorder" colspan="4"> </td>
</tr>
<tr>
<td><h5>Pakke 1</h5></td>
<td><input type="checkbox" name="pakke1" onclick="visBestilling(this)"></td>
<td class="marked">X</td>
<td>-</td>
<td>-</td>
</tr>
<tr>
<td><h5>Pakke 2</h5></td>
<td><input type="checkbox" name="pakke2" onclick="visBestilling(this)"></td>
<td>-</td>
<td class="marked">X</td>
<td>-</td>
</tr>
<tr>
<td><h5>Pakke 3</h5></td>
<td><input type="checkbox" name="pakke3" onclick="visBestilling(this)"></td>
<td>-</td>
<td>-</td>
<td class="marked">X</td>
</tr>
<tr>
<td height="12" colspan="5" class="noBorder"> </td>
</tr>
<tr>
<td><h5>Vare 1</h5></td>
<td><input type="checkbox" name="vare1" onclick="visBestilling(this)"></td>
<td class="marked">X</td>
<td class="marked">X</td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 2</h5></td>
<td><input type="checkbox" name="vare2" onclick="visBestilling(this)"></td>
<td class="marked">X</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 3</h5></td>
<td><input type="checkbox" name="vare3" onclick="visBestilling(this)"></td>
<td class="marked">X</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 4</h5></td>
<td><input type="checkbox" name="vare4" onclick="visBestilling(this)"></td>
<td class="marked">X</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 5</h5></td>
<td><input type="checkbox" name="vare5" onclick="visBestilling(this)"></td>
<td class="marked">X</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 6</h5></td>
<td><input type="checkbox" name="vare6" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td class="marked">X</td>
</tr>
<tr>
<td><h5>Vare 7</h5></td>
<td><input type="checkbox" name="vare7" onclick="visBestilling(this)"></td>
<td> </td>
<td class="marked">X</td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 8</h5></td>
<td><input type="checkbox" name="vare8" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td class="marked">X</td>
</tr>
<tr>
<td><h5>Vare 9</h5></td>
<td><input type="checkbox" name="vare9" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 10</h5></td>
<td><input type="checkbox" name="vare10" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 11</h5></td>
<td><input type="checkbox" name="vare11" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 12</h5></td>
<td><input type="checkbox" name="vare12" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 13</h5></td>
<td><input type="checkbox" name="vare13" onclick="visBestilling(this)"></td>
<td> </td>
<td class="marked">X</td>
<td class="marked">X</td>
</tr>
<tr>
<td><h5>Vare 14</h5></td>
<td><input type="checkbox" name="vare14" onclick="visBestilling(this)"></td>
<td> </td>
<td class="marked">X</td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 15</h5></td>
<td><input type="checkbox" name="vare15" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 16</h5></td>
<td><input type="checkbox" name="vare16" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 17</h5></td>
<td><input type="checkbox" name="vare17" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td class="marked">X</td>
</tr>
<tr>
<td><h5>Vare 18</h5></td>
<td><input type="checkbox" name="vare18" onclick="visBestilling(this)"></td>
<td> </td>
<td class="marked">X</td>
<td> </td>
</tr>
<tr>
<td><h5>Vare 19</h5></td>
<td><input type="checkbox" name="vare19" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td class="marked">X</td>
</tr>
<tr>
<td><h5>Vare 20</h5></td>
<td><input type="checkbox" name="vare20" onclick="visBestilling(this)"></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</form>
<div style="float:left;text-align:center;">Bestilling:<br>
<span id="bestilling"></span>
</div>
</body>
</html>
