NVDA is not reading the content properly in Wijmo flex grid Column

NVDA is not reading the content properly in Wijmo flex grid Column

Posted by: senthamizh.selvi on 15 October 2024, 4:34 am EST

• 

  senthamizh.selvi

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 15 October 2024, 4:34 am EST

  In wijmo grid, columns are generated based on the data. In column, input date (datepicker) value is mapped for each cell.

  NVDA is reading the input date value correctly for all the columns except the last column.

  In wijmo grid, each column is generated using the ngFor loop. If columns is generated using ngFor directive, NVDA is not reading the content value correctly.

  Without ngFor directive, if we create the wijmo grid column, then the NVDA is reading the value correctly.

• 

  senthamizh.selvi

  • Post Options:
  • Link
    Copy

  Posted 16 October 2024, 8:24 am EST - Updated 16 October 2024, 8:29 am EST

  

  738×439 90.4 KB

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 17 October 2024, 9:27 am EST

  Hi Senthamizh,

  We are working on this case, trying to replicate the issue on our end. We will share an update with you soon. Meanwhile, if there is something that could be helpful or relevant to this issue, you can let us know.

  Regards

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 18 October 2024, 2:33 am EST

  Hi Senthamizh,

  On investigating the issue we found that, the issue was caused by the custom editor used in the column, when the cell is selected the focus moves to the editor’s host element and NVDA reads that value. It seems you are using ‘InputDate’ as a custom editor for the columns, so you can use the following CSS to avoid this issue -

  .wj-flexgrid .wj-inputdate:not(.wj-cell .wj-inputdate){
      display: none;
  }

  Please find attached a sample demonstrating the same.

  In case, you face this issue with some other editor in grid, you can follow the same approach to resolve the issue, i.e. replace the editor’s host element class name with ‘.wj-inputdate’ in above CSS.

  In case, you still face any issues, please let us know.

  Regards

  Grid_Editing_CustomEditors_Angular.zip

• 

  senthamizh.selvi

  • Post Options:
  • Link
    Copy

  Posted 18 October 2024, 7:29 am EST

  We tried it and it is working fine now. NVDA is reading all the columns perfectly. Thank you for the solution