Telerik Rad Scheduler problem

[Maurizio]

​I am using Telerik Rad Scheduler in ​my application,
I have set RenderMode to "Auto" as need to make page adaptive in mobile devices
but is not working.

Also ​i have added reference to Telerik.Web.Device.Detection.dll and added it as namespace in code file (using Telerik.Web.Device.Detection;  )
and ​added this meta tag in master page
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">

so if ​i​ am missing any property or configuration to make radscheduler adaptive in mobile?

[Dimitar]

Hi Maurizio,

As far as I could say based on the settings described, the RadScheduler should become adaptive on mobile devices. Could you specify the OS version of the device, its model, the browser used and its version? Note that it would become adaptive only if opened on a mobile device - opening on a small desktop browser window would not trigger adaptiveness, as the device detection checks for mobile user agent strings when a request is done.

In addition, it would be helpful if you provide a page with codebehind and web.config to double-check them. You could upload them to dropbox for example and share their URL.

Regards,
Dimitar
Telerik

[Maurizio]

Snippet from aspx
 <telerik:RadScriptManager ID="RadScriptManager1" runat="server" >
 </telerik:RadScriptManager>
 <telerik:RadAjaxManager ID="AjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadScheduler1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="lnk_apply">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>
                    <telerik:AjaxUpdatedControl ControlID="lvResources" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>                    
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="lnk_apply_dummy">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>
                    <telerik:AjaxUpdatedControl ControlID="lvResources" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>                    
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
 </telerik:RadAjaxManager>
 <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" InitialDelayTime="200" RenderMode="Auto">
 </telerik:RadAjaxLoadingPanel>
 
 <asp:Panel ID="pnlSchedular" runat="server">
 <telerik:RadScheduler runat="server" ID="RadScheduler1" DayStartTime="00:00:00" DayEndTime="23:00:00"
    DataKeyField="DataKeyMember" DataSubjectField="SubjectMember" DataDescriptionField="DescriptionMember" DataStartField="StartDateTimeUtcMember" DataEndField="EnddDateTimeUtcMemebr"
    AllowDelete="false" AllowEdit="false" AllowInsert="false" EnableDatePicker="false" OverflowBehavior="Expand"
    HoursPanelTimeFormat="H:mm" TimeLabelRowSpan="2" RenderMode="Auto" ShowAllDayRow="true" EnableExactTimeRendering="true" RowHeight="50px"
    CustomAttributeNames ="LocationMember"
    OnAppointmentCreated="RadScheduler1_AppointmentCreated"
    OnAppointmentCommand="RadScheduler1_AppointmentCommand" OnAppointmentDataBound="RadScheduler1_AppointmentDataBound"
    OnClientAppointmentClick="appointmentClick">
    <AdvancedForm Modal="false"></AdvancedForm>
    <ResourceTypes>
    </ResourceTypes>
    <AppointmentTemplate>
        <div id="divAppointment" runat="server">
            <img src="/admin/images/ws-<%# Eval("LocationMember") %>.png" alt="<%# Eval("LocationMember") %>" style="float: left; height: 15px;  margin-right: 5px;"/>
            <%# Eval("Subject") %>
        </div>
    </AppointmentTemplate>
    <TimelineView UserSelectable="false"></TimelineView>
</telerik:RadScheduler>
</asp:Panel>

