Posted 21 Aug 2013
Link to this post
I belive this is all the code i have for the scheduler on the index.cshtml page:
<div id="Calendar_div" class="image">
<div id="calendar_text_container" class="tile_header">
<p class="tile_header_text">Calendar</p>
<!--<iframe src="https://www.google.com/calendar/embed?showNav=0&showPrint=0&showTabs=0&height=600&wkst=1&bgcolor=%23ffffff&src=ardentmc808%40gmail.com&color=%232952A3&ctz=Pacific%2FHonolulu" style=" border-width:0 " width="538" height="430" frameborder="0" scrolling="no"></iframe>-->
<!--end of copy and pasted Kendo UI code-->
<span id="input_span">
<h6 class="calendar_input">Kihei</h6>
<h6 class="calendar_input">Reston</h6>
<h6 class="calendar_input">Shared</h6>
</span>
<div id="scheduler"></div>
<div id="group">
<input checked type="checkbox" id="Kihei" value="1">
<input checked type="checkbox" id="Reston" value="2">
<input type="checkbox" id="Shared" value="3">
</div>
</div>
</div>
<!--original javascript that creates the calendar with dummy data-->
<script type ="text/javascript">
$("#scheduler").kendoScheduler({
date: new Date("2013/6/6"),
startTime: new Date("2013/6/13 07:00 AM"),
height: 400,
views: [
"day",
{ type: "week", selected: true },
"month",
"agenda",
],
schema: {
model: {
id: "taskId",
fields: {
taskId: { from: "TaskId", type: "number" },
title: { from: "Title", defaultValue: "No title", validation: { required: true } },
start: { type: "date", from: "Start" },
end: { type: "date", from: "End" },
startTimezone: { from: "StartTimezone" },
endTimezone: { from: "EndTimezone" },
description: { from: "Description" },
recurrenceId: { from: "RecurrenceID" },
recurrenceRule: { from: "RecurrenceRule" },
recurrenceException: { from: "RecurrenceException" },
ownerId: { from: "OwnerID", defaultValue: 1 },
isAllDay: { type: "boolean", from: "IsAllDay" }
}
}
},
filter: {
logic: "or",
filters: [
{ field: "ownerId", operator: "eq", value: 1 },
{ field: "ownerId", operator: "eq", value: 2 }
]
},
timezone: "Etc/UTC",
resources: [
{
field: "ownerId",
title: "Owner",
dataSource: [
{ text: "Kihei", value: 1, color: "#f8a398" },
{ text: "Reston", value: 2, color: "#51a0ed" },
{ text: "Shared", value: 3, color: "#56ca85" }
]
}
],
});
//have to get rid of dataSource if you want dummy data to appear - remember to delete a bracket from the end also
var scheduler = $("#scheduler").data("kendoScheduler");
scheduler.dataSource.add({
start: new Date("2013/6/6 09:00 AM"),
end: new Date("2013/6/6 10:00 AM"),
title: "IRD Daily Scrum",
recurrenceRule: "FREQ=DAILY"
});
scheduler.dataSource.add({
start: new Date("2013/6/25 01:00 PM"),
end: new Date("2013/6/25 02:00 PM"),
title: "Cookie Contest",
recurrenceRule: "FREQ=MONTHLY"
});
scheduler.dataSource.add({
start: new Date("2013/7/19 02:45 PM"),
end: new Date("2013/7/19 03:15 PM"),
title: "Farewell to Intern AJ",
description: "Ice cream mochi party to say goodbye to AJ"
});
</script>
}
and this is the code i have in the layout.cshtml page:
@using Kendo.Mvc.UI;
<!DOCTYPE html>
<html lang="en">
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css"/>
<script src="@Url.Content("~/Scripts/jquery-1.9.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.24.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css"/>
@*<link href="Content/kendo/2013.2.716/kendo.common.min.css" rel="stylesheet" type ="text/css"/>
<link href="Content/kendo/2013.2.716/kendo.metro.min.css" rel="stylesheet" type ="text/css"/>
<script src="Scripts/jquery-1.9.1.min.js"></script>
<script src="Kendo/kendo.all.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.aspnetmvc.min.js"></script>
<script src="Scripts/kendo/2013.2.716/kendo.scheduler.view.min.js"></script>
<script src="Scripts/kendo/2013.2.716/kendo.secheduler.min.js"></script>*@
<!--Razor version of references. I'm hoping it will make a difference and allow the other (MVC) version of the scheduler show up-->
<link rel="stylesheet" href="@Url.Content("~/Content/kendo.common.min.css")">
<link rel="stylesheet" href="@Url.Content("~/Content/kendo.metro.min.css")">
<link href="@Url.Content("~/Content/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.min.js")"></script>
@* <script src="@Url.Content("~/Scripts/kendo.timezones.min.js")"></script>*@
@* <script type="text/javascript" src="@Url.Content("~/Scripts/kendo.all.min.js")"></script>*@
<script src="@Url.Content("~/Scripts/kendo.web.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/kendo.aspnetmvc.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo.dataviz.min.js")"></script>
@* <script src="@Url.Content("~/Scripts/jquery.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo.aspnetmvc.min.js")"></script>*@
<link rel="stylesheet" type="text/css" href="Content/Site.css">
<title>iDashboard by ArdentMC</title>
</head>
<body>
<header>
<a name = "top"> </a> <!--anchor for scroll up-->
<div id = "header">
<h1 class ="bold">iDashboard</h1>
<h3 id ="nextline" class ="italic">by ArdentMC</h3>
<img class ="icon" src ="Images/icon_in.png"/>
<img class ="icon" src ="Images/icon_twitter.png"/>
<img class ="icon" src ="Images/icon_FB.png"/>
</div>
</header>
<div id="body">
@RenderSection("featured", required: false)
<section class="content-wrapper main-content clear-fix">
@RenderBody()
</section>
</div>
<footer>
<div class="content-wrapper">
</div>
</footer>
@Scripts.Render("~/bundles/jquery")
@RenderSection("scripts", required: false)
@Styles.Render("~/Content/themes/base/css")
@Scripts.Render("~/bundles/jqueryui")
</body>
</html>
I have no idea what I am missing but any help or advice would be greatly appreciated. I just need to be able to save events added to the database and as of right now the scheduler isnt even displaying on the page.
thank you in advance