Monika: FORM - Anstelle Mausklick eben die Entertaste

Hallo liebes Forum,

eine wichtige Frage nachdem ich das ganze
und echt toll gemachte Selfhtml gelesen habe,
aber eines verstehe ich nicht und hier ist wohl
ein Fehler in der SELFHTML drinnen:

http://www.teamone.de/selfhtml/tebc.htm

Unter der
"Auf aktuelles Objekt Bezug nehmen (this)"
gibt es auch ein Anzeigebeispiel, das aber nicht
funktioniert! ;-(((

http://www.teamone.de/selfhtml/tebcd.htm

----
<html><head><title>Test</title>
  </head><body>
  <form name="Eingabe">
  <input type=text name="Feld">
  <input type=button value="OK" onClick="alert(this.form.Feld.value)">
  </form>
  </body></html>
----

Mit der Maus kann man hinklicken, aber mit der
Entertaste geht das nicht! Warum? Was fehlt mir hier
noch?-/

Hintergrund:
Ich habe ein Javascript mit Suchfunktion erstellt,
dabei geht das Absenden nur dann, wenn man mit der MAUS
auf das SUCHEN draufklickt. Gibt man aber den gesuchten
Text per Keyboard ein und anschliessend dann gleich
die ENTER-Taste, dann macht Javascript Muell und
postet den eingegebenen Suchtext einfach mit einem
query in die URL-Zeile des Browsers rein! ;-(((

Hilfe! Danke! :-)

Ciao,
Monika

  1. Hi,

    Unter der
    "Auf aktuelles Objekt Bezug nehmen (this)"
    gibt es auch ein Anzeigebeispiel, das aber nicht
    funktioniert! ;-(((

    doch, einwandfrei.

    <input type=button value="OK" onClick="alert(this.form.Feld.value)">

    Mit der Maus kann man hinklicken, aber mit der
    Entertaste geht das nicht! Warum? Was fehlt mir hier
    noch?-/

    Der Handler heißt "onClick", und genau das meint er auch. Wenn Du beim Submit ("on Submit") etwas machen möchtest, mußt Du dem Formular auch ein onSubmit mitgeben.

    Ich habe ein Javascript mit Suchfunktion erstellt,
    dabei geht das Absenden nur dann, wenn man mit der MAUS
    auf das SUCHEN draufklickt. Gibt man aber den gesuchten
    Text per Keyboard ein und anschliessend dann gleich
    die ENTER-Taste, dann macht Javascript Muell und
    postet den eingegebenen Suchtext einfach mit einem
    query in die URL-Zeile des Browsers rein! ;-(((

    Ich sehe keinen Zusammenhang zum vorherigen Problem. Insbesondere wäre hier ein Stück Quellcode sowie eine URL, wo man sich das ansehen kann recht hilfreich.

    So als einfache Vermutung:
    Deine Suchfunktion basiert nicht darauf, daß man das Formular abschicken muß. Das ist aber schlecht, denn jemand, der z.B. JavaScript abgeschaltet hat, kann nur dies tun. Abgesehen davon aber mußt Du onSubmit abfangen (denn Enter im einzigen Textfeld des Formulars entspricht einem Submit) und entsprechend handeln. Vergiß nicht "return false;", weil sonst das Formular trotzdem abgeschickt wird.

    Cheatah

    1. Hi,

      <input type=button value="OK" onClick="alert(this.form.Feld.value)">

      Mit der Maus kann man hinklicken, aber mit der
      Entertaste geht das nicht! Warum? Was fehlt mir hier
      noch?-/

      Der Handler heißt "onClick", und genau das meint er auch. Wenn Du beim Submit ("on Submit") etwas machen möchtest, mußt Du dem Formular auch ein onSubmit mitgeben.

      wenn man den button irgendwie benennt (zB. name="default_button") und später code kommt wie

      document.forms[0].default_button.focus();

      aktiviert das den button, d.h. das betätigen der enter taste an der tastatur ist dem anklicken dieses buttons mit der maus völlig gleichwertig.
      Den handler onClick kann man also sehr wohl dazu verwenden, durch drücken der enter-taste irgendwas zu veranlassen.

      Leider bin ich draufgekommen, dass das aktivieren eines buttons mit der methode focus() in einem mittels open() erzeugten fenster mit netscape *am Macintosh* nicht funktioniert. Vielleicht kann dieses problem bestätigt bzw. eine lösung angeboten werden...

      ciao,
      rob.

      1. Hallo Robert,

        herzlichen Dank ebenfalls für Deine Antwort.

        <input type=button value="OK" onClick="alert(this.form.Feld.value)">

        Mit der Maus kann man hinklicken, aber mit der
        Entertaste geht das nicht! Warum? Was fehlt mir hier
        noch?-/

        Der Handler heißt "onClick", und genau das meint er auch. Wenn Du beim Submit ("on Submit") etwas machen möchtest, mußt Du dem Formular auch ein onSubmit mitgeben.

        wenn man den button irgendwie benennt (zB. name="default_button") und später code kommt wie
        document.forms[0].default_button.focus();

        aktiviert das den button, d.h. das betätigen der enter taste an der tastatur ist dem anklicken dieses buttons mit der maus völlig gleichwertig.

        Ja, das ist schon klar. Mein focus ist aber schon
        für den INPUT festgelegt, man soll ja beim Hinsurfen
        ja gleich losschreiben koennen (funktioniert ja auch
        alles):

        ----
        document.writeln('<INPUT SIZE=15 NAME="input_eingabefenster" MAXLENGTH="15">');
        .. (usw.) und dann

        document.name_des_formulars.input_eingabefenster.focus()
        ----

        Also, ich surfe da hin, und kann gleich per Keyboard
        losschreiben. Was ich aber NICHT kann ist, dass ich
        nach dem Tippen auf dem Keyboard gleich auf die
        ENTER-Taste druecken kann - nein, nicht-blond-Frau
        muss extra nochmal mit der Maus herhalten und eben
        mit der Maus anklicken. Das ist zu umstaendlich.

        Ich will also:
        Tippen auf dem Keyboard und dann ENTER und habe fertig. <g>

        Den handler onClick kann man also sehr wohl dazu verwenden, durch drücken der enter-taste irgendwas zu veranlassen.

        Schon klar. Ich will aber nach dem Tippen in das
        INPUT-Fenster gleich mit ENTER "weitertippen", dabei
        wird javascript form eben losgejagt (oder wie man das so sagt).
        Das geht aber nicht bei mir und auch bei SELFHTML
        mit http://www.teamone.de/selfhtml/tebcd.htm nicht. :-(((

        Leider bin ich draufgekommen, dass das aktivieren eines buttons mit der methode focus() in einem mittels open() erzeugten fenster mit netscape *am Macintosh* nicht funktioniert. Vielleicht kann dieses problem bestätigt bzw. eine lösung angeboten werden...

        Das ist mir neu und kann leider nicht viel sagen,
        weil ich keinen Macci habe. Das waere aber wohl
        schlecht, wenn nur die Windoofler da javascript surfen
        duerften. ?-/

        Ich waere aber wirklich froh, wenn wir doch bitte
        zuerst die Mausklick/Entertasten-Geschichte fertig
        machen koennten. (vielleicht einen neuen Betreff mit
        Deinem Thema?)  :-)

        Ciao,
        Monika

    2. Hallo Cheatah,

      herzlichen Dank für Deine interessante Antwort. :-)

      Wenn ich noch etwas nachfragen darf, weil wahrscheinlich
      ist das doch nicht so ganz wegen dem SELFHTML-Fehler
      verstanden worden, also schau mal:

      "Auf aktuelles Objekt Bezug nehmen (this)"
      gibt es auch ein Anzeigebeispiel, das aber nicht
      funktioniert! ;-(((

      doch, einwandfrei.

      Nein, leider nicht, folgendes konkret:

      Man surft zur
      http://www.teamone.de/selfhtml/tebcd.htm
      hin, dort ist das Formular.

      RICHTIG
      -------
      http://www.teamone.de/selfhtml/tebcd.htm
      Gibt man dort das Wort "Beispiel" ein, klickt
      anschliessend MIT DER MAUS auf das OK-Sendebutton,
      dann erscheint ein JAVA-ALERT-Fenster und der
      eingegebene Text "Beispiel" steht dann dort da.
      Das soweit richtig (und wohl auch beabsichtigt).

      FALSCH / FEHLER
      ---------------
      http://www.teamone.de/selfhtml/tebcd.htm
      Gibt man das Wort "Beispiel" ein, haut man aber
      anschliessend per ENTER-TASTE aufm Keyboard drauf <kicher>,
      dann kommt das JAVA-ALERT-Fenster eben NICHT,
      sondern der Browser faehrt dann

      von
      http://www.teamone.de/selfhtml/tebcd.htm

      auf
      http://www.teamone.de/selfhtml/tebcd.htm?Feld=Beispiel

      rueber und das ist FALSCH!

      Es soll doch - egal ob MAUS-Klick oder ENTER-Taste
      _immer_ und _trotzdem_ das JAVA-ALERT-Fenster
      erscheinen. Bin nicht blond. 8-)

      Vielleicht nochmals die Source beigelegt:

      -------
      <html>
      <head>
      <title>SELFHTML: JavaScript /  Sprachelemente / Objekte, Eigenschaften und Methoden / Auf aktuelles Objekt Bezug nehmen (this)</title>
      <link rel=stylesheet type="text/css" href="wselfhtm.css">
      </head>
      <body bgcolor=#EEEEEE text=#000000 link=#AA5522 vlink=#772200 alink=#000000>
      <h2><img src="xjavs10.gif" width=30 height=30 alt="JavaScript 1.0" border="0"><img src="xnetsi2.gif" width=30 height=30 alt="Netscape2.0" border="0"><img src="xmsie3.gif" width=30 height=30 alt="MS IE3.0" border="0"> Auf aktuelles Objekt Bezug nehmen (this)</h2>
      <p><img src="xshow.gif" width=33 height=14 border=0 alt="Beschreibung"><br>
      <a href="tebc.htm#a8"><b>Beschreibung: so wird's gemacht</b></a></p>

      <form name="Eingabe">
        <input type=text name="Feld">
        <input type=button value="OK" onClick="alert(this.form.Feld.value)">
      </form>

      <br> 
      </body>
      </html>
      -------

      <input type=button value="OK" onClick="alert(this.form.Feld.value)">

      Mit der Maus kann man hinklicken, aber mit der
      Entertaste geht das nicht! Warum? Was fehlt mir hier
      noch?-/

      Der Handler heißt "onClick", und genau das meint er auch. Wenn Du beim Submit ("on Submit") etwas machen möchtest, mußt Du dem Formular auch ein onSubmit mitgeben.

      Das heisst Deiner Meinung nach also, dass Stefan
      in der SELFHTML das aendern muss, oder? Also praktisch
      so:

      VORHER
      ------
      http://www.teamone.de/selfhtml/tebcd.htm
      <form name="Eingabe">
        <input type=text name="Feld">
        <input type=button value="OK" onClick="alert(this.form.Feld.value)">
      </form>

      NACHHER
      -------
      http://www.teamone.de/selfhtml/tebcd.htm
      <form name="Eingabe">
        <input type=text name="Feld">
        <input type=button value="OK" onSubmit="alert(this.form.Feld.value)">
      </form>

      Du, ich habe das gerade soeben ausprobiert:
      Wenn man von onClick auf onSubmit aendert, dann
      geht ja das mit dem MAUS-Klick nicht mehr, bzw. dann
      geht das ganze ja ueberhaupt gar nicht mehr?? <heul>

      Abgesehen davon aber mußt Du onSubmit abfangen (denn Enter im einzigen Textfeld des Formulars entspricht einem Submit) und entsprechend handeln.
      Vergiß nicht "return false;", weil sonst das Formular trotzdem abgeschickt wird.

      Also, gut, habe ich ebenfalls gerade gemacht:
      (aus: http://www.teamone.de/selfhtml/tebcd.htm)
      <form name="Eingabe">
        <input type=text name="Feld">
        <input type=button value="OK" onSubmit="alert(this.form.Feld.value); return false">
      </form>

      Nein, geht auch nicht. :-(((
      Probiere es doch mals selbst aus, danke für eine
      Hilfe oder Lösungsvorschlag (wo bleibt Stefan??)

      Ciao,
      Monika

      1. Hallo Monika,

        Der Handler heißt "onClick", und genau das meint er auch. Wenn Du beim Submit ("on Submit") etwas machen möchtest, mußt Du dem Formular auch ein onSubmit mitgeben.

        Tippen auf dem Keyboard und dann ENTER und habe fertig. <g>
        Das geht aber nicht bei mir und auch bei SELFHTML
        mit http://www.teamone.de/selfhtml/tebcd.htm nicht. :-(((

        Dir wurde eigentlich die vollständige Lösung schon gesagt. Ich helfe dir jetzt mal beim Zusammensetzen der Einzelteile. :-)

        Dein Problem besteht darin, daß Formulare wie im Beispiel mit Druck der Entertaste abgeschickt werden. Daher auch die Anzeige in der Adresszeile.
        Das Abschicken eines Formulares löst den Eventhandler onsubmit aus. Diesen kannst du mit JavaScript abfangen und umlenken. Allerdings muß dazu der Handler auch im form-Tag stehen. Du hast ihn jedoch im  Button stehen.

        <form name="Eingabe">

        »»   <input type=text name="Feld">
        »»   <input type=button value="OK" onSubmit="alert(this.form.Feld.value); return false">

        </form>

        Richtig lautet dein Aufruf:

        <form name="Eingabe" onSubmit="alert(this.Feld.value);return false">
          <input type=text name="Feld">
          <input type=button value="OK" onClick="alert(this.form.Feld.value);">
        </form>

        Du mußt also dein Alert zweimal sozusagen anmelden.

        Noch zu Selfhtml, das Beispiel macht genau was es soll und ist auch richtig. Das du nun mehr erreichen willst, finde ich toll :-) aber Stefan konnte das ja kaum vorhersehen ;-)

        Viele Grüße

        Antje

      2. Hallo Monika,

        "Auf aktuelles Objekt Bezug nehmen (this)"
        gibt es auch ein Anzeigebeispiel, das aber nicht
        funktioniert! ;-(((

        doch, einwandfrei.

        Funktioniert bei mir auch (Es macht genau das, was es soll ;-)

        FALSCH / FEHLER

        http://www.teamone.de/selfhtml/tebcd.htm
        Gibt man das Wort "Beispiel" ein, haut man aber
        anschliessend per ENTER-TASTE aufm Keyboard drauf <kicher>,
        dann kommt das JAVA-ALERT-Fenster eben NICHT,
        sondern der Browser faehrt dann
        von
        http://www.teamone.de/selfhtml/tebcd.htm
        auf
        http://www.teamone.de/selfhtml/tebcd.htm?Feld=Beispiel
        rueber und das ist FALSCH!

        Wieso ist das falsch? Das Formular wird abgeschickt, und da dies mit GET passiert, erscheinen die Parameter in der URL. Soweit ist doch alles OK.

        Es soll doch - egal ob MAUS-Klick oder ENTER-Taste
        _immer_ und _trotzdem_ das JAVA-ALERT-Fenster
        erscheinen. Bin nicht blond. 8-)

        Ich glaube Cheatah ist auch nicht blond ;-) Es ist doch richtig was er geschrieben hat. Du musst nur den richtigen Code zur richtigen Zeit an der richtigen Stelle platzieren ;-).

        <form name="Eingabe">
          <input type=text name="Feld">
          <input type=button value="OK" onClick="alert(this.form.Feld.value)">
        </form>

        Der Handler heißt "onClick", und genau das meint er auch. Wenn Du beim Submit ("on Submit") etwas machen möchtest, mußt Du dem Formular auch ein onSubmit mitgeben.

        Das stimmt immer noch 100%ig (denke ich ;-).

        Das heisst Deiner Meinung nach also, dass Stefan
        in der SELFHTML das aendern muss, oder?

        IMHO muss Stefan das nicht, da es in dem Beispiel afaik um etwas ganz anderes geht, als mit onSubmit einen alert() zu erzeugen.
        Daß das Beispiel nicht genau auf Dein Problem passt, kann ja durchaus im Bereich des Möglichen liegen ;-)

        Du, ich habe das gerade soeben ausprobiert:
        Wenn man von onClick auf onSubmit aendert, dann
        geht ja das mit dem MAUS-Klick nicht mehr, bzw. dann
        geht das ganze ja ueberhaupt gar nicht mehr?? <heul>

        Siehe oben.

        Abgesehen davon aber mußt Du onSubmit abfangen (denn Enter im einzigen Textfeld des Formulars entspricht einem Submit) und entsprechend handeln.
        Vergiß nicht "return false;", weil sonst das Formular trotzdem abgeschickt wird.

        Genau, hab ich gemacht, und es funktioniert.

        » Nein, geht auch nicht. :-(((
        Probiere es doch mals selbst aus, danke für eine
        Hilfe oder Lösungsvorschlag (wo bleibt Stefan??)

        Bevor jetzt Stefan einspringen muss ;-), und ich Dich noch weiter auf die Folter spanne <bg> poste ich mal die Version, die imho das tut(et ;-), was Du willst:

        <form name="Eingabe" onSubmit="alert(document.Eingabe.Feld.value);return false;">
                                           ^............hierher muss afaik das onSubmit (zumindest funkts)
          <input type=text name="Feld">
          <input type=submit value="OK">
        </form>

        Ich hoffe das hilft Dir weiter.

        Gruß AlexBausW

        P.S.: <g> Falls ich jetzt der einzige bin, der auf einen verspäteten Aprilscherz hereingefallen ist: HaHaHa ;-) </g>

      3. Hi,

        doch, einwandfrei.

        Nein, leider nicht, folgendes konkret:

        danke, aber ich hatte Dich schon verstanden. Du mich offenbar leider nicht :-)

        FALSCH / FEHLER

        http://www.teamone.de/selfhtml/tebcd.htm
        Gibt man das Wort "Beispiel" ein, haut man aber
        anschliessend per ENTER-TASTE aufm Keyboard drauf <kicher>,
        dann kommt das JAVA-ALERT-Fenster eben NICHT,
        sondern der Browser faehrt dann

        Ja, genau das soll er auch. Aus dem Text:
        "Wenn der Anwender auf den Button klickt, [...]"

        Nicht "Wenn der Anwender das Formular abschickt". Die Funktion ist (dort) onClick-basiert und funktioniert auch nur onClick, und genau das wird auch beschrieben.

        Es soll doch - egal ob MAUS-Klick oder ENTER-Taste
        _immer_ und _trotzdem_ das JAVA-ALERT-Fenster
        erscheinen. Bin nicht blond. 8-)

        Vielleicht bei Dir, aber nicht im SelfHTML-Beispiel ;-)

        <form name="Eingabe">
          <input type=text name="Feld">
          <input type=button value="OK" onSubmit="alert(this.form.Feld.value)">
        </form>

        Das onSubmit muß in den <form>-Tag, und sinnvollerweise enthält es ein "return false;", weil das Formular sonst nämlich doch abgeschickt wird. Außerdem muß der Button vom Typ "submit" sein.

        Jetzt klarer? :-)

        Cheatah

  2. Moin Monika,

    Mit der Maus kann man hinklicken, aber mit der
    Entertaste geht das nicht! Warum? Was fehlt mir hier
    noch?-/

    wenn Du ein Formular benötigst, das sowohl mit der
    Maus als auch mit der Enter-Taste abgeschickt werden
    kann (vor allem mit Netscape, beim IE geht das normalerweise
    immer), probier statt eines normalen Absendebuttons mal
    einen "grafischen Absendebutton" aus:

    http://zaphodb/~abi/selfhtmldoku/tchk.htm#a2

    Formulare mit einem grafischen Absendebutton werden
    auch bei Netscape mit der Enter-Taste abgeschickt.
    Falls Du vorher noch ein Alert-Window oder irgendeine
    Kontrollfunktion aufrufen willst, dann tue das am besten
    im Form-Tag selber:

    <form name="myform" onSubmit="checkInput();">

    Bis dannundwann

    Andreas

    1. Moin nochmal...

      Asche auf mein Haupt: Der Link zum grafischen
      Absendebutton muß natürlich wie folgt lauten:

      <../../tchk.htm#a2>

      War wohl doch noch zu früh... Wird (hoffentlich) nicht
      mehr vorkommen!

      Bis dannundwann

      Andreas