Välja begränsat antal rutor

Hej
Nu är det jag igen med mina frågor om javascript.

Nu har jag ett problem igen.
Jag har ett formulär där jag har en tabell med 5x5 rutor.
Varje ruta har just nu en kryssruta. Nu vill jag att man bara ska kunna välja max 10 stycken av dessa och sedan ska de resterande bli gråa. Alla kanske inte är valbara från början och de kommer då att vara gråa, och ska naturligtvis förbli det när man valt 10 stycken.

Det var min lilla fråga. Hoppas någon fattade vad jag menade :r

Tack på förhand!

<form name="f">
    <table border="1">
	<tr>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	</tr>
	<tr>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	</tr>
	<tr>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	</tr>
	<tr>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	</tr>
	<tr>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	    <td><input type="checkbox"></td>
	</tr>
    </table>
</form>

<script type="text/javascript">

if (typeof Array.prototype.push == "undefined")
    Array.prototype.push = function() {
	var aLen = arguments.length,
	    tLen = this.length;

	for (var i = 0; i < aLen; ++i) this[tLen + i] = arguments[i];

	return this.length;
    }

var elms = document.forms["f"].elements,
    iLen = elms.length,
    dArr = [],
    iCur = iPrv = 0;

for (var i = 0; i < iLen; ++i)
    if (elms[i].type == "checkbox" && elms[i].disabled)
	dArr.push(elms[i]);

function disableUnchecked() {
    for (var i = 0; i < iLen; ++i)
	if (elms[i].type == "checkbox" && !elms[i].checked) elms[i].disabled = true;
}

function enableUnchecked() {
    var dArrLen = dArr.length;

    outer:
    for (var i = 0; i < iLen; ++i)
	if (elms[i].type == "checkbox") {
	    for (var j = 0; j < dArrLen; ++j)
		if (elms[i] == dArr[j]) continue outer;

	    elms[i].disabled = false;
	}
}

for (var i = 0; i < iLen; ++i)
    if (elms[i].type == "checkbox")
	elms[i].onclick = function() {
	    this.checked ? (iPrv = iCur++) : (iPrv = iCur--);

	    if (iCur == 10) disableUnchecked();
	    if (iPrv == 10) enableUnchecked();
	}

</script>

:)

Tackar Peter S

Mycket bra. Fungerade perfekt :)