Pratik
Top achievements
Rank 1
Rank 1
I have just seen the demo about using kendo DatePicker. But when inspect the calendar icon under Accessibility menu I can see the Default name for the button is given as "select". I would like to change the name of button from "select" to "Pick a date". Please Guide through. I have attached image for your reference.
Following is the code snippet:
<!DOCTYPE html><html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/themes/6.2.0/default/default-ocean-blue.css"/>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2023.1.314/js/kendo.all.min.js"></script>
</head>
<body>
<input id="datePicker" />
<script>
$("#datePicker").kendoDatePicker({
value: new Date(2022, 0, 3),
min: new Date(2022, 0, 1),
max: new Date(2022, 5, 30),
weekNumber: true,
format: "yyyy-MM-dd"
});
</script>
</body>
</html>
Hi Pratik,
Currently, the rendering of the button is as follows:
<button aria-label="select" tabindex="-1" class="k-input-button k-button k-icon-button k-button-md k-button-solid k-button-solid-base" type="button" role="button"><span class="k-icon k-i-calendar k-button-icon"></span></button>It has aria-label, but it does not have name set. Please let me know if I am missing something.
However, if you need to set name to the element you can use the jQuery attr() method as demonstrated below:
$("#datePicker").parent('.k-datepicker').find('.k-button').attr('name', 'custom')Here is a small dojo example.
I hope this helps.
Regards,
Neli