Fabulit: Link in Formular - I werd' narrisch

Guten Morgen liebe Forumsgemeinde,

ich möchte in einem Formular einen Link zur Verfügung stellen, der wie ein Button aussieht.

Die Umgebung ist ein großes Affen-Formular mit mehreren Submit-Buttons. Aufgrund der bereits vorhanden Submit-Buttons besteht der Wunsch, den Link ebenso zu gestalten. Es werden die System/Browser-Buttons[1] (keine Grafiken) verwendet. Da es sich um eine Vorschau-Funktionalität handelt, soll das Link-Ziel in einem neuen Tab/Fenster geöffnet werden. Dies ist explizit gewünscht. JavaScript ist vorausgesetzt.

Meine erste Idee war ein weiterer Submit-Button, und anschließende Weiterleitung per php und header. Da bekomme ich aber (mit meinem Kenntnisstand) keinen neuen Tab geöffnet.

Die zweite Idee war ein Submit-Button, der onclick das action- und das target-Attribut des Formulars anpasst. Da wurde mir klar, dass ich gar kein Submit haben will. Ganz im Gegenteil, dass Formular sollte unverändert stehen bleiben.

Also nehme ich ein <input type="button" /> oder ein <button> und umschließe diesen mit einem Link. Klasse Idee, funzt nich... Im FF werden gleich zwei neue Tabs geöffnet. Setze ich beim Button ein onclick="return false" wird der Event nicht mehr an den Link weitergegeben. Im IE8 spricht sich der Click-Event nicht mal bis zum Link rum, oder so. Viel Experimentierei mit der empirischen Erkenntnis; das wird erstmal nix.

Kurz hatte ich mich nach Javascript-Möglichkeiten umgeschaut. Aber um sauberes CrossBrowser-Tabbing zu schaffen, müsste man wohl ein Framework einsetzen.

Ich könnte zwar Grafiken verwenden, um ein einheitliches Erscheinungsbild von Link und Submit-Button zu schaffen, aber noch verfolge ich den puristischen Ansatz der System/Browserbuttons.

Beim googlen habe ich mich noch nicht all zu sehr verausgabt, aber erste Versuche zeigten, dass ich nicht die geeigneten Suchbegriffe zur Hand hatte. Es handelt sich meist um artverwandte Probleme, aber der entscheidende Denkanstoß war noch nicht dabei.

Daher ersuche ich euch um etwas Input. Welche Richtung sollte ich einschlagen?

Gruß Fabulit

[1] Einige Fachbegriffe sind frei erfunden und jegliche Ähnlichkeit zu real existierenden Ausdrücken ist zufällig.

  1. Hi,

    Also nehme ich ein <input type="button" /> oder ein <button> und umschließe diesen mit einem Link. Klasse Idee, funzt nich...

    Wenn du eh JavaScript voraussetzt - wozu dann überhaupt noch der Link drumherum? Auf den Klick auf den Button reagieren, und gut?

    Im FF werden gleich zwei neue Tabs geöffnet.

    Was *genau* macht dein Testcode?

    Setze ich beim Button ein onclick="return false" wird der Event nicht mehr an den Link weitergegeben.

    Logisch, oder?

    Kurz hatte ich mich nach Javascript-Möglichkeiten umgeschaut. Aber um sauberes CrossBrowser-Tabbing zu schaffen, müsste man wohl ein Framework einsetzen.

    Du willst doch einfach nur ein neues Fenster öffnen - was soll das mit „CrossBrowser-Tabbing“ zu tun haben,

    [1] Einige Fachbegriffe sind frei erfunden und jegliche Ähnlichkeit zu real existierenden Ausdrücken ist zufällig.

    was auch immer das eigentlich sein soll ...?

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    1. Wenn du eh JavaScript voraussetzt - wozu dann überhaupt noch der Link drumherum? Auf den Klick auf den Button reagieren, und gut?

      Um den Link als Link zu haben und weil meine JavaScript-Kenntnisse derart begrenzt sind, dass ich mein Vorhaben nicht umsetzen konnte.

      Du willst doch einfach nur ein neues Fenster öffnen - was soll das mit „CrossBrowser-Tabbing“ zu tun haben,

      Vorzugsweise möchte ich ein neues Tab öffnen. Und erste Recherche zeigten, dass Browser sich diesbezüglich recht unterschiedlich verhalten.

      Aber gut. Dann schau ich mal was JavaScript so zu bieten hat. Mit window.open bin ich auf dem richtigen Weg?

      Gruß Fabulit

      1. Hi,

        Wenn du eh JavaScript voraussetzt - wozu dann überhaupt noch der Link drumherum? Auf den Klick auf den Button reagieren, und gut?

        Um den Link als Link zu haben und weil meine JavaScript-Kenntnisse derart begrenzt sind, dass ich mein Vorhaben nicht umsetzen konnte.

        Gut, anders gefragt - wozu überhaupt JavaScript?

        Und wieso hast du meine Frage nach dem konkret von dir verwendeten Code kommentarlos übergangen?

        Vorzugsweise möchte ich ein neues Tab öffnen. Und erste Recherche zeigten, dass Browser sich diesbezüglich recht unterschiedlich verhalten.

        Ob ein Browser ggf. ein neues Tab oder ein neues Fenster öffnet, entscheidet der Benutzer.

        Aber gut. Dann schau ich mal was JavaScript so zu bieten hat. Mit window.open bin ich auf dem richtigen Weg?

        Wenn dich ein eventuelles Hängenbleiben in einem restriktiven Popupblocker nicht allzu sehr stört ...

        MfG ChrisB

        --
        RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
        1. Und wieso hast du meine Frage nach dem konkret von dir verwendeten Code kommentarlos übergangen?

          Ich fand meine Beschreibung eindeutig, aber der Vollständigkeit halber:

          <a href="ziel.html" target="_blank"><input type="button" value="Vorschau" /></a>

          Wenn dich ein eventuelles Hängenbleiben in einem restriktiven Popupblocker nicht allzu sehr stört ...

          Das würde ich dann dem User überlassen. Allerdings würde ich eine JavaScript-freie Lösung bevorzugen. Also falls Du mir da noch einen Denkanstoß geben könntest, lass ich mich gern darauf ein.

          Gruß Fabulit

          1. <a href="ziel.html" target="_blank"><input type="button" value="Vorschau" /></a>

            das ist einfach invalide, ein klickbarer Bereich innerhalb eines ebensolchen erscheint auch recht sinnlos ...

            1. das ist einfach invalide, ein klickbarer Bereich innerhalb eines ebensolchen erscheint auch recht sinnlos ...

              Wegen der Invalidität habe ich die Idee auch recht schnell wieder verworfen. Aber meine Intention sollte doch klar sein; die Optik des Buttons mit der Funktionalität des Links.

              Ich habe nach wie vor Interesse an einer JavaScript-freien Lösung, falls jemand noch eine Idee hat.

              1. die Optik des Buttons mit der Funktionalität des Links.

                für "Optik" gibt es CSS, also einfachen Link ins HTML und im CSS zum Button gestalten

                1. Hallo,

                  die Optik des Buttons mit der Funktionalität des Links.
                  für "Optik" gibt es CSS, also einfachen Link ins HTML und im CSS zum Button gestalten

                  ich würde dir ja zustimmen ... aber damit ist es AFAIK nicht möglich, einen Link so aussehen zu lassen, wie ein gewöhnlicher Button im verwendeten GUI aussehen würde. Das liegt daran, dass der Webautor nicht *wissen* kann, wie das verwendete System einen Button darstellen würde.

                  Ciao,
                   Martin

                  --
                  Zwei Politiker auf dem Weg zum Sitzungssaal: "Was sagten Sie in ihrer Rede neulich noch zur Rentenreform?" - "Nichts." - "Ja, schon klar. Aber wie haben Sie es formuliert?"
                  Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
          2. Hi,

            <a href="ziel.html" target="_blank"><input type="button" value="Vorschau" /></a>

            Das dadurch zwei neue Tabs geöffnet werden, kann ich in einem uralten FF3 zwar nachvollziehen - in einem aktuellen FF5 aber nicht mehr.

            MfG ChrisB

            --
            RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    2. Alles wunderbar. Vielen Dank. Und so einfach kann es sein...

      <input type="button" onclick="window.open('ziel.html')" value="Vorschau" />