[Cropper Library] Accessibility for Select all check box in table

Forge Component
(5)
Published on 2019-10-02 by Labs
5 votes
Published on 2019-10-02 by Labs

Hi All,

How we can make select all accessible when using in table records which can be read by NVDA reader  .I got some approaches in different websites .

An approach to the "select-all" checkbox table header

  • Table must have summary explaining the description about table.
  • Check box should have title attribute.
  • Individual row checkboxes have explicit, but visually hidden label text, "Select this row". This label text could also be the same as the Title cell's content, or a combination, for example, "Select the row for Roto Facilisis Blandit".
  • the cells in the "Title" column are marked up as th elements with scope="row" to act as row headers for supporting screen readers

select-all" checkbox is outside and before the table

the "select-all" checkbox exists on its own outside of and before the table, but is positioned via CSS to appear over the first cell of the first column in the table

it occurs in the same position in the TAB order implementation

because it isn't in a table header cell, there is no issue with it being read as a column header for each of the rows' checkboxes

the first cell in the first column is now an empty th header cell


Data take from : http://www.kisser.ca/testing/drupal-table-select-all.html


Please add if anyone have any more approaches to achive this which will make NVDA to read for assistive reader.


Thanks

AD

AD wrote:

Hi All,

How we can make select all accessible when using in table records which can be read by NVDA reader  .I got some approaches in different websites .

An approach to the "select-all" checkbox table header

  • Table must have summary explaining the description about table.
  • Check box should have title attribute.
  • Individual row checkboxes have explicit, but visually hidden label text, "Select this row". This label text could also be the same as the Title cell's content, or a combination, for example, "Select the row for Roto Facilisis Blandit".
  • the cells in the "Title" column are marked up as th elements with scope="row" to act as row headers for supporting screen readers

select-all" checkbox is outside and before the table

the "select-all" checkbox exists on its own outside of and before the table, but is positioned via CSS to appear over the first cell of the first column in the table

it occurs in the same position in the TAB order implementation

because it isn't in a table header cell, there is no issue with it being read as a column header for each of the rows' checkboxes

the first cell in the first column is now an empty th header cell


Data take from : http://www.kisser.ca/testing/drupal-table-select-all.html


Please add if anyone have any more approaches to achive this which will make NVDA to read for assistive reader.


Thanks

AD

 Hai Sir I will Share One OML Sheet I think It Will Helps To You Sir 

 

Selva bharath wrote:

AD wrote:

Hi All,

How we can make select all accessible when using in table records which can be read by NVDA reader  .I got some approaches in different websites .

An approach to the "select-all" checkbox table header

  • Table must have summary explaining the description about table.
  • Check box should have title attribute.
  • Individual row checkboxes have explicit, but visually hidden label text, "Select this row". This label text could also be the same as the Title cell's content, or a combination, for example, "Select the row for Roto Facilisis Blandit".
  • the cells in the "Title" column are marked up as th elements with scope="row" to act as row headers for supporting screen readers

select-all" checkbox is outside and before the table

the "select-all" checkbox exists on its own outside of and before the table, but is positioned via CSS to appear over the first cell of the first column in the table

it occurs in the same position in the TAB order implementation

because it isn't in a table header cell, there is no issue with it being read as a column header for each of the rows' checkboxes

the first cell in the first column is now an empty th header cell


Data take from : http://www.kisser.ca/testing/drupal-table-select-all.html


Please add if anyone have any more approaches to achive this which will make NVDA to read for assistive reader.


Thanks

AD

 Hai Sir I will Share One OML Sheet I think It Will Helps To You Sir 

 

Hi Selva,

Can you share the file in zip format


Thanks

AD

 

AD wrote:

Selva bharath wrote:

AD wrote:

Hi All,

How we can make select all accessible when using in table records which can be read by NVDA reader  .I got some approaches in different websites .

An approach to the "select-all" checkbox table header

  • Table must have summary explaining the description about table.
  • Check box should have title attribute.
  • Individual row checkboxes have explicit, but visually hidden label text, "Select this row". This label text could also be the same as the Title cell's content, or a combination, for example, "Select the row for Roto Facilisis Blandit".
  • the cells in the "Title" column are marked up as th elements with scope="row" to act as row headers for supporting screen readers

select-all" checkbox is outside and before the table

the "select-all" checkbox exists on its own outside of and before the table, but is positioned via CSS to appear over the first cell of the first column in the table

it occurs in the same position in the TAB order implementation

because it isn't in a table header cell, there is no issue with it being read as a column header for each of the rows' checkboxes

the first cell in the first column is now an empty th header cell


Data take from : http://www.kisser.ca/testing/drupal-table-select-all.html


Please add if anyone have any more approaches to achive this which will make NVDA to read for assistive reader.


Thanks

AD

 Hai Sir I will Share One OML Sheet I think It Will Helps To You Sir 

 

Hi Selva,

Can you share the file in zip format


Thanks

AD


 

 Sorry Sir actually I have Only Rar File Sir 

Send My OML Sheet 

This Zip File Sir 

Selva bharath wrote:

This Zip File Sir 

 Hi Selva,

Oml is not opening  getting below error. I m looking for any other approach to achive accessibility your is similar to one which i have mentioned.Any ways thanks for your inputs

 

Thanks

AD

Hai AD

Have A good Day For You 

Regarding Bulk Select In Table Share One Link And Logic Flow Images 

https://www.outsystems.com/forums/discussion/59954/is-there-any-bulk-list-select-for-reactive-web/