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

Getting 'HelloWorld' working in Visual Studio 2010 - please help

1 Answer 114 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Tim
Top achievements
Rank 1
Tim asked on 02 May 2012, 03:03 PM
Hello, I am trying to get the Hello World example from http://www.kendoui.com/documentation/mobile/application/overview.aspx to work in a Visual Studio 2010 ASP.NET project.

i created a new aspx page called 'Mobile.aspx' and included all the Kendo js files and Scripts.
I tried to "aspify" the Hello World example, but when I run it via F5 (and it is displayed in Chrome) I just see the content from the default Site.master page, and just the text
Header
Hello world!
Footer
in the content area.  I see nothing that looks like a Kendo mobile app.

Here is my attempt at "aspification" of the Hello World app.  The Intellisense doesn't like the 'data-role' attribute, but I suspect my problems are much more basic.
--------------------------------------------------------------
<%@ Page  Title="Mobile" MasterPageFile="~/Site.master" Language="C#" AutoEventWireup="true" CodeFile="Mobile.aspx.cs"
    Inherits="Mobile" %>

<asp:Content ID="HeadContent" runat="server" ContentPlaceHolderID="HeadContent">
    <title>Kendo Mobile Test</title>
    <!-- Kendo UI Web styles-->
    <link href="styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
    <!-- Kendo UI Web scripts-->
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <script src="js/kendo.dataviz.min.js" type="text/javascript"></script>-->
    <script src="content/console.js" type="text/javascript"></script>
</asp:Content>

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">

   <div data-role="view">
     <div data-role="header">Header</div>
     Hello world!
     <div data-role="footer">Footer</div>
   </div>

   <script type="text/javascript" src="js/kendo.mobile.application.min.js">
       var app = new kendo.mobile.Application(); //document.body is used by default
   </script>

</asp:Content>
--------------------------------------------------------------

Thank you,
Tim

1 Answer, 1 is accepted

Sort by
0
Tim
Top achievements
Rank 1
answered on 02 May 2012, 03:43 PM
OK, made some progress on my own.  Two problems above:
1) wrong headers
2) src="js/kendo.mobile.application.min.js" is incorrect and not needed

the latest version, which seems to be invoking the Kendo Mobile Application finally:

<%@ Page  Title="Mobile" MasterPageFile="~/Site.master" Language="C#" AutoEventWireup="true" CodeFile="Mobile.aspx.cs"
    Inherits="Mobile" %>

<asp:Content ID="HeadContent" runat="server" ContentPlaceHolderID="HeadContent">
    <title>Kendo Mobile Test</title>
     <!--In the header of your page, paste the following for Kendo UI Mobile styles-->
    <link href="styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />

    <!--Then paste the following for Kendo UI Mobile scripts-->
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <script src="js/kendo.mobile.min.js" type="text/javascript"></script>

</asp:Content>

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">

   <div data-role="view">
     <div data-role="header">Header</div>
     Hello world!
     <div data-role="footer">Footer</div>
   </div>

   <script type="text/javascript">
       var app = new kendo.mobile.Application(); //document.body is used by default
   </script>

</asp:Content>

Tags
General Discussions
Asked by
Tim
Top achievements
Rank 1
Answers by
Tim
Top achievements
Rank 1
Share this question
or