Formularfeld erscheint bei onclick

[rico]

Hallo,

ich habe eine Idee und ein Problem.
Ich möchte gern einen Newsletter auf meiner Seite einrichten, was nicht wirklich problematisch ist.
Am unteren Bildrand steht nun ein Link zum Newsletter. Ich will, dass, wenn man auf den Link klickt, ein Newsletterformularfeld neben dem Link sichtbar wird, man seine Daten einträgt und diese abschickt. Ich will also nicht, dass sich ein popup öffnet oder eine neue seite geöffnet wird, sondern dies auf der gleichen seite und der gleichen zeile stattfinden lassen. kann mir da jemand helfen. ist das überhaupt möglich?

beste grüße
rico

[get]

Hallo rico,

"bei onclick" deutet ja bereits auf Javascript hin ...

In einem Stylesheet mußt du "nur" dem Bereich, den du später bei onclick zeigen möchtest, die Eigenschaft display:none oder visibility:hidden zuweisen. Damit ist der Bereich zunächst - bis zum Klick - verborgen.

Eine Javascript-Funktion sorgt dann mittels

document.getElementById('Bereich').style.display = "block"

bzw.

document.getElementById('Bereich').style.visibility = "visible"

dafür, daß der Bereich bei Klick auf den Link angezeigt wird.

Mfg get

[OhneNamen]

Ich möchte noch hinzufügen, dass das Formular standardmäßig sichtbar sein sollte und mittels onload unsichtbar gemacht wird. Dann ist das Formular nämlich auch bei ausgeschaltetem Javascript benutzbar.

[Lucas]

Hi!
Ist das eine Frage, wie du das am besten zu machen ist? Wenn ja würden "???" nicht schaden. Zudem wäre ein Name nicht schlecht, eine Begrüßung und eine kleine Verabschiedung mit Namen und Danke schön. Und wenn du mindestens drei viertel davon erfüllt hast, kann ich dir auch auf deine eventuelle Frage antworten.
cu, Lucas

;-)

[OhneNamen]

Hallo Lucas,

»»Ich möchte noch hinzufügen, dass das Formular standardmäßig sichtbar sein sollte und mittels onload unsichtbar gemacht wird. Dann ist das Formular nämlich auch bei ausgeschaltetem Javascript benutzbar.

Ich weiß nicht wo du hier eine Frage zu erkennen glaubst. Ich habe den OP darauf hingewiesen, dass er auch auf Benutzer ohne Javascript Rücksicht nehmen sollte und ihm auch gesagt wie das geht (bei onload unsichtbar machen).

Ciao,
OhneNamen

PS: OhneNamen ist auch eine Name ;-)

[Lucas]

Hallo Lucas,

Hi!

»»Ich möchte noch hinzufügen, dass das Formular standardmäßig sichtbar sein sollte und mittels onload unsichtbar gemacht wird. Dann ist das Formular nämlich auch bei ausgeschaltetem Javascript benutzbar.

»»

Ich weiß nicht wo du hier eine Frage zu erkennen glaubst. Ich habe den OP darauf hingewiesen, dass er auch auf Benutzer ohne Javascript Rücksicht nehmen sollte und ihm auch gesagt wie das geht (bei onload unsichtbar machen).

Hmm... Ich habe es als Frage aufgefasst. Man kann es auch so verstehen, dass du (also der Fragesteller) gefragt hat, wie man das Formular unsichtbar macht. Aber ganz sicher war ich mir auch nicht. :-P

Ciao,
OhneNamen

PS: OhneNamen ist auch eine Name ;-)

Naja, ein Name ist es meiner Meinung nach nicht. Ich finde ein Namen ist dann ein Namen, wenn man ein Kind so nennen kann. Also zum Beispiel Franz Müller. Aber OhneNamen Müller finde ich nicht gerade sehr schön ;-)

tschö mit ö, Lucas

[rico]

ick wollte doch nicht, dass ihr euch jetzt prügelt ... hm ... aber danke ... ich schau mal ob ich's hinbekomm ...

[rico]

guten abend,

also ich habe doch noch eine frage:

dann ich ja ein text verlinken will und beim klicken erscheint das versteckte ... beginn ich ja mit:

href=???

was geb ich als ziel an? ich will ja weder mailto noch 'ne seite?
 onclick="document.getElementById('versteckbild').style.visibility='visible'; document.getElementById('versteckbild').src='???';"

dann definier ich die onclick sache, aber was geb ich meinem kontaktformular für 'ne source an?

und wenn ich dann die id definiere
 id="versteckbild" src="???" alt="???"
 style="width: 46px; height: 46px; visibility: visible;

was kommt da rein?

danke für die mühe

rico

[Der Martin]

Hallo,

was geb ich als ziel an? ich will ja weder mailto noch 'ne seite?
onclick="document.getElementById('versteckbild').style.visibility='visible'; document.getElementById('versteckbild').src='???';"

mit dem onclick-Handler anzufangen, ist schon mal eine gute Idee.

dann definier ich die onclick sache, aber was geb ich meinem kontaktformular für 'ne source an?

Entweder du nimmst in Kauf, dass du Besucher deaktiviertem Javascript komplett ausschließt (nicht empfehlenswert). Dann kannst du diesen onclick-Handler auch jedem anderen Element zuordnen, es muss nicht unbedingt ein Link (a-Element) sein, und du bist die Frage nach dem href los.

Oder du machst es richtig[tm] und verlinkst für diejenigen, die Javascript deaktiviert haben, auf eine neue Seite (oder eine Variante der aktuellen Seite), in der das Kontaktformular von Anfang an sichtbar ist. Dann hast du fürs href ein konkretes Linkziel. Dann vergiss nicht, im Eventhandler false zurückzugeben, damit bei JS-aktiven Besuchern die Standardfunktion des Links (nämlich eine neue Seite aufzurufen) nicht zusätzlich ausgelöst wird.

und wenn ich dann die id definiere
id="versteckbild" src="???" alt="???"
style="width: 46px; height: 46px; visibility: visible;
was kommt da rein?

Hier kann ich dir leider nicht ganz folgen. :-(
Von einem Bild war nämlich bisher nicht die Rede, sondern nur von einem Formular, das mit JS eingeblendet werden soll.

So long,
 Martin

[rico]

hallo!

onclick="document.getElementById('newsletter').style.visibility='visible'; document.getElementById('newsletter').src='???';"

mit dem onclick-Handler anzufangen, ist schon mal eine gute Idee.

»»

das mein ich auch ... aber trotzdem versteh ich es noch nicht, sorry

ich hab das newsletter formular

<form action="blabliblub.php"
 method="post" onsubmit="return validate()">
    <p align="center"><b><font face="Sylfaen"
 size="3">Deine eMail-Adresse:</font></b></p>
    <p align="center"><font face="Sylfaen"><input
 name="T1" size="20" type="text">&nbsp;&nbsp;
    <input value="Newsletter bestellen" name="Newsletter"
 type="submit"></font></p>

jetzt ist es sichtbar. das will ich auch lassen für die, die js deaktiviert haben.
aber wie versteck ich das jetzt, damit es bei onclick wieder sichtbar wird? ... und wie sag ich onclick, dass er das formular zeigen soll. da bin ich überfordert.

danke!!

ps: muß ich nicht die id="newsletter" genauer definieren? aber wie?

danke! danke!

[Der Martin]

Hi,

ich hab das newsletter formular
<form action="blabliblub.php"
method="post" onsubmit="return validate()">
[...]

und dann fehlt anscheinend das schließende </form>. Ich nehme mal an, das hast du in der Online-Version drin und hast es hier nur nicht erwähnt.

jetzt ist es sichtbar. das will ich auch lassen für die, die js deaktiviert haben.

Sorry, das hatte ich übersehen. Guter Ansatz.
Dann kannst du wirklich das realisieren, was ich als "Entweder" erwähnt hatte. Das klicksensitive Element, das das Formular wieder einblendet, muss nicht unbedingt ein a-Element sein.

aber wie versteck ich das jetzt, damit es bei onclick wieder sichtbar wird? ... und wie sag ich onclick, dass er das formular zeigen soll. da bin ich überfordert.

Als erstes gibst du dem form-Element eine ID, damit du es mit Javascript eindeutig und verwechslungssicher ansprechen kannst. Dann setzt du im onload-Handler die display-Eigenschaft dieses Formulars auf "none", damit es unsichtbar wird. Mit dem onclick-Handler eines beliebigen Elements setzt du dieselbe display-Eigenschaft wieder auf "block". Ist doch gar nicht so schwierig, oder?

ps: muß ich nicht die id="newsletter" genauer definieren? aber wie?

Ja, am besten, du ordnest sie dem Fromular zu.

So long,
 Martin

[rico]

DANKE!

jetzt funktioniert es.

tausend dank
und großes lob an alle die mehr verstehen als ich =)