Markera flera checkboxar med ett klick

Hej hopp...!

Jag har 2 stycken formulär med checkboxar på en sida. Det är två olika GUI för att göra samma sak. Därmed vill jag att om man markerar en checkbox i det ena formuläret så ska motsvarande checkbox i det andra formuläret vara ikryssat.

Hur åstakommer man något liknande på ett smidigt sätt.`?

Ett sätt:

<script type="text/javascript">
var f1, f2;
window.onload = function() {
   f1 = document.forms["f1"].elements;
   f2 = document.forms["f2"].elements;
}
</script>

...

<form name="f1">
<input type="checkbox" name="c1" onclick="f2.c1.checked = this.checked" />
<input type="checkbox" name="c2" onclick="f2.c2.checked = this.checked" />
<input type="checkbox" name="c3" onclick="f2.c3.checked = this.checked" />
<input type="checkbox" name="c4" onclick="f2.c4.checked = this.checked" />
</form>

<form name="f2">
<input type="checkbox" name="c1" onclick="f1.c1.checked = this.checked" />
<input type="checkbox" name="c2" onclick="f1.c2.checked = this.checked" />
<input type="checkbox" name="c3" onclick="f1.c3.checked = this.checked" />
<input type="checkbox" name="c4" onclick="f1.c4.checked = this.checked" />
</form>

Ser lovande ut. Ska testa. Tack snälla :)

Vad gör funktionen ???

Och hur gör jag om jag loopar ut formuläret via for / next loop.

Går det att skriva:

<input type="checkbox" name="c<%=myCounter%>" onclick="f2.cc<%=myCounter%>.checked = this.checked" />

mattiasnordin skrev:

Vad gör funktionen ???

Om jag tittar på en enskild checkbox:

<input type="checkbox" name="c1" onclick="f2.c1.checked = this.checked" />

När jag klickar i/ur den letar den upp checkboxen med namnet c1 i formuläret f2 (f2 är en variabel som håller elementen i formuläret med namnet f2 - titta i window.onload-funktionen). Den checkboxen får samma checked-värde som den checkboxen jag klickar i/ur.

mattiasnordin skrev:

Och hur gör jag om jag loopar ut formuläret via for / next loop.

Går det att skriva:

<input type="checkbox" name="c<%=myCounter%>" onclick="f2.cc<%=myCounter%>.checked = this.checked" />

Ja, det går bra, så länge f2 håller en checkbox med namnet ccn.

Hmm... jag får det bara att fungera åt ena hållet.

Form_master.req_fil is null or not an object fel får jag...

Jag har de olika formulären i varsin <%sub%> som anropas på sidan. Har det någon betydelse i sammanhanget.

My bad... Stavade fel...

Nedan fungerar. Men jag förstår fortfarande inte varför
functionen nedan behöver existera. Det fungerar för mig utan denna.

<script type="text/javascript">
var f1, f2;
window.onload = function() {
f1 = document.forms["f1"].elements;
f2 = document.forms["f2"].elements;
}
</script>

Nedan använder jag...

... Loop 1 ...
<input type="checkbox" value="<%=varHardCounter%>" name=req_hardrive_box_<%=varHardCounter%> onclick="form_master.req_fil_<%=varHardCounter%>.checked = this.checked" /> (req_hardrive_box_<%=varHardCounter%>)

... Loop 2 ...			
<input type="checkbox" value="" name="req_fil_<%=varRowsNum%>" onclick="form_slave.req_hardrive_box_<%=varRowsNum%>.checked = this.checked" />(req_fil_<%=varRowsNum%>)

mattiasnordin skrev:

My bad... Stavade fel...

Nedan fungerar. Men jag förstår fortfarande inte varför
functionen nedan behöver existera. Det fungerar för mig utan denna.

<script type="text/javascript">
var f1, f2;
window.onload = function() {
f1 = document.forms["f1"].elements;
f2 = document.forms["f2"].elements;
}
</script>

Betrakta följande formulär

<form name="f">

För att referera till formuläret kan man skriva på flera olika sätt, t ex

var f1 = document.getElementsByTagName("FORM")["f"];
var f2 = document.getElementsByName("f")[0];
var f3 = document.forms["f"];
var f4 = document.f;
var f5 = f;

De fem variablerna refererar allihopa till samma formulär - det enda som skiljer är hur vi kommer åt formuläret.
När du utelämnar window.onload-funktionen använder du samma metod som i f5, medan jag, genom window.onload-funktionen, använde metoden i f3.
Att skriva som du gjorde är inte lika snyggt (om du frågar mig), men jag vågar inte säga att det är fel. Om du använder en riktig doctype så att Firefox ställer sig i Standards Mode får du dock se att f5 kommer att bli fel, så om jag vore du skulle jag nog satsa på att använda window.onload-funktionen ändå.

Ok. Tack för en bra beskrivning !