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

Search forms need submit button

    XMLWordPrintable

Details

    • 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

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

                Dates

                  Created:
                  Updated:
                  Resolved:

                  TestRail: Runs

                    TestRail: Cases