Notifikationer

Markér alle som læst Log ud

downloading Nybegynder

21. juni 2006 - 22:51 Der er 24 kommentarer og
1 løsning

Fokuserer på en celle, og farve den

Hej.

Jeg har en tabel med en masse udfyldningsfelter i.
Jeg har så en tjek som min form udføre ved submit, den tjekker så om der er nogle af tingene der ikke er udfyldt. Er der det, skal den farve den række i tabellen, hvori udfyldningen er, og så "gå til rækken"...

Hvordan gøres det?

Mange tak!

Synes godt om

mclemens Nybegynder

21. juni 2006 - 23:00 #1

Eksempel:

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

<style type="text/css">

</style>

<script type="text/javascript">

function chkf(f){
chksub=true;
if(f.forste.value==""){chksub=false;f.forste.style.background="#aaa";f.forste.focus();}
else if(f.nr2.value==""){chksub=false;markf(f.forste);f.forste.style.background="#aaa";f.forste.focus();}
else if(f.denneogså.value==""){chksub=false;markf(f.forste);f.forste.style.background="#aaa";f.forste.focus();}
return chksub
}

</script>

</head><body>
<form method="get" action="#" onsubmit="return chkf(this);">

<input type="text" name="forste">
<input type="text" name="nr2">
<input type="text" name="denneogsaa">

<input type="submit" name="submitter" value="afsend">
</form>
</body></html>

Synes godt om

mclemens Nybegynder

21. juni 2006 - 23:10 #2

Et eksempel mere...

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

<script type="text/javascript">

function chkf(f){

chksub=true;tmpf="";
tmptxt="Du skal udfylde disse felter:";

inps=f.getElementsByTagName("input");
for(i=0;i<inps.length;i++){
if((inps[i].className=="inpreq")&&(inps[i].value=="")){
chksub=false;
if(tmpf=="")tmpf=inps[i];
inps[i].style.background="#aaa";
tmptxt+="\n"+inps[i].name;
}else inps[i].style.background="#fff";
}
if(!chksub){tmpf.focus();alert(tmptxt);}
return chksub
}

</script>

</head><body>
<form method="get" action="#" onsubmit="return chkf(this);">

<input type="text" name="Navn" class="inpreq">
<input type="text" name="Adresse" class="inpreq">
<input type="text" name="E-mail">

<input type="submit" name="submitter" value="afsend">
</form>
</body></html>

Synes godt om

mclemens Nybegynder

21. juni 2006 - 23:27 #3

[ Er der det, skal den farve den række i tabellen, hvori udfyldningen er, og så "gå til rækken"...
Hvordan gøres det? ]

- Kort forklaret:
elementforbindelse.style.background="#000000";
elementforbindelse.focus();

Synes godt om

downloading Nybegynder

21. juni 2006 - 23:39 #4

hmm..

Jeg har en tabel med alle de der felter osv i.

Jeg kalder i mit tjek således:

if (document.forms.test.elements['kon1'].checked == false &&
document.forms.test.elements['kon2'].checked == false) {

Nu skal den så tage fra min tabel "Test" og fokuserer på feltet "kon", og gøre 2 knapper farvede?

Synes godt om

mclemens Nybegynder

21. juni 2006 - 23:51 #5

[ Nu skal den så tage fra min tabel "Test" og fokuserer på feltet "kon", og gøre 2 knapper farvede? ]
- Nu kan jeg ikke se dit script i sammenhæng med struktur m.v. så...

if (document.forms.test.elements['kon1'].checked == false &&
document.forms.test.elements['kon2'].checked == false) {
document.forms.test.elements['kon'].focus();
document.forms.test.elements['knap1'].style.background="#ff0000";
document.forms.test.elements['knap2'].style.background="#ff0000";

- hvis ovenstående ikke er hvad du tænker på så mangler jeg umiddelbart html struktur og / eller nærmere angivelse da jeg ikke lige kan se / forstå hvad du ellers hentyder til...

Synes godt om

mclemens Nybegynder

22. juni 2006 - 00:05 #6

Det kan f.eks. være det her du mener?
[ Nu skal den så tage fra min tabel "Test" og fokuserer på feltet "kon", og gøre 2 knapper farvede? ]

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

<script type="text/javascript">

function chkf(f){
if(f.elements['kon1'].checked == false &&
f.elements['kon2'].checked == false) {
f.elements['kon'].focus();
f.elements['knap1'].style.background="#ff0000";
f.elements['knap2'].style.background="#ff0000";
return false;
}
}

</script>

</head><body>

<form method="get" action="#" onsubmit="return chkf(this);">

<table><tr><td><input type="text" name="kon"></td></tr></table>

<input type="checkbox" name="kon1">
<input type="checkbox" name="kon2">

<input type="button" name="knap1" value="knapnr1">
<input type="button" name="knap2" value="knapnr2">

<input type="submit" name="submitter" value="afsend">
</form>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

</body></html>

Synes godt om

downloading Nybegynder

22. juni 2006 - 00:07 #7

Mange tak for hjælpen, det er vildt fedt :)

Her er så en lille del

<form method="get" action="#" name="test" onsubmit="return chkf(this);">

<table border="0" width="100%" id="table1">
<tr>
<td><b>Hvad er dit køn?</b></td>
</tr>
<tr>
<td id="FeltKon"><input type="radio" value="1" name="kon" id="kon1">  Kvinde
<input type="radio" value="2" name="kon" id="kon2"></td>
</tr>
</table>

<input type="submit" name="submitter" value="afsend">
</form>

Det er så cellen "FeltKon" der skal laves en eller anden farve (fx gul) og så skal den gå til det felt..

Synes godt om

mclemens Nybegynder

22. juni 2006 - 00:18 #8

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

<script type="text/javascript">

function chkf(f){
if((!f.kon[0].checked)&&(!f.kon[1].checked)){
document.getElementById("FeltKon").style.background="#ffff00";
f.kon[1].focus();
return false
}else return true;
return false;
}

</script>

</head><body>

<form method="get" action="#" name="test" onsubmit="return chkf(this);">

<table border="0" width="100%" id="table1">
<tr>
<td><b>Hvad er dit køn?</b></td>
</tr>
<tr>
<td id="FeltKon"><input type="radio" value="1" name="kon" id="kon1">  Kvinde
<input type="radio" value="2" name="kon" id="kon2">Mand</td>
</tr>
</table>
<input type="submit" name="submitter" value="afsend">
</form>

</body></html>

Synes godt om

mclemens Nybegynder

22. juni 2006 - 00:19 #9

- Tryk på space efter tryk på knappen for at teste at den har focuseret

Synes godt om

mclemens Nybegynder

22. juni 2006 - 00:22 #10

f.kon[1].focus(); Måske rettes til ->
document.getElementById("FeltKon").focus();
- Så den ikke focuserer på radio'en men td'en

Synes godt om

downloading Nybegynder

22. juni 2006 - 00:46 #11

mange tak for al hjælpen.. Men jeg kan ikke få den til at fokusere på td'en?

Synes godt om

mclemens Nybegynder

22. juni 2006 - 00:57 #12

Hmm, FF vil åbenbart ikke - så focuser istedet på første
checkbox f.kon[0].focus(); eller nr. 2 f.kon[1].focus();

Synes godt om

mclemens Nybegynder

22. juni 2006 - 00:59 #13

- Hov kan godt se en fejlen i FF nu ...

Synes godt om

downloading Nybegynder

22. juni 2006 - 01:04 #14

forstod jeg ikke lige?

Jamen det er fordi designet er lavet til at den fokuserer på feltet (faktisk et felt ligeoven over)

Synes godt om

mclemens Nybegynder

22. juni 2006 - 01:20 #15

Hmm, FF vil ikke focusere på den ... :/
- Prøver lidt forskelligt...

Synes godt om

mclemens Nybegynder

22. juni 2006 - 01:23 #16

Arg sovetid her er et eksempel på fusk...

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

<script type="text/javascript">

function chkf(f){
if((!f.kon[0].checked)&&(!f.kon[1].checked)){
document.getElementById("FeltKon").style.background="#ffff00";
document.getElementById("FeltKont").focus();
return false
}else return true;
}

</script>

</head><body>

<form method="get" action="#" name="test" onsubmit="return chkf(this);">

<table border="0" width="100%" id="table1">
<tr>
<td><a href="#" id="FeltKont"></a><b>Hvad er dit køn?</b></td>
</tr>
<tr>
<td id="FeltKon"><input type="radio" value="1" name="kon" id="kon1">  Kvinde
<input type="radio" value="2" name="kon" id="kon2">Mand</td>
</tr>
</table><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<input type="submit" name="submitter" value="afsend">
</form>

</body></html>

Synes godt om

downloading Nybegynder

02. juli 2006 - 21:34 #17

thanks!! Virkelig fedt :) Er det også muligt at fokuserer på input feltet, men STADIG "løfte" siden til cellen ovenover??

