Getting CSS class from OnClientTimeSlotClick event

[Roman]

Hi,

I need to get class name for timeslot. I set some of the slots unavailable and I need to check if user clicked on unavailable slot.

Thanks,
Roman

[Simon]

Hi Roman,

You can manually find the td element representing the clicked Time Slot and check its class name. You can use the timeSlot.get_rawIndex().dayIndex to get the day index of the time slot in the currently displayed View.

The code below shows how this can be done in case the CSS class for the unavailable Time Slots is called "unavailable":

        function clientTimeSlotClick(sender, eventArgs)
        {
            if (sender.get_selectedView() == 2)
            {
                var schedulerDiv = $get(sender.get_id());

                var contentTable = schedulerDiv.childNodes[4].childNodes[1];

                var dayIndex = eventArgs.get_targetSlot().get_rawIndex().dayIndex;
                var tds = contentTable.getElementsByClassName("rsCell");

                for (var tdIndex = 0, tdCount = tds.length; tdIndex < tdCount; tdIndex++)
                {
                    if (tdIndex == dayIndex)
                    {
                        var td = tds[tdIndex];

                        if (td.className.indexOf("unavailable") > -1)
                        {
                            alert("unavailable");
                        }
                    }
                }
            }
        }

Note that this approach will work only in Month View. Since the rendering of the Views are different from one another you need to examine each one and implement the logic for finding the Time Slot manually. For example, in Week View, the Time Slot client-side object's rawIndex contains the cellIndex and the rowIndex of the cell representing the Time Slot. You need to find the cell by these two indexes.

Kind regards,
Simon
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Roman]

Thank you for great hint.
Roman