1
    2
    3
    4
    5
    6
    7
    8
    9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
  100
  101
  102
  103
  104
  105
  106
  107
  108
  109
  110
  111
  112
  113
  114
  115
  116
  117
  118
  119
  120
  121
  122
  123

content / test / data / accessibility / aria / aria-sort-aria-grid.html [blame]

<!--
@MAC-ALLOW:AXSortDirection
@WIN-ALLOW:sort:*
@AURALINUX-ALLOW:sort:*
-->
<html>
<body>
<!-- ARIA grid with a column header. -->

<!-- No sorting (implicit). -->
<div role="grid">
  <div role="row">
    <span role="columnheader">Alphabet</span>
  </div>
  <div role="row">
    <span role="gridcell">A</span>
  </div>
  <div role="row">
    <span role="gridcell">B</span>
  </div>
</div>

<!-- No sorting (explicit). -->
<div role="grid">
  <div role="row">
    <span role="columnheader" aria-sort="none">Alphabet</span>
  </div>
  <div role="row">
    <span role="gridcell">A</span>
  </div>
  <div role="row">
    <span role="gridcell">B</span>
  </div>
</div>

<!-- Ascending. -->
<div role="grid">
  <div role="row">
    <span role="columnheader" aria-sort="ascending">Alphabet</span>
  </div>
  <div role="row">
    <span role="gridcell">A</span>
  </div>
  <div role="row">
    <span role="gridcell">B</span>
  </div>
</div>

<!-- Descending. -->
<div role="grid">
  <div role="row">
    <span role="columnheader" aria-sort="descending">Alphabet</span>
  </div>
  <div role="row">
    <span role="gridcell">B</span>
  </div>
  <div role="row">
    <span role="gridcell">A</span>
  </div>
</div>

<!-- Unspecified. -->
<div role="grid">
  <div role="row">
    <span role="columnheader" aria-sort="other">Alphabet</span>
  </div>
  <div role="row">
    <span role="gridcell">A</span>
  </div>
  <div role="row">
    <span role="gridcell">A</span>
  </div>
</div>


<!-- ARIA grid with a row header. -->

<!-- No sorting (implicit). -->
<div role="grid">
  <div role="row">
    <span role="rowheader">Alphabet</span>
    <span role="gridcell">A</span>
    <span role="gridcell">B</span>
  </div>
</div>

<!-- No sorting (explicit). -->
<div role="grid">
  <div role="row">
    <span role="rowheader" aria-sort="none">Alphabet</span>
    <span role="gridcell">A</span>
    <span role="gridcell">B</span>
  </div>
</div>

<!-- Ascending. -->
<div role="grid">
  <div role="row">
    <span role="rowheader" aria-sort="ascending">Alphabet</span>
    <span role="gridcell">A</span>
    <span role="gridcell">B</span>
  </div>
</div>

<!-- Descending. -->
<div role="grid">
  <div role="row">
    <span role="rowheader" aria-sort="descending">Alphabet</span>
    <span role="gridcell">B</span>
    <span role="gridcell">A</span>
  </div>
</div>

<!-- Unspecified. -->
<div role="grid">
  <div role="row">
    <span role="rowheader" aria-sort="other">Alphabet</span>
    <span role="gridcell">A</span>
    <span role="gridcell">A</span>
  </div>
</div>
</body>
</html>