Hi Telerik

RadScheduler Appointment on SelectedView="MonthView" showing as tiny square, in the day, in IOS touch tablet. It takes up the whole dayColumn on desktop.

Also the context menu from this appointment after appearing does not work when clicked on in the IOS touch tablet.

Regards

Darren

Hi

I have followed the guide to create a simple project with RadScheduler with vs 2010.

In the project, the RadScheduler retrieves the record from sql database.

However, after I start the website,

1. no appointment option is shown up after double-click any cells.

2. no event is shown in the scheduler. (the record is exist in sql database and tested ok for the connection)

What do I miss?

Below is my code:

Здравейте! Hi!

I am experiencing unusual behavior with a RadTreeList that's residing inside a user control (.ascx).

Note: The user control is programmatically/dynamically added on Page_Load from the parent page.

The RadTreeList definition inside the user control is as follows:

    <telerik:RadTreeList ID="RadTreeList1" runat="server"

        ParentDataKeyNames="ParentId" DataKeyNames="DataId" AllowPaging="false"
        AutoGenerateColumns="false" AllowSorting="false" ExpandCollapseMode="Client" AllowMultiItemSelection="true">

        <Columns>
            <telerik:TreeListBoundColumn DataField="FullName" UniqueName="FullName" HeaderText="FullName">
            </telerik:TreeListBoundColumn>
        </Columns>
    </telerik:RadTreeList>

In the code behind of the user control, I do this inside Page_Load():

           RadTreeList1.DataSource = lst; // lst is of type List<object> and is populated with valid data

           RadTreeList1.ExpandAllItems();

When the page containing this user control loads, one can see that the RadTreeList is rendered initially in a fully expanded state, but about half a second or less later, all the expanded nodes are auto-collapsed by the client-side.

The stack trace (snapped in the "middle" of toggling an expanded node back to a collapsed state) from Dev Tools in Chrome is:

toggleExpandCollapse (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager2_TSM&compress=1&_TSM_CombinedScri…:22075)
initialize (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager2_TSM&compress=1&_TSM_CombinedScri…:21971)
endUpdate (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager2_TSM&compress=1&_TSM_CombinedScri…:2664)
endCreateComponents (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager2_TSM&compress=1&_TSM_CombinedScri…:3406)
_raiseInit (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager2_TSM&compress=1&_TSM_CombinedScri…:3548)
initialize (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager2_TSM&compress=1&_TSM_CombinedScri…:3424)
b (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager2_TSM&compress=1&_TSM_CombinedScri…:3504)
a (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager2_TSM&compress=1&_TSM_CombinedScri…:3515)

If I change the ExpandCollapseMode of the RadTreeList to "Server" (from "Client"), the RadTreeList is rendered in expanded state, and the client side does not auto-collapse it (expected behavior).

The problem with "Server" expansion mode is that it causes a full page postback on every node expand/collapse icon click, which is highly undesirable in our situation.

Please advise on how to avoid the auto-collapse of a fully expanded RadTreeList while in "Client" ExpandCollapseMode.

Thank you!

Additional Info: Telerik.Web.UI version is 2016.2.607.45

I'm working in Chrome mobile.  I'm having an issue where the grid does not scroll horizontally when the swiping is initiated over content that is a hyperlink.  I attached event handlers to touchstart and touchend, and I can see that touchstart is called, and while touchmove is happening the grid does not scroll.  If I enlarge the page to more than the window size it will actually scroll the page (but not the grid).

Scrolling in the grid works if pointer events are disabled on the hyperlink using CSS, but the click event doesn't work if this is done so it isn't a workable solution (pointer-events:none).

You have to click on the link just right to reproduce.  I'm logging the events to the page for the first Test link in the grid to make this clear.  Sometimes you think you are clicking on it, but it doesn't actually raise the touchstart event, and in that case scrolling works.  However, when it does raise the touchstart event scrolling does not.  This makes scrolling in the grid really inconsistent for users.

Code

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="REN_AppTest_Grid.aspx.cs" Inherits="Efficio.Web.TestPages.REN_AppTest_Grid" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <style type="text/css">
        a
        {
            /*pointer-events:none;*/
            /*touch-action: none;*/
        }

        a:visited, a:link
        {
            color: #007AFF;   
            font-weight: bold;
        }

        a:active
        {
            color: red;   
            font-weight: bold;
        }

        a:hover
        {
            color: yellow;   
            font-weight: bold;
        }

    </style>
