MDL-78885 comboboxsearch: Some small fixes
- Remove aria-busy - Remove aria-label from the listbox element. A listbox that is part of a combobox does not need to be labelled. - No need for the aria-label for the select all checkbox because it is already enclosed in the <label> tag. - Having "view results for ..." as aria-label of listbox options is not helpful and only creates noise. - Deprecated (viewresults,core) as it was not used anymore - aria-hidden="true" should not be used on .d-none elements - 'noresults' was falsely documented as a required context variable for resultset.mustache. Not only it was not required, it was not even provided! - Remove duplicate code from user_selector.mustache - Remove the redundant aria-label from search_input_auto. It already has a label. - Fix placeholder missing from one case
This commit is contained in:
@@ -50,13 +50,13 @@
|
||||
<input type="hidden" name="search" id="collapse-input-{{uniqid}}"/>
|
||||
|
||||
<form class="columnsdropdownform flex-column h-100">
|
||||
<ul id="collapse-listbox" class="searchresultitemscontainer overflow-auto py-2 px-1 list-group mx-0 text-truncate" role="listbox" data-region="search-result-items-container" aria-label="{{#cleanstr}} aria:dropdowncolumns, gradereport_grader {{/cleanstr}}" aria-busy="true">
|
||||
<ul id="collapse-listbox" class="searchresultitemscontainer overflow-auto py-2 px-1 list-group mx-0 text-truncate" role="listbox" data-region="search-result-items-container" aria-label="{{#cleanstr}} aria:dropdowncolumns, gradereport_grader {{/cleanstr}}">
|
||||
{{>gradereport_grader/collapse/collapseresults}}
|
||||
</ul>
|
||||
<div class="d-flex mt-2">
|
||||
<div class="d-flex align-items-center form-check">
|
||||
<label id="check-all" for="check-all-input" class="selected-option-info text-truncate form-check-label d-block">
|
||||
<input disabled id="check-all-input" class="form-check-input" type="checkbox" data-action="selectall" aria-label="{{#str}}selectall, core{{/str}}">
|
||||
<label id="check-all" class="selected-option-info text-truncate form-check-label d-block">
|
||||
<input disabled class="form-check-input" type="checkbox" data-action="selectall">
|
||||
{{#str}}selectall, core{{/str}}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@@ -48,5 +48,5 @@
|
||||
</div>
|
||||
{{/selectedoption}}
|
||||
</div>
|
||||
<span class="d-none" data-region="courseid" data-courseid="{{courseid}}" aria-hidden="true"></span>
|
||||
<span class="d-none" data-region="itemid" data-itemid="{{itemid}}" aria-hidden="true"></span>
|
||||
<span class="d-none" data-region="courseid" data-courseid="{{courseid}}"></span>
|
||||
<span class="d-none" data-region="itemid" data-itemid="{{itemid}}"></span>
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
"selectedgroup": "Group 1"
|
||||
}
|
||||
}}
|
||||
<span class="d-none" data-region="groupid" data-groupid="{{group}}" aria-hidden="true"></span>
|
||||
<span class="d-none" data-region="groupid" data-groupid="{{group}}"></span>
|
||||
<div class="align-items-center d-flex">
|
||||
<div class="d-block pr-3 text-truncate">
|
||||
<span class="d-block small" aria-hidden="true">
|
||||
|
||||
@@ -144,3 +144,4 @@ to,core
|
||||
from,core
|
||||
aria-toggledropdown,core_grades
|
||||
aria:dropdowngrades,core_grades
|
||||
viewresults,core
|
||||
|
||||
+1
-3
@@ -159,8 +159,6 @@ $string['applyfilters'] = 'Apply filters';
|
||||
$string['areyousure'] = 'Are you sure?';
|
||||
$string['areyousuretorestorethis'] = 'Do you want to continue?';
|
||||
$string['areyousuretorestorethisinfo'] = 'Later in this process you will have a choice of adding this backup to an existing course or creating a completely new course.';
|
||||
$string['aria-toggledropdown'] = 'Toggle the following dropdown';
|
||||
$string['aria-comboboxsearchitems'] = 'Select an option';
|
||||
$string['asc'] = 'Ascending';
|
||||
$string['assessment'] = 'Assessment';
|
||||
$string['assignadmins'] = 'Assign admins';
|
||||
@@ -2385,7 +2383,6 @@ $string['viewallresults'] = 'View all results ({$a})';
|
||||
$string['viewmore'] = 'View more';
|
||||
$string['viewallsubcategories'] = 'View all subcategories';
|
||||
$string['viewfileinpopup'] = 'View file in a popup window';
|
||||
$string['viewresults'] = 'View results for {$a}';
|
||||
$string['viewprofile'] = 'View profile';
|
||||
$string['views'] = 'Views';
|
||||
$string['viewsolution'] = 'view solution';
|
||||
@@ -2510,3 +2507,4 @@ $string['updatingain'] = 'Updating {$a->what} in {$a->in}';
|
||||
$string['summaryof'] = 'Summary of {$a}';
|
||||
$string['from'] = 'From';
|
||||
$string['to'] = 'To';
|
||||
$string['viewresults'] = 'View results for {$a}';
|
||||
|
||||
@@ -21,13 +21,24 @@
|
||||
* name - Result item human readable name.
|
||||
* link - The link used to redirect upon self to show only this specific result item.
|
||||
|
||||
The shorttext pragma can be used to provide a short text for the result item.
|
||||
This is especially useful when the result item content contains html tags.
|
||||
|
||||
Example context (json):
|
||||
{
|
||||
"id": 2,
|
||||
"name": "Foo bar"
|
||||
}
|
||||
}}
|
||||
<li id="result-{{id}}" class="w-100 dropdown-item d-flex px-0 align-items-center" role="option" data-short-text="{{$shorttext}}{{/shorttext}}" data-value="{{id}}" aria-label="{{$arialabel}}{{#str}}viewresults, core, {{name}}{{/str}}{{/arialabel}}">
|
||||
<li
|
||||
id="result-{{id}}"
|
||||
class="w-100 dropdown-item d-flex px-0 align-items-center"
|
||||
role="option"
|
||||
{{! aria.js would use the data-short-text attribute if it is provided. }}
|
||||
data-short-text="{{$shorttext}}{{/shorttext}}"
|
||||
data-value="{{id}}"
|
||||
aria-label="{{$arialabel}}{{name}}{{/arialabel}}"
|
||||
>
|
||||
{{$content}}
|
||||
<span class="d-block w-100 px-2 text-truncate">
|
||||
{{name}}
|
||||
|
||||
@@ -20,7 +20,6 @@
|
||||
* results - Our returned results to render.
|
||||
* searchterm - The entered text to find these results.
|
||||
* hasresult - Allow the handling where no results exist for the returned search term.
|
||||
* noresults - Our fall through case if nothing matches.
|
||||
|
||||
Example context (json):
|
||||
{
|
||||
@@ -39,7 +38,12 @@
|
||||
}
|
||||
}}
|
||||
<div class="d-flex flex-column mh-100 h-100">
|
||||
<ul id="{{$listid}}list{{/listid}}-result-listbox" class="searchresultitemscontainer d-flex flex-column mw-100 position-relative py-2 list-group h-100 mx-0 {{$listclasses}}{{/listclasses}}" role="listbox" data-region="search-result-items-container" aria-label="{{#cleanstr}} aria-comboboxsearchitems, core {{/cleanstr}}">
|
||||
<ul
|
||||
id="{{$listid}}list{{/listid}}-result-listbox"
|
||||
class="searchresultitemscontainer d-flex flex-column mw-100 position-relative py-2 list-group h-100 mx-0 {{$listclasses}}{{/listclasses}}"
|
||||
role="listbox"
|
||||
data-region="search-result-items-container"
|
||||
>
|
||||
{{#hasresults}}
|
||||
{{$results}}
|
||||
{{#results}}
|
||||
|
||||
@@ -33,7 +33,7 @@
|
||||
}
|
||||
}}
|
||||
{{<core/local/comboboxsearch/resultitem }}
|
||||
{{$arialabel}}{{#str}}viewresults, core, {{fullname}}{{/str}}{{/arialabel}}
|
||||
{{$arialabel}}{{fullname}}{{/arialabel}}
|
||||
{{$shorttext}}{{fullname}}{{/shorttext}}
|
||||
{{$content}}
|
||||
<span class="d-block px-2 w-25">
|
||||
|
||||
@@ -37,39 +37,24 @@
|
||||
"resetlink": "grade/report/grader/index.php?id=2"
|
||||
}
|
||||
}}
|
||||
<span class="d-none" data-region="courseid" data-courseid="{{courseid}}" aria-hidden="true"></span>
|
||||
<span class="d-none" data-region="groupid" data-groupid="{{group}}" aria-hidden="true"></span>
|
||||
<span class="d-none" data-region="courseid" data-courseid="{{courseid}}"></span>
|
||||
<span class="d-none" data-region="groupid" data-groupid="{{group}}"></span>
|
||||
{{< core/search_input_auto }}
|
||||
{{$label}}{{#str}}searchusers, core{{/str}}{{/label}}
|
||||
{{$placeholder}}{{#str}}searchusers, core{{/str}}{{/placeholder}}
|
||||
{{$value}}{{currentvalue}}{{/value}}
|
||||
{{$additionalattributes}}
|
||||
role="combobox"
|
||||
aria-expanded="false"
|
||||
aria-controls="user-result-listbox"
|
||||
aria-autocomplete="list"
|
||||
aria-haspopup="listbox"
|
||||
data-input-element="user-input-{{uniqid}}"
|
||||
{{/additionalattributes}}
|
||||
{{/ core/search_input_auto }}
|
||||
{{#currentvalue}}
|
||||
{{< core/search_input_auto }}
|
||||
{{$label}}{{#str}}searchusers, core{{/str}}{{/label}}
|
||||
{{$value}}{{currentvalue}}{{/value}}
|
||||
{{$additionalattributes}}
|
||||
role="combobox"
|
||||
aria-expanded="false"
|
||||
aria-controls="user-result-listbox"
|
||||
aria-autocomplete="list"
|
||||
aria-haspopup="listbox"
|
||||
aria-label="{{#cleanstr}} aria-toggledropdown, core {{/cleanstr}}"
|
||||
data-input-element="user-input-{{uniqid}}"
|
||||
{{/additionalattributes}}
|
||||
{{/ core/search_input_auto }}
|
||||
<a class="ml-2 btn btn-link border-0 align-self-center" href="{{resetlink}}" data-action="resetpage" role="link" aria-label="{{#str}}clearsearch, core{{/str}}">
|
||||
{{#str}}clear{{/str}}
|
||||
</a>
|
||||
{{/currentvalue}}
|
||||
{{^currentvalue}}
|
||||
{{< core/search_input_auto }}
|
||||
{{$label}}{{#str}}searchusers, core{{/str}}{{/label}}
|
||||
{{$placeholder}}{{#str}}searchusers, core{{/str}}{{/placeholder}}
|
||||
{{$additionalattributes}}
|
||||
role="combobox"
|
||||
aria-expanded="false"
|
||||
aria-controls="user-result-listbox"
|
||||
aria-autocomplete="list"
|
||||
aria-haspopup="listbox"
|
||||
aria-label="{{#cleanstr}} aria-toggledropdown, core {{/cleanstr}}"
|
||||
data-input-element="user-input-{{uniqid}}"
|
||||
{{/additionalattributes}}
|
||||
{{/ core/search_input_auto }}
|
||||
{{/currentvalue}}
|
||||
<input type="hidden" name="{{name}}" value="{{value}}" id="user-input-{{uniqid}}"/>
|
||||
|
||||
Reference in New Issue
Block a user