CODEWITHSUNDEEP
jquerykendo-ui
Amit
Amit

Reputation: 1491

Change icon class of Kendo Date Picker Jquery

I am trying to use kendo Jquery Date Picker.

I am referrring https://docs.telerik.com/kendo-ui/controls/editors/datepicker/overview.html for the same.

But instead of default k-i-calendar class I want to use k-i-calendar-date class. But I am not able to change.

Icons: https://docs.telerik.com/kendo-ui/styles-and-layout/icons-web

https://docs.telerik.com/kendo-ui/api/javascript/ui/button/configuration/iconclass in this example it talks about changing default icon class.

$("#button").kendoButton({
    iconClass: "fa fa-male"
});

I tried using the same for my date picker but it doesnot work.

kendo.jQuery("#ang_layout1_asof_sdate").kendoDatePicker({
          format: this.inqService.userPref_dateFormat,
          change: this.onChangedatePicker.bind(this),
          value : new Date(this.dateDropDowndefaultItem.DATE_1),
          iconClass: "k-icon k-i-calendar-date"
      });

Can anyone help me out. Thanks

Upvotes: 1

Views: 1373

Answers (2)

Amit
Amit

Reputation: 1491

$(".k-icon").removeClass("k-i-calendar");
$(".k-icon").addClass('k-i-calendar-date');

or

$(".k-icon").removeClass("k-i-calendar").addClass('k-i-calendar-date');

https://dojo.telerik.com/aViqocOT

Upvotes: 1

ezanker
ezanker

Reputation: 24738

The kendoDatePicker widget does not provide an "iconClass" property. You can change the icon after instantiating the widget by calling:

$("span.k-i-calendar").removeClass("k-i-calendar-calendar").addClass("k-i-calendar-date");

Upvotes: 1

Related Questions