Synes godt om

mclemens Nybegynder

02. juli 2006 - 21:40 #18

Dobbelt fokussering...
(tryk space efter klik)

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

<script type="text/javascript">

function chkf(f){
if((!f.kon[0].checked)&&(!f.kon[1].checked)){
document.getElementById("FeltKon").style.background="#ffff00";
document.getElementById("FeltKont").focus();
document.getElementById("kon1").focus();
return false
}else return true;
}

</script>

</head><body>

<form method="get" action="#" name="test" onsubmit="return chkf(this);">

<table border="0" width="100%" id="table1">
<tr>
<td><a href="#" id="FeltKont"></a><b>Hvad er dit køn?</b></td>
</tr>
<tr>
<td id="FeltKon"><input type="radio" value="1" name="kon" id="kon1">  Kvinde
<input type="radio" value="2" name="kon" id="kon2">Mand</td>
</tr>
</table><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<input type="submit" name="submitter" value="afsend">
</form>

</body></html>

- Og tak for point :o)

Synes godt om

downloading Nybegynder

02. juli 2006 - 22:15 #19

ok.. Mange tak :)

Nu har jeg bare problemet at jeg ikke kan få det til at virke når det er et tekstfelt jeg skal tjekke om er tomt..

if(document.test.Navn.value == "") {
document.getElementById("FeltNavn").style.background="#ffff00";
document.getElementById("FeltNavnF").focus();

Synes godt om

downloading Nybegynder

02. juli 2006 - 22:17 #20

hov undskyld.. En anden fejl :) tak igen..

Synes godt om

downloading Nybegynder

03. juli 2006 - 01:37 #21

hmm.. satans.. En ny mangel :)

Hvis du kan, vil du så ikke hjælpe, ellers laver jeg et nyt spørgsmål..

Men problemet ligger i at den skal farve alle de steder der ikke er udført (jeg har mange flere inputs)... hmm... :)

Synes godt om

mclemens Nybegynder

03. juli 2006 - 13:07 #22

Det her?
(ellers skal du måske udvide 02/07-2006 21:40:53 og kontrollere på hvert input...)

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

<script type="text/javascript">

req={'kon':'checked','navn':'value'} //input name der er krævet og ":" det der skal checkes på ... f.eks. checked, selected eller value adskilt af kommaer (et object)

function chkf(f){
returns=true;

for(i in req){

tnchk=true;

tns=document.getElementsByName(i);
for(i2=0;i2<tns.length;i2++)if((tns[i2][req[i]]!="")&&(tns[i2][req[i]]!=false))tnchk=false;

if(tnchk){
if(returns){tns[0].offsetParent.focus();tns[0].focus();returns=false;window.scrollBy(0,-tns[0].offsetParent.offsetHeight);}
for(i2=0;i2<tns.length;i2++)tns[i2].offsetParent.style.backgroundColor="#ffff00";
}

}
return returns;
}

</script>

</head><body>

<form method="get" action="#" name="test" onsubmit="return chkf(this);">

<table border="0" width="100%" id="table1">
<tr>
<td><b>Hvad er dit køn?</b></td>
</tr>
<tr>
<td><input type="radio" value="1" name="kon">  Kvinde
<input type="radio" value="2" name="kon">Mand</td>
</tr>
<tr>
<td><b>Hvad er dit navn?</b></td>
</tr>
<tr>
<td><input type="text" name="navn"></td>
</tr>
<tr>
<td><b>Hvad er din adresse?(behøver ikke udfyldes)</b></td>
</tr>
<tr>
<td><input type="text" name="adresse"></td></tr>
</table><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<input type="submit" name="submitter" value="afsend">
</form>

</body></html>

Synes godt om

downloading Nybegynder

04. juli 2006 - 01:13 #23

