Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make date input methods uniform #2

Open
toraritte opened this issue May 19, 2023 · 1 comment
Open

Make date input methods uniform #2

toraritte opened this issue May 19, 2023 · 1 comment
Labels

Comments

@toraritte
Copy link
Member

toraritte commented May 19, 2023

Settled on is slate-1's simple design, because:

  • "JAWS users can just hit C to jump to the combo box"
  • the input is pre-populated with the current date
@toraritte toraritte changed the title Makes date input methods uniform Make date input methods uniform May 19, 2023
@toraritte
Copy link
Member Author

toraritte commented May 19, 2023

    • Do an inventory of pages that have a date input.
    • Figure out how to make re-usable UI components (i.e., once inserted, they would all behave the same, and one change would propagate to every instance).
    • Replace every date input discovered in step 1.

The example HTML from slate-1:

<tr>
   <td align="right">Start Date:</td>
   <td>
      <select name="selStartMonth" id="selStartMonth" title="Start Month">
         <option value="1">January</option>
         <option value="2">February</option>
         <option value="3">March</option>
         <option value="4">April</option>
         <option selected="selected" value="5">May</option>
         <option value="6">June</option>
         <option value="7">July</option>
         <option value="8">August</option>
         <option value="9">September</option>
         <option value="10">October</option>
         <option value="11">November</option>
         <option value="12">December</option>
      </select>
      <select name="selStartDay" id="selStartDay" title="Start Day" size="1">
         <option value="1">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>
         <option value="6">6</option>
         <option value="7">7</option>
         <option value="8">8</option>
         <option value="9">9</option>
         <option value="10">10</option>
         <option value="11">11</option>
         <option value="12">12</option>
         <option value="13">13</option>
         <option value="14">14</option>
         <option value="15">15</option>
         <option value="16">16</option>
         <option value="17">17</option>
         <option value="18">18</option>
         <option selected="selected" value="19">19</option>
         <option value="20">20</option>
         <option value="21">21</option>
         <option value="22">22</option>
         <option value="23">23</option>
         <option value="24">24</option>
         <option value="25">25</option>
         <option value="26">26</option>
         <option value="27">27</option>
         <option value="28">28</option>
         <option value="29">29</option>
         <option value="30">30</option>
         <option value="31">31</option>
      </select>
      ,
      <select name="selStartYear" id="selStartYear" title="Start Year" size="1">
         <option value="2013">2013</option>
         <option value="2014">2014</option>
         <option value="2015">2015</option>
         <option value="2016">2016</option>
         <option value="2017">2017</option>
         <option value="2018">2018</option>
         <option value="2019">2019</option>
         <option value="2020">2020</option>
         <option value="2021">2021</option>
         <option value="2022">2022</option>
         <option selected="selected" value="2023">2023</option>
         <option value="2024">2024</option>
         <option value="2025">2025</option>
         <option value="2026">2026</option>
         <option value="2027">2027</option>
         <option value="2028">2028</option>
         <option value="2029">2029</option>
         <option value="2030">2030</option>
         <option value="2031">2031</option>
         <option value="2032">2032</option>
      </select>
   </td>
</tr>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant