[common] Fix aria-checked in ComboBox

This commit is contained in:
Julia.Svinareva
2024-06-04 18:51:10 +03:00
parent 744215d1a0
commit c007800867
2 changed files with 20 additions and 20 deletions

View File

@ -102,7 +102,7 @@ define([
'</button>',
'<ul id="<%= id %>-menu" class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
'<% _.each(items, function(item) { %>',
'<li id="<%= item.id %>" data-value="<%- item.value %>" role="menuitem" aria-checked="false"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
'<li id="<%= item.id %>" data-value="<%- item.value %>"><a tabindex="-1" type="menuitem" role="menuitemcheckbox" aria-checked="false"><%= scope.getDisplayValue(item) %></a></li>',
'<% }); %>',
'</ul>',
'</span>'
@ -564,10 +564,10 @@ define([
record = this._selectedItem.toJSON();
var $selectedItems = $('.selected', $(this.el));
$selectedItems.removeClass('selected');
$selectedItems.attr('aria-checked', false);
$selectedItems.find('a').attr('aria-checked', false);
var $newSelectedItem = $('#' + this._selectedItem.get('id'), $(this.el));
$newSelectedItem.addClass('selected');
$newSelectedItem.attr('aria-checked', true);
$newSelectedItem.find('a').attr('aria-checked', true);
}
// trigger changed event
@ -619,9 +619,9 @@ define([
var $selectedItems = $('.selected', $(this.el)),
$newSelectedItem = $('#' + this._selectedItem.get('id'), $(this.el));
$selectedItems.removeClass('selected');
$selectedItems.attr('aria-checked', false);
$selectedItems.find('a').attr('aria-checked', false);
$newSelectedItem.addClass('selected');
$newSelectedItem.attr('aria-checked', true);
$newSelectedItem.find('a').attr('aria-checked', true);
}
}
},
@ -665,13 +665,13 @@ define([
var $selectedItems = $('.selected', $(this.el));
$selectedItems.removeClass('selected');
$selectedItems.attr('aria-checked', false);
$selectedItems.find('a').attr('aria-checked', false);
if (this._selectedItem) {
this.setRawValue(this._selectedItem.get(this.displayField));
var $newSelectedItem = $('#' + this._selectedItem.get('id'), $(this.el));
$newSelectedItem.addClass('selected');
$newSelectedItem.attr('aria-checked', true);
$newSelectedItem.find('a').attr('aria-checked', true);
} else {
this.setRawValue((defValue!==undefined) ? defValue : value);
}
@ -711,17 +711,17 @@ define([
var $selectedItems = $('.selected', $(this.el));
$selectedItems.removeClass('selected');
$selectedItems.attr('aria-checked', false);
$selectedItems.find('a').attr('aria-checked', false);
this.setRawValue(this._selectedItem.get(this.displayField));
var $newSelectedItem = $('#' + this._selectedItem.get('id'), $(this.el));
$newSelectedItem.addClass('selected');
$newSelectedItem.attr('aria-checked', true);
$newSelectedItem.find('a').attr('aria-checked', true);
},
clearSelection: function (){
var $selectedItems = $('.selected', $(this.el));
$selectedItems.removeClass('selected');
$selectedItems.attr('aria-checked', false);
$selectedItems.find('a').attr('aria-checked', false);
this._selectedItem = null;
},
@ -739,9 +739,9 @@ define([
var $selectedItems = $('.selected', $(this.el));
$selectedItems.removeClass('selected');
$selectedItems.attr('aria-checked', false);
$selectedItems.find('a').attr('aria-checked', false);
el.addClass('selected');
el.attr('aria-checked', true);
el.find('a').attr('aria-checked', true);
// trigger changed event
this.trigger('selected', this, _.extend({}, this._selectedItem.toJSON()), e);
@ -770,7 +770,7 @@ define([
} else {
$(this.el).find('ul').html(_.template([
'<% _.each(items, function(item) { %>',
'<li id="<%= item.id %>" data-value="<%- item.value %>" role="menuitem" aria-checked="false"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
'<li id="<%= item.id %>" data-value="<%- item.value %>"><a tabindex="-1" type="menuitem" role="menuitemcheckbox" aria-checked="false"><%= scope.getDisplayValue(item) %></a></li>',
'<% }); %>'
].join(''))({
items: this.store.toJSON(),

View File

@ -314,8 +314,8 @@ define([
'<ul id="<%= id %>-menu" class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
'<li class="divider">',
'<% _.each(items, function(item) { %>',
'<li id="<%= item.id %>" role="menuitem">',
'<a class="font-item" tabindex="-1" type="menuitem" style="height:<%=scope.getListItemHeight()%>px;"></a>',
'<li id="<%= item.id %>">',
'<a class="font-item" tabindex="-1" type="menuitem" role="menuitemcheckbox" aria-checked="false" style="height:<%=scope.getListItemHeight()%>px;"></a>',
'</li>',
'<% }); %>',
'</ul>',
@ -599,7 +599,7 @@ define([
var $selectedItems = $('.selected', $(this.el));
$selectedItems.removeClass('selected');
$selectedItems.attr('aria-checked', false);
$selectedItems.find('a').attr('aria-checked', false);
if (record) {
this.setRawValue(record.get(this.displayField));
@ -608,7 +608,7 @@ define([
if (itemNode && menuNode) {
itemNode.addClass('selected');
itemNode.attr('aria-checked', true);
itemNode.find('a').attr('aria-checked', true);
if (this.recent<=0)
menuNode.scrollTop(itemNode.offset().top - menuNode.offset().top);
}
@ -635,7 +635,7 @@ define([
onInsertItem: function(item) {
$(this.el).find('ul').prepend(_.template([
'<li id="<%= item.id %>">',
'<a class="font-item" tabindex="-1" type="menuitem" style="height:<%=scope.getListItemHeight()%>px;"></a>',
'<a class="font-item" tabindex="-1" type="menuitem" role="menuitemcheckbox" aria-checked="false" style="height:<%=scope.getListItemHeight()%>px;"></a>',
'</li>'
].join(''))({
item: item.attributes,
@ -734,7 +734,7 @@ define([
var $selectedItems = $('.selected', $(this.el));
$selectedItems.removeClass('selected');
$selectedItems.attr('aria-checked', false);
$selectedItems.find('a').attr('aria-checked', false);
if (this._selectedItem) {
var itemNode = $('#' + this._selectedItem.get('id'), $(this.el)),
@ -742,7 +742,7 @@ define([
if (itemNode.length > 0 && menuEl.length > 0) {
itemNode.addClass('selected');
itemNode.attr('aria-checked', true);
itemNode.find('a').attr('aria-checked', true);
var itemTop = itemNode.position().top,
menuTop = menuEl.scrollTop();