大佬教程收集整理的这篇文章主要介绍了Asp.net MVC scheduler的实现方法详解,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
Asp.net MVC scheduler的实现方法详解
本例使用了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> <h4 class="modal-title">Create PM Task</h4> </div> <div class="modal-body"> <div class="row"> <label class="col-md-2 control-label">your field1</label> <div class="col-md-4"> field1 </div> <label class="col-md-2 control-label">field2</label> <div class="col-md-4"> <div class="input-icon left"> field2 </div> </div> </div> <br/> <div class="row"> ... more rows of fields </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="submit" class="btn btn-priMary">Submit</button> </div> } </div> </div> </div> </div> } @section scripts{ <link href="~/assets3/global/plugins/fullcalendar/fullcalendar.css" rel="external nofollow" rel="stylesheet" /> <script src="~/assets3/global/plugins/fullcalendar/fullcalendar.js"></script> <script> $.get("JsonURL",function (data) { console.log(JSON.Stringify(data)); $('#calendar').fullCalendar({ header: { left: 'prev,next today',center: 'title',right: 'month,basicWeek,basicDay' },navLinks: false,// can click day/week names to navigate views editable: false,eventLimit: false,// allow "more" link when too many events events: data,dayClick: function () { var dt = $(this).attr("data-date"); $("#hdnAssignedDate").val(dt); //// pop up modal $("#btnSELEctStaff").click(); } }); }); </script> }@H_450_14@
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; } } ...@H_450_14@
如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
以上是大佬教程为你收集整理的Asp.net MVC scheduler的实现方法详解全部内容,希望文章能够帮你解决Asp.net MVC scheduler的实现方法详解所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。