I am testing this plugin to build an internal database website for our organization. But some of our users are visually impaired and use screen readers (NVDA or JAWS) for using computers.
I found that your plugin is not fully accessible to screen readers but I have found work around for almost all issues except one. In all the modal windows open to add new entry, delete entry or even show master detail, when the users click on the button to open the modal, the current focus item is not changed to the modal window rather than stays on the parent element. Now for users who can see, that is not an issue because we can just see the modal and start using it with a mouse click.
However, for a blind user, this is a serious issue. His screen reader would then keep reading the parent content even though the modal window is opened and he will not know what is happening. So is there any way to shift the focus inside the modal dailog by adding custom js? I guess its not that difficult.
Some examples of good focus in your plugin:
1. In pagination, when we click for example, "3", the focus automatically goes to "showing 11 of 40 entries" so that blind users would know the table is updated.
2. When we add the entry, the focus goes to success message and says the data is updated.
If I can find a solution to this, then I will buy your plugin.
Also, I suggest you implement, WCAG in your plugin or at least make your table more accessible to persons with disabilities also that way your customers base will increase significantly because today more and more governments and organization has agreed to make their website disability friendly.
I am sorry to disappoint you, but unfortunately we won't be able to make the changes in near future. We are well aware of this, and our development team has it in their to-do list, but we haven't gotten to it yet.
Unfortunately, the changes that you're about cannot be implemented yet, because our developers have a lot of work on their hands, and they don't have time for custom development. When they start working on improving the plugin for visually impaired people, they will dedicate themselves to that task only, but I cannot say when that will be.
What I am asking is not a custom development. Its just a line of code or two, which if your developer can share then I can paste in custom js code box of your plugin.
Only thing that needs to be done is when you click on ADD NEW RECORD or EDIT RECORD button and the modal opens, the focus should automatically go to that modal window.
Its just a 5 min work for someone who knows JS. Unfortunately, I am not that proficient in this. Thus I am requesting this.
And it will automatically focus to the "Columnname" column in the edit modal. So the only thing you need to find here is the column's name, to insert instead of "#table_1_columnname":
#table_1_columnname
When you open the modal, and right click on a field go to inspect:
It will open the console, where you will see the name:
So, for the modal shown above, you'd need to use this JS:
Hello,
I am testing this plugin to build an internal database website for our organization. But some of our users are visually impaired and use screen readers (NVDA or JAWS) for using computers.
I found that your plugin is not fully accessible to screen readers but I have found work around for almost all issues except one. In all the modal windows open to add new entry, delete entry or even show master detail, when the users click on the button to open the modal, the current focus item is not changed to the modal window rather than stays on the parent element. Now for users who can see, that is not an issue because we can just see the modal and start using it with a mouse click.
However, for a blind user, this is a serious issue. His screen reader would then keep reading the parent content even though the modal window is opened and he will not know what is happening. So is there any way to shift the focus inside the modal dailog by adding custom js? I guess its not that difficult.
Some examples of good focus in your plugin:
1. In pagination, when we click for example, "3", the focus automatically goes to "showing 11 of 40 entries" so that blind users would know the table is updated.
2. When we add the entry, the focus goes to success message and says the data is updated.
If I can find a solution to this, then I will buy your plugin.
Also, I suggest you implement, WCAG in your plugin or at least make your table more accessible to persons with disabilities also that way your customers base will increase significantly because today more and more governments and organization has agreed to make their website disability friendly.
I will be waiting for your reply.
Regards,
Sagar
Hello Sagar
Thank you for your interest in our plugin.
I am sorry to disappoint you, but unfortunately we won't be able to make the changes in near future. We are well aware of this, and our development team has it in their to-do list, but we haven't gotten to it yet.
Unfortunately, the changes that you're about cannot be implemented yet, because our developers have a lot of work on their hands, and they don't have time for custom development. When they start working on improving the plugin for visually impaired people, they will dedicate themselves to that task only, but I cannot say when that will be.
Sorry for the inconvenience.
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
Dear Aleksandar,
Thanks for your reply.
What I am asking is not a custom development. Its just a line of code or two, which if your developer can share then I can paste in custom js code box of your plugin.
Only thing that needs to be done is when you click on ADD NEW RECORD or EDIT RECORD button and the modal opens, the focus should automatically go to that modal window.
Its just a 5 min work for someone who knows JS. Unfortunately, I am not that proficient in this. Thus I am requesting this.
Can you please check once with your team?
Sagar
Hi again Sagar
I have forwarded your request to one of our developers, and here's what he said:
You need to add a script like this:
jQuery(document).ready(function(e) {And it will automatically focus to the "Columnname" column in the edit modal. So the only thing you need to find here is the column's name, to insert instead of "#table_1_columnname":jQuery('#wdt-frontend-modal').on('shown.bs.modal', function() {
jQuery('#table_1_columnname').focus();
});
});
When you open the modal, and right click on a field go to inspect:
It will open the console, where you will see the name:
So, for the modal shown above, you'd need to use this JS:
jQuery(document).ready(function(e) {I hope that helps.jQuery('#wdt-frontend-modal').on('shown.bs.modal', function() {
jQuery('#table_1_dateofinteraction').focus();
});
});
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables