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

grid datetime column not rendering html5 mobile

0 Answers 92 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Mike
Top achievements
Rank 1
Mike asked on 27 Mar 2017, 05:22 PM

I am using asp.net Ajax in visual studio 2008 
I have created a new "telerik web Forms Site" for .NET Framework 3.5
My Version of telerik asp.net Ajax is 2015.1.401.35(Dev)

 

My goal: To create date selection on mobile device the same whay that is featured on your mobile demo site

http://demos.telerik.com/aspnet-ajax/grid/mobile-examples/overview/default.aspx?name=overview

 

The issue:  The datetime column is rendering as a plane text box and does not prompt the end user with date/time selectors like  it does on your mobile demo.

I did a test on the dropdown column and it does render like your demo. 

 

My question: What do I need to modify in my code below to have date time column render on a mobidle device in the same way it does on your mobile demo located at http://demos.telerik.com/aspnet-ajax/grid/mobile-examples/overview/default.aspx?name=overview

 

My code:

 

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>
    </telerik:RadScriptManager>
    <script type="text/javascript">
        //Put your JavaScript code here.
    </script>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <div>

    </div>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
        ConnectionString="<%$ ConnectionStrings:KDCKBConnectionString %>" 
        DeleteCommand="DELETE FROM [Contacts] WHERE [ID] = @ID" 
        InsertCommand="INSERT INTO [Contacts] ([ContactName], [Birthdate]) VALUES (@ContactName, @Birthdate)" 
        SelectCommand="SELECT * FROM [Contacts]" 
        UpdateCommand="UPDATE [Contacts] SET [ContactName] = @ContactName, [Birthdate] = @Birthdate WHERE [ID] = @ID">
        <DeleteParameters>
            <asp:Parameter Name="ID" Type="Int32" />
        </DeleteParameters>
        <UpdateParameters>
            <asp:Parameter Name="ContactName" Type="String" />
            <asp:Parameter DbType="Date" Name="Birthdate" />
            <asp:Parameter Name="ID" Type="Int32" />
        </UpdateParameters>
        <InsertParameters>
            <asp:Parameter Name="ContactName" Type="String" />
            <asp:Parameter DbType="Date" Name="Birthdate" />
        </InsertParameters>
    </asp:SqlDataSource>
    <asp:SqlDataSource ID="SqlDataSource2" runat="server" 
        ConnectionString="<%$ ConnectionStrings:KDCKBConnectionString %>" 
        SelectCommand="SELECT [Product] FROM [Incident_Report_Primary_Product]">
    </asp:SqlDataSource>
    <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateEditColumn="True" 
        DataSourceID="SqlDataSource1" GroupPanelPosition="Top" RenderMode="Mobile">
        <MasterTableView AllowAutomaticDeletes="True" AllowAutomaticInserts="True" 
            AllowAutomaticUpdates="True" AutoGenerateColumns="False" 
            CommandItemDisplay="Top" DataKeyNames="ID" DataSourceID="SqlDataSource1" EditMode="PopUp">
            <Columns>
                <telerik:GridBoundColumn DataField="ID" DataType="System.Int32" 
                    FilterControlAltText="Filter ID column" HeaderText="ID" ReadOnly="True" 
                    SortExpression="ID" UniqueName="ID">
                </telerik:GridBoundColumn>
                <telerik:GridDropDownColumn DataField="ContactName" 
                    DataSourceID="SqlDataSource2" FilterControlAltText="Filter Contact column" 
                    ListTextField="Product" ListValueField="Product" UniqueName="Contact" 
                    UseNativeEditorsInMobileMode="False" DropDownControlType="DropDownList">
                </telerik:GridDropDownColumn>
                <telerik:GridDateTimeColumn DataField="BirthDate" 
                    FilterControlAltText="Filter BirthDate column" UniqueName="BirthDate" PickerType="DatePicker">
                </telerik:GridDateTimeColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
    </form>
</body>
</html>

No answers yet. Maybe you can help?

Tags
Grid
Asked by
Mike
Top achievements
Rank 1
Share this question
or