</head>
<body>
    <form id="form1" runat="server">
    <a href="REN_AppTest_Grid.aspx" style="font-size: 2em; margin-left: 100px;">Refresh</a>
    <br/><br/>
    <a id="EventTest" href="#" style="font-size: 2em; margin-left: 100px;">Event Test</a>
    <br/><br/>
    <telerik:RadScriptManager ID="smScriptManager" EnablePageMethods="true" runat="server">
        <CacheSettings Enabled="false" />
        <Scripts>
            <asp:ScriptReference Path="~/lib/jquery/dist/jquery.min.js" />
            <asp:ScriptReference Path="~/lib/jquery-migrate/jquery-migrate.min.js" />
            <asp:ScriptReference Path="~/lib/jquery-browser/dist/jquery.browser.min.js" />            
        </Scripts>
    </telerik:RadScriptManager>
    Date: <%= DateTime.Now %>
    <br /><br />
    <asp:Panel ID="pnlGridScrolling" BorderWidth="1" Width="100%" BorderColor="Red" BorderStyle="Solid" runat="server">
        <Efficio:EfficioGridView ID="grdOne" Width="700" RenderMode="Mobile" runat="server">
            <ClientSettings>
                <Scrolling AllowScroll="True" />
            </ClientSettings>            
            <MasterTableView Font-Size="2em">
                <Columns>                        
                    <Efficio:EfficioGridTemplateColumn HeaderText="C1">
                        <ItemTemplate>
                            <asp:HyperLink NavigateUrl="javascript: alert('clicked');" Text='<%# DataBinder.Eval(Container.DataItem, "Column2").ToString() %>' runat="server" />
                        </ItemTemplate>
                    </Efficio:EfficioGridTemplateColumn>
                    <Efficio:EfficioBoundColumn DataField="Column2" HeaderText="C2" />
                    <Efficio:EfficioBoundColumn DataField="Column3" HeaderText="C3" />
                    <Efficio:EfficioBoundColumn DataField="Column4" HeaderText="C4" />
                    <Efficio:EfficioGridTemplateColumn HeaderText="C5">
                        <ItemTemplate>
                            <%--<a href="#" style="touch-action: pan-x;">Test</a>--%>
                            <asp:HyperLink ID="lnkTest" NavigateUrl="NotHere.aspx" Text="Test" runat="server" />
                        </ItemTemplate>
                    </Efficio:EfficioGridTemplateColumn>                    
                    <Efficio:EfficioBoundColumn DataField="Column6" HeaderText="C6" />
                    <Efficio:EfficioBoundColumn DataField="Column7" HeaderText="C7" />
                    <Efficio:EfficioBoundColumn DataField="Column8" HeaderText="C8" />
                    <Efficio:EfficioBoundColumn DataField="Column9" HeaderText="C9" />
                    <Efficio:EfficioBoundColumn DataField="Column10" HeaderText="C10" />
                </Columns>
            </MasterTableView>
        </Efficio:EfficioGridView>    
        <br/>
        Status
        <div id="statusPanel">
                        
        </div>    
    </asp:Panel>                            
    </form>
    
<script type="text/javascript">
    window.onerror = function(msg, url, line, col, error) {
        // Note that col & error are new to the HTML 5 spec and may not be 
        // supported in every browser.  It worked for me in Chrome.
        var extra = !col ? '' : '\ncolumn: ' + col;
        extra += !error ? '' : '\nerror: ' + error;

        // You can view the information in an alert to see things working like this:
        alert("Error: " + msg + "\nurl: " + url + "\nline: " + line + extra);

        // TODO: Report this error via ajax so you can keep track
        //       of what pages have JS issues

        var suppressErrorAlert = true;
        // If you return true, then error alerts (like in older versions of 
        // Internet Explorer) will be suppressed.
        return suppressErrorAlert;
    };
   
    function touchstart(e)
    {        
        var status = $('#statusPanel');
        status.text(status.text() + ' touchstart');
        //e.preventDefault();
    }

    function touchend(e)
    {
        var status = $('#statusPanel');
        status.text(status.text() + ' touchend');
        //e.preventDefault();
    }

    function click(e)
    {
        var status = $('#statusPanel');
        status.text(status.text() + ' click');
        //e.preventDefault();
    }

    function touchmove(e) {
        var status = $('#statusPanel');
        status.text(status.text() + ' touchmove');
        //e.preventDefault();
    }

    function test()
    {
        var el = document.querySelector('#EventTest');
        el.addEventListener("click", click, false);
        el.addEventListener("touchstart", touchstart, false);
        el.addEventListener("touchend", touchend, false);
        
        el = document.querySelector('#grdOne_ctl00_ctl04_lnkTest');
        el.addEventListener("click", click, false);
        el.addEventListener("touchstart", touchstart, false);
        el.addEventListener("touchend", touchend, false);
        //el.addEventListener("touchmove", touchmove, false);
    }

    Sys.Application.add_load(test);   
</script>
</body>
</html>

using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Efficio.Web.TestPages
{
    public partial class REN_AppTest_Grid : System.Web.UI.Page
    {
        #region Fields

        private static readonly Random _random = new Random();

        #endregion

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                grdOne.DataSource = GenerateTestDataTable();
                grdOne.DataBind();
            }
        }

        /// <summary>
        /// Generate a data source that is a data table
        /// </summary>
        /// <returns>A data table object with test data</returns>
        private static DataTable GenerateTestDataTable()
        {
            const int columnCount = 10;
            const int numberOfRecordsToGenerate = 10;

            DataTable dataSource = new DataTable();
            for (var i = 1; i <= columnCount; i++)
            {
                dataSource.Columns.Add(new DataColumn(string.Format("Column{0}", i), typeof(int)));
            }


            // generate data
            for (var i = 0; i < numberOfRecordsToGenerate; i++)
            {
                DataRow dataRow = dataSource.NewRow();
                for (var j = 1; j <= columnCount; j++)
                {
                    dataRow[string.Format("Column{0}", j)] = _random.Next(Int16.MinValue, Int16.MaxValue);
                }
                dataSource.Rows.Add(dataRow);
            }

            return dataSource;
        }
    }
}

I run RadSchedular in the different places in my project.

The first schedules the activity, the 2nd confirms or reschedules it.

The first implementation runs well the 2nd displays can find the formal.

Apparently I copied the HTML code in the first to the second cell.

Did I do it wrongly? 

Hello, please open a demo page https://demos.telerik.com/aspnet-ajax/datetimepicker/overview/defaultcs.aspx?skin=Bootstrap and select Bootstrap skin.

Note that the left top & bottom corners are not rendered correctly. Most likely it's related to the "box-sizing: content-box".