igGrid filtering buttons aria role
by georgianastasov
HTML
<script src="https://igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<script src="https://igniteui.com/js-data/employee-data-allDatatypes"></script>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>
<table id="grid"></table>
JavaScript
$(function () {
var f = true, ds, schema;
schema = new $.ig.DataSchema("array", {
fields: [
{ name: "FirstName", type: "string" },
{ name: "LastName", type: "string" },
{
name: "RegistererDate", type: "date", formatter: function (value, record) {
return value.toLocaleDateString();
}
},
{ name: "Country", type: "string" },
{ name: "Age", type: "number" },
{ name: "IsActive", type: "bool" },
{ name: "RegistererTime" }
],
});
ds = new $.ig.DataSource({
dataSource: employees,
schema: schema,
filtering: {
type: "local"
}
}).dataBind();
$("#grid").igGrid({
autoGenerateColumns: false,
height: "500px",
width: "100%",
columns: [
{ headerText: "First Name", key: "FirstName", dataType: "string" },
{ headerText: "Last Name", key: "LastName", dataType: "string" },
{ headerText: "Register Date", key: "RegistererDate", dataType: "date" },
{ headerText: "Country", key: "Country", dataType: "string" },
{ headerText: "Age", key: "Age", dataType: "number" },
{ headerText: "Is Active", key: "IsActive", dataType: "bool" },
],
dataSource: ds.dataView(),
responseDataKey: "results",
features: [
{
name: "Filtering",
type: "local",
mode: "simple",
filterDialogContainment: "window",
},
{
name: "Paging",
type: "local",
pageSize: 10
}
]
});
//set each filtering button aria role to 'button'
$("#grid_dd_FirstName_button").attr("aria-role", "button");
$("#grid_dd_LastName_button").attr("aria-role", "button");
...