Detailed Implementation of Asp.net MVC scheduler, mvcscheduler
Implementation of Asp.net MVC scheduler
This example uses fullcalendar js: https://fullcalendar.io/
1. view:
@{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Layout.cshtml"; } @section PageContent{ <style> .modal-backdrop { z-index: 9; } </style> <div class="container"> <div id='calendar'> </div> </div> <!--Select Staff--> <div class="container"> <!-- Trigger the modal with a button --> <button type="button" id="btnSelectStaff" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal" style="display: none"></button> <!-- Modal --> <div class="modal fade" id="myModal" role="dialog" style="z-index: 10"> <div class="modal-dialog modal-lg"> <br /><br /><br /> <!-- Modal content--> <div class="modal-content"> @using (Html.BeginForm("AssignTask", "PMPlan", FormMethod.Post, new { @class="form-horizontal", role="form"} )) { <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button>
2. Web api controller:
... public ActionResult GetJsonData() { ... var tasks = //...logic of getting tasks ... var jsonObjs = tasks.Select(x => new FullCalendaRecord() { title = x.Subject, url = "the url", start = ..., end = x.TargetDate.Value.ToString("yyyy-MM-dd"), }).ToList(); return Json(jsonObjs, JsonRequestBehavior.AllowGet); } public class FullCalendaRecord { // sample data: //[ //{ // title: 'Click for Google', // url: 'http://google.com/', // start: '2017-09-28', // end:'2017-09-28' //} //] public string title { get; set; } public string url { get; set; } public string start { get; set; } public string end { get; set; } } ...
If you have any questions, please leave a message or go to the community on this site for discussion. Thank you for reading this article. Thank you for your support!