Hi,
I have some basic doubts related to kendo mobile in ASP.Net MVC 4. I know the way of rendering the master page in kendo mobile and MVC are different.
Here is my sample code. Is this a correct way?
_Layout.Mobile.cshtml
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title - My ASP.NET MVC Application</title>
<meta name="viewport" content="width=device-width" />
<link href="~/Content/kendo.mobile.all.min.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/kendo.all.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var app = new kendo.mobile.Application(document.body,
{
transition: 'slide'
});
});
</script>
</head>
<body>
<div data-role="view" data-layout="default">
@RenderBody()
</div>
<section data-role="layout" data-id="default">
<header data-role="header">
<div data-role="navbar">My App</div>
</header>
<!--View content will render here-->
<footer data-role="footer">
<div data-role="tabstrip">
<a data-icon="home" href="~/Home/Index">Home</a>
<a data-icon="about" href="~/Home/About">About</a>
</div>
</footer>
</section>
</body>
</html>
Index.Mobile.cshtml
@{
ViewBag.Title = "Home Page";
// This is done for avoiding re-rendering of the master page.. But still Request.IsAjaxRequest() always false
Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml" //It will take mobile layout based on the request
}
Mobile Version System
<br />
Refresh Time : @(DateTime.Now.ToString())
@{
ViewBag.Title = "About";
}
About.Mobile.cshtml
@{
ViewBag.Title = "Home Page";
// This is done for avoiding re-rendering of the master page.. But still Request.IsAjaxRequest() always false
Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml" //It will take mobile layout based on the request
}
About in Mobile
Issues : -
I didn't found much information related to Kendo UI mobile and MVC 4 implementation.
Is this the correct way of implementation of Kendo mobile in MVC 4. Is there anything needs to be changed in Layout page (_Layout.Mobile.cshtml)?
I have some basic doubts related to kendo mobile in ASP.Net MVC 4. I know the way of rendering the master page in kendo mobile and MVC are different.
Here is my sample code. Is this a correct way?
_Layout.Mobile.cshtml
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title - My ASP.NET MVC Application</title>
<meta name="viewport" content="width=device-width" />
<link href="~/Content/kendo.mobile.all.min.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/kendo.all.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var app = new kendo.mobile.Application(document.body,
{
transition: 'slide'
});
});
</script>
</head>
<body>
<div data-role="view" data-layout="default">
@RenderBody()
</div>
<section data-role="layout" data-id="default">
<header data-role="header">
<div data-role="navbar">My App</div>
</header>
<!--View content will render here-->
<footer data-role="footer">
<div data-role="tabstrip">
<a data-icon="home" href="~/Home/Index">Home</a>
<a data-icon="about" href="~/Home/About">About</a>
</div>
</footer>
</section>
</body>
</html>
Index.Mobile.cshtml
ViewBag.Title = "Home Page";
// This is done for avoiding re-rendering of the master page.. But still Request.IsAjaxRequest() always false
Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml" //It will take mobile layout based on the request
}
Mobile Version System
<br />
Refresh Time : @(DateTime.Now.ToString())
ViewBag.Title = "About";
}
About.Mobile.cshtml
@{
ViewBag.Title = "Home Page";
// This is done for avoiding re-rendering of the master page.. But still Request.IsAjaxRequest() always false
Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml" //It will take mobile layout based on the request
}
About in Mobile
Issues : -
I didn't found much information related to Kendo UI mobile and MVC 4 implementation.
Is this the correct way of implementation of Kendo mobile in MVC 4. Is there anything needs to be changed in Layout page (_Layout.Mobile.cshtml)?
1 Answer, 1 is accepted
0
Hello Anas,
Petyo
the Telerik team
Kendo UI Mobile would not navigate to URLs which, when bookmarked or linked to directly, will hit the remote view without passing through the initial view first. Thus being said, you don't need layouts at all - as the remote view request will always be performed via ajax, by the mobile application.
Kind regards,Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!