Snippet from code file
  protected void Page_Load(object sender, EventArgs e)
        {
            DC_ECO = maga_DataContext.DC_ECO;
            
            if (!IsPostBack)
            {
                Bind_chkList_resource();                  
                HF_dtActive.Value = DateTime.Now.Date.JSCal_dateToString();                            
                HF_dtActiveEnd.Value = DateTime.Now.Date.AddDays(30).JSCal_dateToString();
                BindLVResources();
                //RadScheduler1.SelectedView = SchedulerViewType.MultiDayView;
                RadScheduler1.MultiDayView.UserSelectable = true;                
                RadScheduler1.MultiDayView.NumberOfDays = 7;
                wsFill();
            }

            else
            {
                if (Request["__EVENTARGUMENT"] == "applyFilters")
                {
                    applyFilters();
                }
            }
            ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "setCal", "setCal();", true);
        }
        
        Below is method to Bind Scheduler
        public void wsFill()
        {
            RadScheduler1.MinutesPerRow = drp_TimeSlotInterval.getSelectedValueInt();
            int flt_numRes = txt_NumOfReservation.Text.objToInt32();
            string flt_name = txt_name.Text;
            bool isNotDateSearch = false;
            List<ECO_VIEW_EVENT_SCHEDULER> lstSchedule = DC_ECO.ECO_VIEW_EVENT_SCHEDULER.ToList();
            if (string.IsNullOrEmpty(flt_name) && flt_numRes == 0)
            {
                List<int> _ids = chkList_resource.getSelectedValueList().Select(x => x.ToInt32()).Where(x => x != 0).ToList();
                if (_ids != null && _ids.Count > 0)
                    lstSchedule = lstSchedule.Where(x => !x.pid_client_hr.HasValue || x.pid_client_hr.Value == -1 || _ids.Contains(x.pid_client_hr.Value)).ToList();

                if (string.IsNullOrWhiteSpace(HF_dtActive.Value) || HF_dtActive.Value == "0")
                {
                    HF_dtActive.Value = DateTime.Now.Date.JSCal_dateToString();
                }
                if (string.IsNullOrWhiteSpace(HF_dtActiveEnd.Value) || HF_dtActiveEnd.Value == "0" || HF_dtActiveEnd.Value.JSCal_stringToDate() < HF_dtActive.Value.JSCal_stringToDate())
                    HF_dtActiveEnd.Value = DateTime.Now.Date.AddDays(30).JSCal_dateToString();

                DateTime _dtStart = HF_dtActive.Value.JSCal_stringToDate();
                DateTime _dtEnd = HF_dtActiveEnd.Value.JSCal_stringToDate();

                lstSchedule = lstSchedule.Where(x => x.dtStart_event.HasValue && x.dtEnd_event.HasValue && ((x.dtStart_event.Value.Date >= _dtStart.Date && x.dtStart_event.Value.Date <= _dtEnd.Date) || (x.dtEnd_event.Value.Date >= _dtStart.Date && x.dtEnd_event.Value <= _dtEnd.Date))).ToList();           
            }
            else
            {
                isNotDateSearch = true;
                if (flt_numRes > 0)
                    lstSchedule = lstSchedule.Where(x => x.ref_pid_event == flt_numRes).ToList();
                if (!string.IsNullOrEmpty(flt_name))
                    lstSchedule = lstSchedule.Where(x => x.rent_client_name != null && x.rent_client_name.ToLower().Contains(flt_name.ToLower())).ToList();

                List<int> _ids = chkList_resource.getSelectedValueList().Select(x => x.ToInt32()).Where(x => x != 0).ToList();
                if (_ids != null && _ids.Count > 0)
                    lstSchedule = lstSchedule.Where(x => !x.pid_client_hr.HasValue || x.pid_client_hr.Value == -1 || _ids.Contains(x.pid_client_hr.Value)).ToList();
            }

                        
            if (lstSchedule.Count > 0)
            {              
                if (isNotDateSearch)
                {
                    DateTime _dtStartOfReservation = lstSchedule.OrderBy(x=>x.dtStart_event).FirstOrDefault().dtStart_event.Value;
                    HF_dtActive.Value = _dtStartOfReservation.JSCal_dateToString();
                    HF_dtActiveEnd.Value = _dtStartOfReservation.AddDays(30).JSCal_dateToString();
                }
                RadScheduler1.SelectedDate = HF_dtActive.Value.JSCal_stringToDate();
                RadScheduler1.DataSource = getActivityList(lstSchedule);
                RadScheduler1.DataBind();
                //RadScheduler1.SelectedDate = _dtStart;
                int daysGap= (HF_dtActiveEnd.Value.JSCal_stringToDate() -         HF_dtActive.Value.JSCal_stringToDate()).TotalDays.objToInt32();
                RadScheduler1.MultiDayView.NumberOfDays = daysGap;
                pnlSchedular.Visible = true;
            }
            else
                pnlSchedular.Visible = false;
        }

[Dimitar]

Hi Maurizio,

I have attached a sample project which shows a RadScheduler with render mode Auto. The project works on my side as expected - desktop screenshot, mobile screenshot. You may use this sample to check the settings applied on your side.

Could you specify the OS version of the device, its model, the browser used and its version? Note that it would become adaptive only if opened on a mobile device - opening on a small desktop browser window would not trigger adaptiveness, as the device detection checks for mobile user agent strings when a request is done.

Regards,
Dimitar
Telerik