Pflegel: HTML Formular funktioniert nur unter Crome nicht

problematische Seite

Hallo,

das große Inputfeld für die Suche auf unserer Startseite funktioniert im Deskopbrowser (Firefox, IE, Chrome).

<form autocomplete="off" action="/" class="clearfix" id="searchform" method="get" role="search">
  <div class="form-group"> 
    <div class="input-group"> 
      <input type="text" id="inputSuccess" name="s" placeholder="Traumbild, Schlagwort oder Deutung" class="form-control input-lg"> 
      <span class="input-group-btn"> 
        <button alt="Traumsymbol Suchen" type="button" class="btn btn-success btn-lg">
          <span class="glyphicon glyphicon-search"></span>
        </button>
      </span> 
    </div>
  </div>
</form>

Allerdings nicht unter Android und ...

  1. problematische Seite

    Hallo Pflegel,

    das große Inputfeld für die Suche auf unserer Startseite funktioniert im Deskopbrowser (Firefox, IE, Chrome).

    Der Validator sagt

    Error: Duplicate ID searchform.
    
    From line 48, column 683; to line 48, column 778
    
    l-md-10"> <form role="search" method="get" id="searchform" class="clearfix" action="/" autocomplete="off"> <div 
    
    

    Bis demnächst
    Matthias

    --
    Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
    1. problematische Seite

      Hallo Matthias,

      ich habe das ID Feld gelöscht, leider trotzdem keine Änderung.

  2. problematische Seite

    Button type="button" ergibt kein submit beim Draufklicken.

    MfG

  3. problematische Seite

    @@Pflegel

    das große Inputfeld für die Suche auf unserer Startseite funktioniert im Deskopbrowser (Firefox, IE, Chrome).

    Bei einem Eingabefeld, das keine Beschriftung hat, würde ich nicht sagen, dass es funktioniert. Nicht für alle. Jedes Eingabefeld braucht ein zugehöriges label. Es sein denn, die Beschriftung wird mit ARIA-Attributen gemacht.

    Placeholder sind keine Beschriftung.

    Und natürlich braucht auch jeder Button eine Beschriftung. Deiner hat keine.

    Ich bin mir auch nicht sicher, ob man form auf role="search" setzen sollte oder ob man das einem anderen Element geben muss. Da hab ich Widersprüchliches zu gefunden. Muss ich mal nachfragen.

    LLAP 🖖

    --
    “There’s no such thing as an ‘average’ user, but there is such a thing as an average developer.” —Vitaly Friedman in Accessibility Matters: Meet Our New Book, “Inclusive Design Patterns”
    Selfcode: sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|
    1. problematische Seite

      @@Gunnar Bittersmann

      Jedes Eingabefeld braucht ein zugehöriges label. Es sein denn, die Beschriftung wird mit ARIA-Attributen gemacht.

      aria-label und/oder title: https://forum.selfhtml.org/meta/2016/may/5/wiki-push-im-mai/1666696#m1666696 ff.

      Ich bin mir auch nicht sicher, ob man form auf role="search" setzen sollte oder ob man das einem anderen Element geben muss. Da hab ich Widersprüchliches zu gefunden. Muss ich mal nachfragen.

      Hab ich: https://twitter.com/g16n/status/754192229883838464 Mal sehen, was Léonie Watson und Steve Faulkner sagen.

      LLAP 🖖

      --
      “There’s no such thing as an ‘average’ user, but there is such a thing as an average developer.” —Vitaly Friedman in Accessibility Matters: Meet Our New Book, “Inclusive Design Patterns”
      Selfcode: sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|