Uploaded image for project: 'stripes-components'
  1. stripes-components
  2. STCOM-354

Search forms need submit button

    XMLWordPrintable

    Details

    • Template:
    • Sprint:
      stripes force Sprint 48

      Description

      Search & filter forms need a submit: https://www.w3.org/TR/WCAG20-TECHS/H32.html

      eHoldings uses a block-level "Search" button after the <SearchField>...

      ... but I recommend embedding a solution directly into the <SearchField> component.

      There are a few different ways we could approach this:

      • Google puts a clickable search icon on the end of the input; most people probably just hit enter, but it's there for people who need it. This option could be pulled off with basically the same style as currently applied, just moving the search icon to the end of the input instead of the beginning:
      • Here's a nice example with an integrated button with a background color:
        https://designsystem.digital.gov/components/search-bar/

      We should also use input type="search" - there are plenty of smart workarounds for styling those now. It unlocks nice things like software keyboards changing "Enter" to "Search" instead of "Submit" and smarter autocompletion.

        TestRail: Results

          Attachments

            Issue Links

              Activity

                People

                Assignee:
                cherewaty Jeffrey Cherewaty
                Reporter:
                cherewaty Jeffrey Cherewaty
                Votes:
                0 Vote for this issue
                Watchers:
                5 Start watching this issue

                  Dates

                  Created:
                  Updated:
                  Resolved:

                    TestRail: Runs

                      TestRail: Cases