Checkbox

Hvordan anvendes en checkbox som input

Fil:Js checkbox.PNG

Eksempel på checkbox

En checkbox er et element, hvor man kan angive om det skal være checked eller ej.

Normalt anvendes det som en samling af elementer der hører sammen, og håndteres som sådan, men i princippet er det individuelle elementer.

En kode til checkboxen kan se ud som følger:

<form name="myForm">
Checkbox 1<input type="checkbox" id="inCheck1" /><br />
Checkbox 2<input type="checkbox" id="inCheck2" /><br />
Checkbox 3<input type="checkbox" id="inCheck3" /><br />
<input type="button" onClick="testFormular();" value="Test formularen">
<input type="reset" name="InRes" value="Reset" /><br />
</form>

input i checkbox med forslag til værdi

Man kan indstille så en eller flere af checkboxene er checked når siden loades:

Checkbox 1<input type="checkbox" id="inCheck1" /><br />
Checkbox 2<input type="checkbox" checked="checked" id="inCheck2" /><br />
Checkbox 3<input type="checkbox" checked="checked" id="inCheck3" /><br />

I programmeringssprog kaldes værdien for en default værdi.

Eksempel på anvendelse af input ved en checkbox

Når man klikker på knappen i eksemplet, så kaldes funktionen testFormular(), der ser ud som følger:

function testFormular() {
	
	// Værdien af de 3 checkboxe den modtages input på vises i en alert
	if (document.getElementById("inCheck1").checked) {
		alert("Checkboks 1 er sat");
	} else {
		alert("Checkboks 1 er ikke sat");
	}

	if (document.getElementById("inCheck2").checked) {
		alert("Checkboks 2 er sat");
	} else {
		alert("Checkboks 2 er ikke sat");
	}

	if (document.getElementById("inCheck3").checked) {
		alert("Checkboks 3 er sat");
	} else {
		alert("Checkboks 3 er ikke sat");
	}
	
	// Formen resettes for brugeren
	myForm.reset();
}

Filen med koden kan hentes i en zip-fil

Webcode
JavaScript	Sekvens
PHP	Header - Include