Results 1 to 2 of 2

Thread: [CLASSIC] Grid Paging Toolbar ARIA compatibility

  1. #1

    Default [CLASSIC] Grid Paging Toolbar ARIA compatibility

    So... another chapter for fixing 1001 ARIA errors in Ext (That could have been easily avoided).

    Paging toolbar 'Ext.toolbar.Paging' does not offer almost any ARIA compliance, violating some rules.

    1) Buttons do not have ARIA labels (and they do not have any text!)
    I have added an override to getPagingItems and added the same text as the one used for tooltips:
    Code:
    {            itemId: 'first',
                tooltip: me.firstText,
    
               //ADD ARIA LABEL
                ariaLabel: me.firstText,
                overflowText: me.firstText,
                iconCls: Ext.baseCSSPrefix + 'tbar-page-first',
                disabled: true,
                handler: me.moveFirst,
                scope: me
            }
    2) numberfield used, does not have a required attribute: aria-valuemax
    It only has these two:
    aria-valuemin="1"
    aria-valuenow="1"

    I have added an override for updateInfo method, and added this property
    Code:
        /**
         * @private
         */
        updateInfo: function() {
            var me = this,
                displayItem = me.child('#displayItem'),
                inputItem = me.child('#inputItem'),
                store = me.store,
                pageData = me.getPageData(),
                count, msg;
     
            if (displayItem) {
                count = store.getCount();
                
                if (count === 0) {
                    msg = me.emptyMsg;
                }
                else {
                    msg = Ext.String.format(
                        me.displayMsg,
                        pageData.fromRecord,
                        pageData.toRecord,
                        pageData.total
                    );
                }
                
                displayItem.setText(msg);
                inputItem.setMaxValue(pageData.pageCount === 0 ? 1 : pageData.pageCount);
            }
        },
    I guess alternatively this could be used:
    Code:
          inputItem.clearInvalid();
            inputItem.setMaxValue(pageData.pageCount);
    or to avoid this violations at all, change this part in onLoad method
    Code:
            item = me.getInputItem();
    
    
            if (item) {
                item.clearInvalid();
                item.setMaxValue(pageCount);
                item.setDisabled(isEmpty).setValue(currPage);
            }

    @Sencha please fix this

  2. #2
    Ext Support Team
    Join Date
    Jan 2018
    Posts
    542

    Default

    Hello Maciej,

    We have registered this in our bug tracker under reference number EXTJS-28588, please be assured that this will be taken care of.

    Regards,
    Kumar
    Sencha Support.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •