[form] Automatisch invullen radiobutton bij form field

[Dries Arnolds]

Ik heb een probleempje met een formulier op een website waar ik verantwoordelijk voor ben. Bezoekers moeten een keus maken uit twee opties (radiobuttons) en als ze de eerste kiezen, moeten ze ook het invulvakje invullen. Zie onderstaande afbeelding. In de praktijk vult men wel het vakje in, maar niet de bijbehorende radiobutton. Omdat het kiezen van één van de twee radiobuttons verplicht is, krijgt de bezoeker dan een foutmelding.

Is er een manier om de eerste radiobutton automatisch in te vullen als een bezoeker het bijbehorende vakje invult?

[sig69]

Een javascript onFocus of iets dergelijks die de radiobutton selecteert?

[Dries Arnolds]

Vinkt ie hem dan ook aan? Dan ga ik even in die richting zoeken. Bedankt.

[TwoR]

onChange van de textbox de radiobutton selecteren moet wel kunnen. Zal eens voor je kijken of ik nog ergens iets heb liggen.

Zoiets krijg je dan:

code:

<script>
    function vinkje(){
        radiood.checked = true;
    }
</script>
<input type="text" name="test" onChange="javascript:vinkje();">
<input type="radio" name="radiood">

[ Voor 47% gewijzigd door TwoR op 27-04-2005 11:33 ]

[Dries Arnolds]

Ik zit even te kijken, want ik snap niet helemaal hoe onfocus zou moeten werken. Als ik dat toepas op het invulveld focust ie bij het aanklikken op de radiobutton, waardoor iemand het veld zelf niet meer kan invullen zonder er weer op te klikken. Dan zit je volgens mij in een loop...

[TwoR]

en dan ipv de onchange moet je even daar even onFocus van maken dan gaat ie aan als je in het veld komt

Dries Arnolds schreef op woensdag 27 april 2005 @ 11:32:
Ik zit even te kijken, want ik snap niet helemaal hoe onfocus zou moeten werken. Als ik dat toepas op het invulveld focust ie bij het aanklikken op de radiobutton, waardoor iemand het veld zelf niet meer kan invullen zonder er weer op te klikken. Dan zit je volgens mij in een loop...

Nee je geeft OnFocus van de textbox aan dat je de radiobutton aan wilt zetten en niet dat je die wilt focussen.

[ Voor 71% gewijzigd door TwoR op 27-04-2005 11:36 ]

[TXC]

Of je laat hem checken bij het openen van het html bestand oid.

[Dries Arnolds]

TwoR: Hij geeft aan dat radiood niet gedefinieerd is. (sorry, weet niet zoveel van JS)

TXC: Dat werkt totdat mensen besluiten van keus te wisselen en weer terug...

[ Voor 84% gewijzigd door Dries Arnolds op 27-04-2005 11:47 ]

[TwoR]

als je dit letterlijk kopieert in een nieuw html bestand ook ? Want dan werkt het hier prima.

[Dries Arnolds]

Hij doet het wel als ik jouw voorbeeld letterlijk kopieer (en vervang voor onFocus) maar ik heb twee radiobuttons met dezelfde "name" (anders kun je ze allebei tegelijk selecteren) en hij kan ze natuurlijk niet tegelijk aanvinken...

[sig69]

De name moet inderdaad hetzelfde zijn, maar het id hoeft dat niet te zijn.

[dailyleaf]

Misschien iets simpeler, maar zeker zo effectief:

Zorg dat de eerste automatisch 'checked' is.

Als men de 2e optie wil zullen ze het veranderen. En als ze het vakje invullen is hij alvast geselecteerd.

[TwoR]

inderdaad. Ik zie trouwens net dat ie het in Mozilla niet doet en in IE wel. in mozilla krijg je inderdaad radiood is not defined.

code:

<script>
    function vinkje(){
        document.formnaam.radio1.checked = true;
    }
</script>
<form name="formnaam">
    <input type="text" name="test" onFocus="javascript:vinkje();">
    <input type="radio" name="radiood" id="radio1">
    <input type="radio" name="radiood" id="radio2">
</form>

Werkt nog even alleen in IE Werkt nu ook in mozilla de fout was dat het niet netjes in een form stond en nu werkt het ook met 2 radiobuttons met dezelfde naam.

[ Voor 118% gewijzigd door TwoR op 27-04-2005 11:56 ]

[Dries Arnolds]

wow, dank!

[TwoR]

Dries Arnolds schreef op woensdag 27 april 2005 @ 11:59:
wow, dank!

You're welcome

Het was alweer lang geleden dat ik iets met JS gedaan hadden dus vond het wel leuk om dit eens even te proberen.

[disjfa]

code:

document.forms["formnaam"].elements["radio1"].checked = "checked";

/mierenneuken