Newbie-Problem: Radiobutton mit Textbox

Hallo NG,

leider bin ich noch ein Anfänger in Java-Script. Vielleicht kann mir jemand
bei meinem Problem auf die Sprünge helfen:

In einem Kontakt-Formular soll mit Radio-Buttons zwischen verschiedenen
Optionen gewählt werden, wobei eine Option davon per Textfeld angegeben
werden soll. Meine Buttons sehen also bisher so aus:

<form action=irgendwas...>
<input type="radio" name="information" value="aboutMyCity" checked>
Informationen über meine Stadt<br>
<input type="radio" name="information" value="aboutMyCountry"> Informationen
über meine Stadt bla<br>
<input type="radio" name="information" value=""> <input type="Text"
name="Textfeld" value="">
<input type="submit" value="Abschicken">
</form>

Mein Problem:
1. Wenn in das Textfeld geklickt wird, soll automatisch der dritte
Radio-Button aktiviert werden.
2. Als Value des dritten Radio-Buttons soll der im Textfeld eingetippte
Inhalt übergeben werden.

Denke, das man dies mit Java-Script realisieren kann/muss?

Gruß und vielen Dank schonmal

Christian

<input type="radio" name="information" value="aboutMyCountry"> Informationen

über meine Stadt bla<br
^^^^^^^

Hier muss es natürlich "Informationen über meine Heimat" heißen...

Christian Otteneuer <chotty (AT) freenet (DOT) de> typed:

In einem Kontakt-Formular soll mit Radio-Buttons zwischen
verschiedenen Optionen gewählt werden, wobei eine Option davon per
Textfeld angegeben werden soll. Meine Buttons sehen also bisher so
aus: [...]
1. Wenn in das Textfeld geklickt wird, soll automatisch der dritte
Radio-Button aktiviert werden.

Sinnvoll ist, bei einem Textfeld nicht auf einen Klick zu reagieren,
sondern auf den Erhalt des Fokus. Nicht jedes System besitzt und
nicht jeder User benutzt ein Zeigegerät mit Klickvorrichtung, vulgo
Maus. Bei den Radio-Elementen im Beispiel unten erfolgt hingegen ein
Click-Event auch bei Navigation per Tastatur.

<... onfocus="...checked=true">

2. Als Value des dritten Radio-Buttons soll der im Textfeld
eingetippte Inhalt übergeben werden.

Diese erledigst Du eigentlich besser serverseitig (dort wertest Du
die Daten doch wohl ohnehin aus), somit bliebe das Formular auch
für Benutzer ohne oder mit deaktiviertem JS benutzbar. Nur des
lerneffekts wegen daher dies:

<... onblur="...value=this.value>

Insgesamt bspw. so:

<form action="">
<input type="radio" name="information" value="aboutMyCity" checked
onclick="var o=this.form.elements.Textfeld; o.value=o.defaultValue"

Informationen &uuml;ber meine Stadt<br
input type="radio" name="information" value="aboutMyCountry"

onclick="var o=this.form.elements.Textfeld; o.value=o.defaultValue"

Informationen &uuml;ber meine Heimat<br
input type="radio" name="information" value=""

onclick="var o=this.form.elements.Textfeld; o.focus(); o.select()"

input type="Text" name="Textfeld" value=""
onfocus="this.form.elements.information[2].checked=true"

onblur="this.form.elements.information[2].value=this.value"

br
input type="submit" value="Abschicken"

</form>

ciao, dhgm

Hallo Dietmar,

vielen Dank für deine schnelle Hilfe :-)
Aber noch eine Verständnisfrage:

input type="radio" name="information" value="aboutMyCity" checked
onclick="var o=this.form.elements.Textfeld; o.value=o.defaultValue"
Informationen &uuml;ber meine Stadt<br

Hier sind doch die JS-Elemente eigentlich nicht notwendig, oder? Oder wo
besteht der Unterschied zu:

<input type="radio" name="information" value="aboutMyCity" checked>
Informationen über meine Stadt<br>

??

Gruß
Christian

Christian Otteneuer wrote:

Wer hat das geschrieben? --> <http://got.to/quote>
vvvvvvvvvvvvvvvvvvvvvvvv

input type="radio" name="information" value="aboutMyCity" checked
onclick="var o=this.form.elements.Textfeld; o.value=o.defaultValue"
Informationen &uuml;ber meine Stadt<br

Hier sind doch die JS-Elemente eigentlich nicht notwendig, oder?

Notwendig ist hierbei gar kein Script.

Oder wo besteht der Unterschied zu:

input type="radio" name="information" value="aboutMyCity" checked
Informationen über meine Stadt<br

1. Der Wert des mit "Textfeld" benamsten Formularelements
wird nicht auf den Anfangswert gesetzt.

2. Das Nicht-ASCII-Zeichen "ü" wurde nicht maskiert.


PointedEars
--
************************************************** **********
* Die psf ab jetzt auch für <http://tagzilla.mozdev.org/>! *
* <http://pointedears.de/psf/> *
************************************************** **********

Thomas 'PointedEars' Lahn wrote:

2. Das Nicht-ASCII-Zeichen "ü" wurde nicht maskiert.

Muss es auch nicht.

ciao, dhgm

Dietmar Meier wrote:

Thomas 'PointedEars' Lahn wrote:
2. Das Nicht-ASCII-Zeichen "ü" wurde nicht maskiert.

Muss es auch nicht.

Richtig, aber man kann damit unerwarteten Problemen aus dem Weg gehen.


F'up2 poster

PointedEars
--
What one man can invent another can discover.
-- Sherlock Holmes in Sir A.C. Doyle's
"The Adventure of the Dancing Men"