This is a migrated thread and some comments may be shown as answers.

Space out weekday checkboxes in weekly repeat recurrence editor

2 Answers 25 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Erik
Top achievements
Rank 1
Erik asked on 06 Apr 2017, 01:58 PM

I have gotten several user complaints that it is hard to differentiate the weekday checkboxes.

Is there a way to space them out a bit?

 

I have tried (without success) to handle the edit event of the scheduler and bind to the change event of the recurrenceeditor dropdown to set the margin style.

function onEdit(e) {
   var recurDropdown = e.container.find("[data-role=recurrenceeditor]");
 
   // handle recurrence editor's change event
   recurDropdown.unbind("change", spaceWeekDayChks);
   recurDropdown.bind("change", spaceWeekDayChks);
}
 
 
function spaceWeekDayChks() {
   // space out recurrence editor week days
   // - called from change event of recurrence editor dropdown
   $('.k-recur-weekday-checkbox').css("margin-right", "20px");
}

 

2 Answers, 1 is accepted

Sort by
0
Accepted
Veselin Tsvetanov
Telerik team
answered on 10 Apr 2017, 08:56 AM
Hi Erik,

To set custom spacing between the Weekday checkboxes, I would suggest you to apply the following CSS rule:
.k-check .k-recur-weekday-checkbox {
  margin-left: 20px;
}

Here you will find a Dojo sample, based on the above.

Regards,
Veselin Tsvetanov
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Erik
Top achievements
Rank 1
answered on 10 Apr 2017, 02:54 PM
Thanks your solution to apply CSS rule worked perfectly.  I was definitely over-complicating it :)
Tags
Scheduler
Asked by
Erik
Top achievements
Rank 1
Answers by
Veselin Tsvetanov
Telerik team
Erik
Top achievements
Rank 1
Share this question
or