hmm.. jeg forstod nada af koden..

Men kna man ikke lave en masse if, som så hver sætter en variabel "afsend=false" og så sætter de hver i sær deres fælt til o, fx. "felt28=1"

Sidste tjek hedder så:

if (afsend=="false") {
farv alle de felter der har nanv=1

er det muligt?

Synes godt om

mclemens Nybegynder

04. juli 2006 - 17:28 #24

Her er en måske lidt mere tilgængelig udgave...

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

<script type="text/javascript">

function chkf(f){

o=[];
afsend=true;
focusf="";

if((!f.kon[0].checked)&&(!f.kon[1].checked)){
afsend=false;
if(focusf=="")focusf="konfelt";
o[o.length]=f.kon[0];
}else f.kon[0].offsetParent.style.backgroundColor="#ffffff";

if(f.navn.value==""){
afsend=false;
if(focusf=="")focusf="navnfelt";
o[o.length]=f.navn;
}else f.navn.offsetParent.style.backgroundColor="#ffffff";

if(!afsend){ // Hvis afsend er falsk så farv alle o objecters øvre objecter
for(i=0;i<o.length;i++)o[i].offsetParent.style.backgroundColor="#ffff00";
if(focusf!="")document.getElementById(focusf).focus();
}

return afsend;

}

</script>

</head><body>

<form method="get" action="#" name="test" onsubmit="return chkf(this);">

<table border="0" width="100%" id="table1">
<tr>
<td><a href="#" id="konfelt"></a><b>Hvad er dit køn?</b></td>
</tr>
<tr>
<td><input type="radio" value="1" name="kon">  Kvinde
<input type="radio" value="2" name="kon">Mand</td>
</tr>
<tr>
<td><a href="#" id="navnfelt"></a><b>Hvad er dit navn?</b></td>
</tr>
<tr>
<td><input type="text" name="navn"></td>
</tr>
<tr>
<td><b>Hvad er din adresse?(behøver ikke udfyldes)</b></td>
</tr>
<tr>
<td><input type="text" name="adresse"></td></tr>
</table><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<input type="submit" name="submitter" value="afsend">
</form>

</body></html>

Synes godt om

mclemens Nybegynder

04. juli 2006 - 17:49 #25

Hov glemte dobbelt focussering ...

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

<script type="text/javascript">

function chkf(f){

o=[];
afsend=true;
focusf="";focusf2="";

if((!f.kon[0].checked)&&(!f.kon[1].checked)){
afsend=false;
if(focusf==""){focusf="konfelt";focusf2=f.kon[0];}
o[o.length]=f.kon[0];
}else f.kon[0].offsetParent.style.backgroundColor="#ffffff";

if(f.navn.value==""){
afsend=false;
if(focusf==""){focusf="navnfelt";focusf2=f.navn;}
o[o.length]=f.navn;
}else f.navn.offsetParent.style.backgroundColor="#ffffff";

if(!afsend){ // Hvis afsend er falsk så farv alle o objecters øvre objecter
for(i=0;i<o.length;i++)o[i].offsetParent.style.backgroundColor="#ffff00";
if(focusf!=""){
document.getElementById(focusf).focus();
focusf2.focus();
}
}

return afsend;

}

</script>

</head><body>

<form method="get" action="#" name="test" onsubmit="return chkf(this);">

<table border="0" width="100%" id="table1">
<tr>
<td><a href="#" id="konfelt"></a><b>Hvad er dit køn?</b></td>
</tr>
<tr>
<td><input type="radio" value="1" name="kon">  Kvinde
<input type="radio" value="2" name="kon">Mand</td>
</tr>
<tr>
<td><a href="#" id="navnfelt"></a><b>Hvad er dit navn?</b></td>
</tr>
<tr>
<td><input type="text" name="navn"></td>
</tr>
<tr>
<td><b>Hvad er din adresse?(behøver ikke udfyldes)</b></td>
</tr>
<tr>
<td><input type="text" name="adresse"></td></tr>
</table><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<input type="submit" name="submitter" value="afsend">
</form>

</body></html>

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript	5	27/04/202620:09	03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript	8	14/04/202610:11	20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript	2	03/02/202614:19	04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript	9	18/04/202516:52	22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript	2	14/02/202511:47	27/06/202514:34

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS