Thoralf Knuth: /CSS <button> als Verweis, Formulare schachteln?

SELF-Forum

/CSS <button> als Verweis, Formulare schachteln?

Thoralf Knuth Homepage des Autors
– Informationen zu den Bewertungsregeln

Hallo,

wie kann ich einen Button als Link verwenden? *bg* Wer jetzt panisch am Tisch kaut, sorry. ;)

http://de.selfhtml.org/navigation/faq.htm#button_als_verweis kenne ich natürlich, nur klappt das so, wie ich das will, leider nicht.

Ausgangssituation:
Ich habe eine Formular mit einem Submit-Button, klappt einwandfrei. Dieses Formular ist Teil einer Rückfrage.

Ziel:
Ich möchte in diesem Formular einen Button haben, der den Vorgang abbricht bzw. nicht auslöst. Bloßes Reset ist nicht ausreichend, ich will zurück zur vorhergehenden Übersicht.

Problem:
JavaScript-Eventhandler will ich vermeiden.
Es muss sich typischen Windows/IE-Nutzern erschließen und in sich stimmig bleiben.

Code:

  
<form action="[code lang=php]<?=$_SERVER["PHP_SELF"];?>
~~~" method="post" class="...">  
 <!-- ... -->  
 <strong>Datum:</strong> `<?=strftime( "%A, %d.%m.%Y", strtotime( $arr[$iIdx]["datum"] ));?>`{:.language-php}<br />  
 <input type="hidden" id="i" name="i" value="`<?=$iIdx;?>`{:.language-php}" />  
 <!-- ... -->  
 <button type="submit" id="sicherheitsabfrage" name="sicherheitsabfrage" value="Ja">Wirklich? (...)</button>  
</form>  
[/code]  
  
Meine Lösungen(en):  
1\. Einfach ein normaler Link als "Nein".  
Valide, Semantisch korrekt, aber häßlich. Leider gibt es wohl keinen CSS-Möglichkeit, das clientseitige Button-Aussehen zu kopieren.  
  
2\. GET statt POST-Parameter und alles per Link machen.  
Valide, Semantisch korrekt, aber häßlich. Dann müsste ich im gesamten Projekt alle Buttons selbst einheitlich per CSS umgestalten, genau das will ich nicht.  
  
3\. Wie in <http://de.selfhtml.org/navigation/faq.htm#button_als_verweis> ein zweites Formular  
~~~html
  
<form action="[code lang=php]<?=$_SERVER["PHP_SELF"];?>
~~~" method="post" class="...">  
 <!-- ... -->  
 <strong>Datum:</strong> `<?=strftime( "%A, %d.%m.%Y", strtotime( $arr[$iIdx]["datum"] ));?>`{:.language-php}<br />  
 <input type="hidden" id="i" name="i" value="`<?=$iIdx;?>`{:.language-php}" />  
 <!-- ... -->  
 <button type="submit" id="sicherheitsabfrage" name="sicherheitsabfrage" value="Ja">Wirklich? (...)</button>  
</form>  
<form action="index.php" method="get">  
 <button type="submit">Ich bin nicht sicher</button>  
</form>  
[/code]  
Valide, Semantisch korrekt, aber häßlich. Die Buttons müssen nebeneinander, das ist überall so. ;)  
  
4\. Damit kam ich auf:  
~~~html
  
<form action="[code lang=php]<?=$_SERVER["PHP_SELF"];?>
~~~" method="post" class="...">  
 <!-- ... -->  
 <strong>Datum:</strong> `<?=strftime( "%A, %d.%m.%Y", strtotime( $arr[$iIdx]["datum"] ));?>`{:.language-php}<br />  
 <input type="hidden" id="i" name="i" value="`<?=$iIdx;?>`{:.language-php}" />  
 <!-- ... -->  
 <button type="submit" id="sicherheitsabfrage" name="sicherheitsabfrage" value="Ja">Wirklich? (...)</button>  
  
 <form style="display:inline;" action="index.php" method="get"><button type="submit">Ich bin nicht sicher</button></form>  
</form>  
[/code]  
Validiert, Tidy gibt nur eine Warnung, dass man Formulare nicht schachteln sollte.  
Semantisch bin ich nicht sicher, wie sauber ein solches Formular ist, immerhin wird es korrekt wieder geschlossen, passt also in die "Baumstruktur", als die ich mir HTML immr vorstelle.  
Problem: Beim Klick auf den Submit im inneren Formular wird aber die Action des äußeren Formulars aufgerufen. (`<?=$_SERVER["PHP_SELF"];?>`{:.language-php} valuiert zu loeschen.php)  
  
Sieht jemand eine Lösung oder einen Königsweg? Danke!  
  
Gruß, Thoralf

-- 
Sic Luceat Lux!
Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. /CSS <button> als Verweis, Formulare schachteln?

    Cheatah
    +1 Informationen zu den Bewertungsregeln

    Hi,

    1. Einfach ein normaler Link als "Nein".
      Valide, Semantisch korrekt, aber häßlich.

    ob hässlich oder nicht ist vom HTML-Code unabhängig.

    Leider gibt es wohl keinen CSS-Möglichkeit, das clientseitige Button-Aussehen zu kopieren.

    Nein, kopieren kann man nicht. Aber nachmachen.

    </form>
    <form action="index.php" method="get">
    Valide, Semantisch korrekt, aber häßlich. Die Buttons müssen nebeneinander, das ist überall so. ;)

    Ob nebeneinander oder nicht ist vom HTML-Code unabhängig.

    <form action="<?=$_SERVER["PHP_SELF"];?>" method="post" class="...">
    <form style="display:inline;" action="index.php" method="get"><button type="submit">Ich bin nicht sicher</button></form>
    </form>
    Validiert, Tidy gibt nur eine Warnung, dass man Formulare nicht schachteln sollte.

    Tidy ist ein Dreck. Ganz nett, wenn man damit umgehen kann, aber ansonsten zur Validierung absolut ungeeignet. Bei kritischen Fehlern eine Warnung auszugeben ist Schwachsinn. Die gute Nachricht ist, dass Validierung überhaupt nicht zu den Aufgaben von Tidy gehört.

    Semantisch bin ich nicht sicher, wie sauber ein solches Formular ist,

    Strikt verboten. Die Frage nach semantischer Korrektheit stellt sich nicht, weil es schlicht invalide ist.

    immerhin wird es korrekt wieder geschlossen, passt also in die "Baumstruktur", als die ich mir HTML immr vorstelle.

    Links darf man übrigens ebenfalls nicht schachteln, und zwar aus ziemlich vergleichbaren Gründen.

    Problem: Beim Klick auf den Submit im inneren Formular wird aber die Action des äußeren Formulars aufgerufen.

    Das Verhalten bei derart fehlerhaftem Code ist undefiniert. Der nächste Browser eliminiert vielleicht das innere Formular aus dem DOM-Baum.

    Sieht jemand eine Lösung oder einen Königsweg? Danke!

    Lösung 1. Du willst schließlich eine Ressource verlinken, also bietet es sich an, einen Link zu verwenden.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    Beitrag melden
    +1
    Informationen zu den Bewertungsregeln

    1. /CSS <button> als Verweis, Formulare schachteln?

      Thoralf Knuth Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Hallo Cheatah,

      1. Einfach ein normaler Link als "Nein".
        Valide, Semantisch korrekt, aber häßlich.
        ob hässlich oder nicht ist vom HTML-Code unabhängig.

      Leider gibt es wohl keinen CSS-Möglichkeit, das clientseitige Button-Aussehen zu kopieren.
      Nein, kopieren kann man nicht. Aber nachmachen.

      Eben das meine ich mit häßlich. Sobald der Benutzer Windows XP hat und dabei dieses Quietschi-Bunte Design nutzt, sehen "seine" und "meine" Buttons sehr verschieden aus.

      Ob nebeneinander oder nicht ist vom HTML-Code unabhängig.

      Wie setze ich denn einen Button außerhalb eines Formulars neben einen innerhalb eines Formulars? Ich müsste doch wieder diverse Container-Krücken bauen, um die Formulare optisch ineinander zu schieben.

      Validiert, Tidy gibt nur eine Warnung, dass man Formulare nicht schachteln sollte.
      Tidy ist ein Dreck. Ganz nett, wenn man damit umgehen kann, aber ansonsten zur Validierung absolut ungeeignet. Bei kritischen Fehlern eine Warnung auszugeben ist Schwachsinn. Die gute Nachricht ist, dass Validierung überhaupt nicht zu den Aufgaben von Tidy gehört.

      Du hast mich missverstanden, der Validator meint, es wäre korrektes XHTML1.0 strict und NUR Tidy, bzw. die entsprechende FF-Erweiterung bringt mir eine Warnung, dass man Forms nicht schachteln sollte. Und ich weiß, dass eine Tidy-Warnung keine Wertung über den "Level" des Fehlers ist, sondern schlicht aussagt, diesen Fehler könne Tidy selbst beheben. Ich werde aber das fehlerhafte HTML nochmal außerhalb der Entwicklungsumgebung per URL in den Validator füttern, beim Upload per FF-Erweiterung meckert er nämlich überhaupt nicht daran, obwohl er das sonst bei jedem Fehler tut.

      Semantisch bin ich nicht sicher, wie sauber ein solches Formular ist,
      Strikt verboten. Die Frage nach semantischer Korrektheit stellt sich nicht, weil es schlicht invalide ist.
      Links darf man übrigens ebenfalls nicht schachteln, und zwar aus ziemlich vergleichbaren Gründen.

      Das weiß ich, das steht explizit in der HTML401-Spezifikation. Nur im Kapitel über Forms finde ich ein solches Verbot eben nicht. Mittlerweile hab ich einen Hinweis auf http://de.selfhtml.org/html/referenz/elemente.htm#form aber über einen älteren Beitrag im Archiv gefunden und dort natürlich dann ein klares Verbot. Steht diese Einschränkung tatsächlich nur in der DTD?

      Lösung 1. Du willst schließlich eine Ressource verlinken, also bietet es sich an, einen Link zu verwenden.

      Es ist tatsächlich wahr, Sport befreit den Geist. Nach dem Training ist mir dann das naheliegendste wie Schuppen von den Augen gefallen. Ich nehme zwei normale Submit-Buttons und lasse die Logik und entsprechende Entscheidung, wo sie hingehört, im PHP. Danke für den Denkanstoß.

      Gruß, Thoralf

      --
      Sic Luceat Lux!
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

  2. /CSS <button> als Verweis, Formulare schachteln?

    dedlfix
    +1 Informationen zu den Bewertungsregeln

    echo $begrüßung;

    <?=$_SERVER["PHP_SELF"];?>

    Diese Kurzschreibweise spart zwar ein wenig Tipparbeit, funktioniert aber nicht auf den PHP-Installationen, die short_open_tag ausgeschaltet haben. (z.B. weil diese mit <?xml... kollidieren.)

    Sieht jemand eine Lösung oder einen Königsweg? Danke!

    Ich schlage vor, zwei <input type="submit" ...> mit gleichen Namen zu nehmen. Das auswertende Script schickt dann im Bedarfsfall einen Location-Header zum Client.

    Mit <button type="submit"> kann man in dem Fall nicht arbeiten, weil die IE-Implementation grob fehlerhaft ist. Ohne einen Javascript-Workaround kann man auf Serverseite nicht auswerten, welcher Button aktiviert wurde.

    echo "$verabschiedung $name";

    Beitrag melden
    +1
    Informationen zu den Bewertungsregeln

    1. /CSS <button> als Verweis, Formulare schachteln?

      Thoralf Knuth Homepage des Autors
      – Informationen zu den Bewertungsregeln

      N'Abend,

      Diese Kurzschreibweise spart zwar ein wenig Tipparbeit, funktioniert aber nicht auf den PHP-Installationen, die short_open_tag ausgeschaltet haben. (z.B. weil diese mit <?xml... kollidieren.)

      ist bekannt, aber mein Server macht's. Deswegen mache ich alles, was ich beeinflussen kann, serverseitig, da kenne ich die Umgebung. Und es ist grade für Affenformulare extrem bequem, auch wenn <?='<?xml';?> jedesmal wieder nervt. ;)

      Sieht jemand eine Lösung oder einen Königsweg? Danke!
      Ich schlage vor, zwei <input type="submit" ...> mit gleichen Namen zu nehmen. Das auswertende Script schickt dann im Bedarfsfall einen Location-Header zum Client.

      Genau das werde ich tun.

      Mit <button type="submit"> kann man in dem Fall nicht arbeiten, weil die IE-Implementation grob fehlerhaft ist. Ohne einen Javascript-Workaround kann man auf Serverseite nicht auswerten, welcher Button aktiviert wurde.

      Danke für den Hinweis, damit muss ich ein bißchen umherprobieren. Ich weiß nur, dass der IE value nicht oder falsch mitschickt. Dem Archiv-Thread entnehme ich aber, dass er rotzfrech alle Submit-Buttons mitschickt. Das würde wieder genau das Problem aufreißen, was ich vermeiden will, nur eben an anderer Baustelle.

      Gruß, Thoralf

      --
      Sic Luceat Lux!
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln