[Javascript/html] On focus werkt niet met meerdere tabellen - Softwareontwikkeling

maandag 3 november 2003 09:40

Acties:

Moderator Wonen & Mobiliteit / General Chat

Topicstarter

Ik wil graag een onfocus op een form toepassen. Niet erg moeilijk dat ik dan en dus de volgende code even los van mijn pagina getest:

PHP:

<html>
<title>Onfocus</title>
<body>
<form name="test" action="www.hoi.nl" method="get">
<input type="text" NAME="user">
<input type="submit" VALUE="Submit">
</form>
<script language="JavaScript">
<!--
document.test.user.focus();
//-->
</script>
</body>
</html>

Dit werkt prima. Rede dat ik het los heb getest is omdat het in de pagina waar ik het wil toepassen niet echt werkt

Mijn pagina

PHP:

<script language="JavaScript">
<!--
document.test.user.focus();
//-->
</script>
<table>
<form name="test" action="" method="post">
<table class="table1">
<tr>
<td class="td-reg-title" colspan="2"><b>Vereiste&nbsp;gegevens</b></td>
</tr>
</table>
<table class="table2">
<tr>
<td class="td-reg-left">Gebruikersnaam</td><td>
<input type="text" name="user" size="30" />
</td>
</tr>
<tr>
<td class="td-reg-left">Wachtwoord</td>
<td>
<input type="password" name="password" size="30" />
</td>
</tr>
</table>

Hier werkt het dus niet. De rede dat ik de form helemaal bovenaan zet is omdat anders de layout van de tabel verknalt wordt. Ik heb me rot gezocht maar met de GoT search vond ik een topic waar instond dat je de FORM buiten de TR en TD moet laten. De extra tabel bij openen is om te voorkomen dat er een break wordt toegevoegd. Een form voegt altijd een break toe (lege regel) en dus zo opgelost.

Hoe los ik het probleem op dat mijn focus niet werkt. Het heeft duidelijk iets te maken met nesting (zo noem je dat volgens mij

) van de verschillende tabellen.

_{code tag werkt niet echt lekker dus even php tags gebruikt}

maandag 3 november 2003 09:53

Acties:

jvreuls

Het tweede werkt niet omdat je de JavaScript boven het form zet. De browser voert de code meteen bij het parsen uit, dus als de JavaScript uitgevoerd moet worden is het form nog niet bekend en kan er dus ook niks gefocussed worden.

Wat wel werkt is je code uitvoeren in de onload van de body:

PHP:

<?
<script language="JavaScript">
<!--
window.onload = function() { document.test.user.focus() };
//-->
</script>
?>

Of natuurlijk in de <body> tag de onload zetten.

Ook kun je zoals in je eerste voorbeeld de focus code onder het form zetten (onder de </table>).

[ Voor 8% gewijzigd door jvreuls op 03-11-2003 09:56 ]

Circuits Online

maandag 3 november 2003 10:09

Acties:

We Are Borg

Moderator Wonen & Mobiliteit / General Chat

Topicstarter

Thanks $_/-\o_$

De javascript code onderaan de laatste </table> did the trick. Ik wist niet dat je rekening moest houden met de plaatsing van de javascript. Zal nu onthouden

Toevoeging:

Jouw code is ook beter. Mozilla en IE pakken de javascript code van mijn post wel, maar Opera niet. Jouw code werkt bij alledrie

[ Voor 32% gewijzigd door We Are Borg op 03-11-2003 10:15 ]

maandag 3 november 2003 10:19

Acties:

crisp

Devver

Pixelated

code even naar de 21e eeuw tillen:

PHP:

<script type="text/javascript">

window.onload = function() { document.forms['test'].elements['user'].focus(); }

</script>

Intentionally left blank

maandag 3 november 2003 10:19

Acties:

Rickets

Finger and a shift

Gaarne dan de 'hide-from-older-browsers'-frutsels weghalen

En de juiste manier om forms aan te spreken:

PHP:

1	document.forms[ 'test' ].elements[ 'user' ].focus( );

Nog wat te mierenneuken:

PHP:

1	<script type="text/javascript">

Bovendien is het handiger om zoveel mogelijk javascript buiten je body, in een externe js te zetten, in verband met onderhoudbaarheid

offtopic:
*slaps crisp*

[ Voor 12% gewijzigd door Rickets op 03-11-2003 10:21 ]

If some cunt can fuck something up, that cunt will pick the worst possible time to fucking fuck it up, because that cunt’s a cunt.

maandag 3 november 2003 21:34

Acties:

We Are Borg

Moderator Wonen & Mobiliteit / General Chat

Topicstarter

Thanks nog allebei. Die type="" had ik al aangepast omdat W3 validator anders niet leuk vond

Andere is ook fix0rd en zal idd eens alles in 1 JS file gooien en die includen.

Nogmaals bedankt $_/-\o_$