Peter: Anker?/Fucus?

Bei einem etwas längeren Formular hat der User mittig vergessen eine Variable anzugeben. Bisher rufe ich das Formular neu auf und setze den Fucus auf das entsprechende Textfeld, (bei dem die Eingabe fehlte) sodass der User gleich drauf los schreiben kann, ohne dass er noch großartig die entsprechende Text-Box selektieren muss. Da dass Formular wie erwähnt etwas länger ist, springt das Bild zwar automatisch zu dem Textfeld, auf das ich den Focus gesetzt habe, allerdings ist das Textfeld 'nur' ganz unten im Bild zu sehen.

Kann ich das auch irgendwie so machen, dass das entsprechende Textfeld mittig des Bildschirms dargestellt wird und der Focus weiterhin im Textfeld bleibt?

Wenn ja, wie mache ich das?

thx

  1. Hi Peter!

    Kann ich das auch irgendwie so machen, dass das entsprechende Textfeld mittig des Bildschirms dargestellt wird und der Focus weiterhin im Textfeld bleibt?

    Da bietet sich ein Anker an, den du beim Reload der Seite einfach setzt. Der muss natürlich definiert sein.
    Die Seite springt dann einfach zu dem Anker.

    Wie realisierst du denn aktuell das Setzen des Fokus auf das entsprechende Element? Kannst du nicht gleichzeitig um die Hälfte Viewporthöhe weiterscrollen?

    MfG H☼psel

    --
    "It's amazing I won. I was running against peace, prosperity, and incumbency."
    George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
    Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)
    1. Wie realisierst du denn aktuell das Setzen des Fokus auf das entsprechende Element? Kannst du nicht gleichzeitig um die Hälfte Viewporthöhe weiterscrollen?

      Das hört sich schonmal gut an. Ich habe in Javascript leider nur sehr wenig ahnung. Am besten poste ich hier mal meinen Focus, dann kannst Du mir vielleicht sagen, ob ich da die hälft der Viewporthöhe weiter scrollen kann:
      -------------------------------------------------------------
      function SetzeFocus()
      {
         var ElementID = "focus";
         document.getElementById(ElementID).focus();
      }
      setTimeout("SetzeFocus()",1000);
      -------------------------------------------------------------

      wäre ja schön, wenn das so einfach klappt...

      thx

      1. Hallo

        »» Wie realisierst du denn aktuell das Setzen des Fokus auf das entsprechende Element? Kannst du nicht gleichzeitig um die Hälfte Viewporthöhe weiterscrollen?

        Das hört sich schonmal gut an. Ich habe in Javascript leider nur sehr wenig ahnung. Am besten poste ich hier mal meinen Focus, dann kannst Du mir vielleicht sagen, ob ich da die hälft der Viewporthöhe weiter scrollen kann:

        function SetzeFocus()
        {
           var ElementID = "focus";
           document.getElementById(ElementID).focus();
        }
        setTimeout("SetzeFocus()",1000);

        Nun ja, du setzt damit den Cursor in das Eingabefeld. So weit, so gut. Was du willst, bzw. was dir Hopsel sagen will, ist, dass du einen Anker im HTML-Quelltext haben musst, den du beim Wiederaufruf des Dokuments anspringen kannst.

        Wie man das realisieren kann, kommt darauf an, wie die Prüfung der Eingaben erfolgt und wie, bzw. von wo aus, die Funktion SetzeFocus aufgerufen wird. Das müsstest du uns schon mitteilen.

        Tschö, Auge

        --
        Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
        Terry Pratchett, "Wachen! Wachen!"
        Veranstaltungsdatenbank Vdb 0.3
        1. Wie man das realisieren kann, kommt darauf an, wie die Prüfung der Eingaben erfolgt und wie, bzw. von wo aus, die Funktion SetzeFocus aufgerufen wird. Das müsstest du uns schon mitteilen.

          mhhh.. dann versuche ich das mal einigermaßen nachvollziehbar darzustellen.
          Egal, wo man auf meiner Seite klickt, es wird immer die index.php erneut aufgerufen, jedoch wird entsprechend ein andere Wert in der Variable "$target" übergeben. In der index.php wird sämmtlicher Javascript ausgeführt (also dort wird auch der fcus gesetzt) und auch diverse scriptausführungen umgesetzt (z.B. geprüft, ob alle nötigen textfelder richtig ausgefüllt sind.

          Der eigentlich Inhalt der Seite wird über viele veschiedene Funktion dargestellt. Also je nach dem Wert in der Variable $target, wird die eine oder auch eine andere Funktion ausgeführt, die die ensprechenden Inhalte darstellt. Innerhalb einer Funktion werden also die vielen Textfelder dargestellt, die erneut aufgerufen werden, sofern ein textfeld falsch, ode gar nicht ausgefüllt worden ist. Ich übergebe also der Funktion mit den Textfeldern eine Variable, aus der hervor geht, welches Textfeld überabreitet werden muss. Diese bekommt dann die id "focus".

          Hoffe ihr konntet mir jetzt folgen ;)

          1. Hallo

            Ich stelle das jetzt mal um.

            Hoffe ihr konntet mir jetzt folgen ;)

            Nicht wirklich, aber sei's drum.

            ... Innerhalb einer Funktion werden also die vielen Textfelder dargestellt, die erneut aufgerufen werden, sofern ein textfeld falsch, ode gar nicht ausgefüllt worden ist. Ich übergebe also der Funktion mit den Textfeldern eine Variable, aus der hervor geht, welches Textfeld überabreitet werden muss. Diese bekommt dann die id "focus".

            Die Formularelemente haben keine anderen, eigenen IDs? Gesetzt den Fall, jedes Formularelement hätte eine eigene ID, könntest du den Inhalt des jeweiligen Elements prüfen und anhand der ID festlegen, ob noch einmal zu diesem Element zu springen und der Fokus dorthin zu setzen ist.

            <input id="bla" ... onblur="[code lang=javascript]Pruefung(this,this.value);">
            <input id="blubb" ... onblur="Pruefung(this,this.value);">[/code]

            function Pruefung(id,value) {  
            /* Prüfung (value), sowie Entscheidung, ob (zu id) Fokus zu setzen und die Seite zur entsprechenden Position zu verschieben ist. */  
            }
            

            Tschö, Auge

            --
            Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
            Terry Pratchett, "Wachen! Wachen!"
            Veranstaltungsdatenbank Vdb 0.3
  2. Du kannst entweder mit window.scrollTo(0,y) [für y die Höhe, um die Du nach unten scrollen willst, einsetzen] weitergehen oder aber einen Positionsanker (hash) setzen, der auf die ID des Felds verweist - oder eines Elements, das so positioniert ist, dass das Feld in der Mitte liegt.

    Gruß, LX

    --
    RFC 1925, Satz 3: Mit ausreichendem Schub fliegen Schweine wunderbar. (...)
    1. da klingt das... "window.scrollTo(0,y)" ...wohl am sinnvollsten.

      ich denk mal das platziere ich dann folgendermaßen:
      -------------------------------------------------------------
      function SetzeFocus()
      {
         var ElementID = "focus";
         document.getElementById(ElementID).focus();
         window.scrollTo(0,200);
      }

      setTimeout("SetzeFocus()",1000);
      -------------------------------------------------------------

      ...probiere ich mal aus.

      thx

  3. Wieder mal der Fucus :) SCNR