Marker alle checkboxe

function toggleCheckboxes(objImg){
  var inputs = objImg.form.getElementsByTagName('input');
  var i = 0;
  var length = inputs.length;

  if(objImg.src=='images/knapper/all.gif'){
      var boolChecked = true;
      objImg.src = 'images/knapper/none.gif';
  }else{
      var boolChecked = false;
      objImg.src = 'images/knapper/all.gif';
  }

  for(i=0;i<=length;i++){
      if(inputs[i].getAttribute('type')=='checkbox'){
        inputs[i].checked=boolChecked;
      }
  }
}

<form>
<input type="checkbox" name="chk1" name="chk1">
<input type="image" src="images/knapper/all.gif" onclick="toggleCheckboxes(this)">
</form>

utestet!

det kan sikkert laves smartere, og man kunne også lave det så den skifter billedet til fjern alle billedet, når man manuelt vælger alle checkboes, men det er jo en detalje :)

Ja, det er noget derhen ad. Men det går ikke at det er denne type knap der aktivere det:
<input type="image" src="images/knapper/all.gif" onclick="toggleCheckboxes(this)">

det skal være et almindeligt billede som dette:
<img onclick="toggleCheckboxes(this);" style="cursor:pointer;" src="images/knapper/vælgalle.gif" alt="Marker alle">

Kan det lade sig gøre?

ja det skulle der ikke være noget i vejen for, det er bare at kalde den et img i stedet for input og så fjerne type="image"

det prøvede jeg også, men så virkede det ikke?

virker:

<img src="images/knapper/all.gif" onclick="toggleCheckboxes(this)">

ikke?

i<=length skal være i<length

if(objImg.src=='images/knapper/all.gif'){
skal være if(objImg.src.indexOf('all')!=-1){
(eller lignende der måske rammer lidt bedre)

objImg.form.getElementsByTagName('input');
skal nok være objImg.parentNode.getElementsByTagName('input');
eller ramme formen via. name istedet (objImg.form er ikke formen)

Forkortet f.eks. med name="noget" som forms name

function toggleCheckboxes(objImg){
  var inputs = document.noget.getElementsByTagName('input');
  var boolChecked=(objImg.src.indexOf('all')!=-1);
  objImg.src = 'images/knapper/'+(boolChecked?'none':'all')+'.gif';
  for(var i=0;i<inputs.length;i++){
      if(inputs[i].getAttribute('type')=='checkbox'){
        inputs[i].checked=boolChecked;
      }
  }
}

<form name="noget">
<input type="checkbox" name="chk1" name="chk1">
<img src="images/knapper/all.gif" onclick="toggleCheckboxes(this);">
</form>

nej this.form virker vel ikke når det er et img og ikke et form element?

jeg forstår dog ikke:

if(objImg.src.indexOf('all')!=-1){

kan ikke se hvorfor det i mit eksempel ikke skulle gøre det rigtige, men i og med at du laver

objImg.src = 'images/knapper/'+(boolChecked?'none':'all')+'.gif';

er det jo underordnet i det her tilfælde.

"nej this.form ..." - Nemlig

...

if(objImg.src.indexOf('all')!=-1){
- Den tjekker bare på om det er "all" billedet der vises, din
tjekkede også på om det var billedet og at stierne passede.
Passer stien er der jo intet problem, så "skal være" er forkert,
burde have været "er måske bedre med", jeg beklager ordvalget.

- Det var et forsøg på evt. at fange en src check fejl, src vil jo ikke være 'images/knapper/all.gif' men derimod http://.../images eller file:///X:/.../images eller lignende, så hvis spørger glemte at tilrette src checket selvom filerne placeres rigtige steder ville den ikke virke.

F.eks. vil den første ved test hos mig slå fejl:
<script type="text/javascript">
function toggleCheckboxes(objImg){
  objImg.src = 'images/knapper/all.gif';
  alert(objImg.src=="images/knapper/all.gif");
  alert(objImg.src.indexOf('all')!=-1);
}
</script>
- mens den anden slår fint igennem ... øges src check urlen til domænenavn eller localhost ved offline lokal test virker det fint.

...

Sidste indlæg var egentlig bare for at forkorte det lidt ned,
dog er det sjældent mere overskuelig, når det er forkortet.

Det virker jo mere efter hensigten. Bare lige et spørgsmål. hvis jeg retter.
var boolChecked=(objImg.src.indexOf('checkall')!=-1);

objImg.src = 'images/knapper/'+(boolChecked?'none':'all')+'.gif';
til
objImg.src = 'images/knapper/'+(boolChecked?'uncheckall':'checkall')+'.gif';

så markere den alle checkboxe og skifter billedet, men man kan så ikke fra vælge igen og den skifter heller ikke billedet tilbage

var boolChecked=(objImg.src.indexOf('checkall')!=-1);
vil matche på både checkall og (un)checkall, så prøv med:
var boolChecked=!(objImg.src.indexOf('uncheckall')!=-1);

eller ... var boolChecked=(objImg.src.indexOf('uncheckall')==-1);

Ja, så virker det efter hensigten. mange tak for hjælpen til jer begge :)

-> #11 - der er jeg ikke enig, hvis han sætte billede-stien til images/knapper/all.gif er det jo det stien er - det er sådan han selv viser den i sin kode i #0.

-> #15 - selv tak - jeg lærte også lidt denne gang :)

#16 - Næh, men selvom man sætter billede stien til
images/knapper/all.gif er src på billedet ikke lig det.
(Enig eller uenig, så lagde jeg et eksempel tidligere i
tråden, men ligger lige et mere, der er hurtigt at køre,
- såfremt vi senere skulle vælge at blive enige om at man
godt kan tildele "images/knapper/all.gif" men at man ikke
kan nøjes med at checke på om src=="images/knapper/all.gif")


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">
function toggleCheckboxes(objImg){
  var imgsrc='images/knapper/all.gif';
  objImg.src = imgsrc;
  alert(objImg.src+"\n==\n"+imgsrc+"\n==\n"+(objImg.src=="images/knapper/all.gif"));
  alert("'"+objImg.src+"'.indexOf('all')!=-1\n==\n"+(objImg.src.indexOf('all')!=-1));
}
</script>

</head><body><img src="images/knapper/all.gif" onclick="toggleCheckboxes(this);" alt="billede"></body></html>

#15 - Det var blot en lille finjustering jeg
kom med, men velbekom, og tak for point. :)

Apropo vedr. src problematikken så hvis der var blevet brugt
getAttribute istedet for blot src, så ville den have virket.
- Hmm, den detalje havde jeg overset, så der opdagede jeg
lige en fordel ved getAttribute som jeg ikke lige kendte.

(test)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">
function toggleCheckboxes(objImg){
  var inputs = document.noget.getElementsByTagName('input');
  var boolChecked=(objImg.src.indexOf('all')!=-1);
  objImg.src = 'images/knapper/'+(boolChecked?'none':'all')+'.gif';
  alert(objImg.getAttribute("src")+"\nvs\n"+objImg.src);
}

</script>

</head><body><form name="noget">
<input type="checkbox" name="chk1" name="chk1">
<img src="images/knapper/all.gif" onclick="toggleCheckboxes(this);">
</form> </body></html>

-> #17 - okay, det er heller ikke fordi jeg er sikker, jeg ville bare mene at det var sådan, men jeg kan godt se at det ikke er tilfældet :)

lukketid?