Home/ Questions/Q 6221409
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-24T08:07:44+00:00

I am trying to implement jquery full calendar with json event updates. I have

  • 0

I am trying to implement jquery full calendar with json event updates. I have no idea why oit’s not working. Her is my layout.cstml head

<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="../../Scripts/fullcalendar.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.7.2.custom.min.js" type="text/javascript">        </script>
<script src="../../Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<link href="../../Content/fullcalendar.css" rel="stylesheet" type="text/css" />
<link href="../../Content/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css"    />



 </head>

Here is my index.cshtml

@{
ViewBag.Title = "Home Page";
}


 <h2>@ViewBag.Message</h2>
 <p>
To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET    MVC     Website">http://asp.net/mvc</a>.
 </p>

   <script type="text/javascript">
     $(document).ready(function () {
     $('#calendar').fullCalendar({
            events: "/Home/CalendarData"
        });
    });  
   </script>

  <div id="calendar">
  </div>

And my controller

 using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Web;
 using System.Web.Mvc;
 using MvcApplication4.Models;

 namespace MvcApplication4.Controllers
  {
   public class HomeController : Controller
   {
    public ActionResult Index()
    {
        ViewBag.Message = "Welcome to ASP.NET MVC!";

        return View();
    }

    public ActionResult About()
    {
        return View();
    }


    [HandleError]

        public ActionResult CalendarData()
        {
            IList<CalendarDTO> tasksList = new List<CalendarDTO>();

            tasksList.Add(new CalendarDTO
            {
                id = 1,
                title = "Google search",
                start = ToUnixTimespan(DateTime.Now),
                end = ToUnixTimespan(DateTime.Now.AddHours(4)),
                url = "www.google.com"
            });
            tasksList.Add(new CalendarDTO
            {
                id = 1,
                title = "Bing search",
                start = ToUnixTimespan(DateTime.Now.AddDays(1)),
                end = ToUnixTimespan(DateTime.Now.AddDays(1).AddHours(4)),
                url = "www.bing.com"
            });

            return Json(tasksList);
        }

        private long ToUnixTimespan(DateTime date)
        {
            TimeSpan tspan = date.ToUniversalTime().Subtract(
         new DateTime(1970, 1, 1, 0, 0, 0));

              return (long)Math.Truncate(tspan.TotalSeconds);
        }
       }
   }

I’m getting nothing in my view. Any suggestions? Thanks in advance!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Javascript include order does matter here…

    You should be putting jQuery lib above the jQueryUI lib, and then the fullCalendar lib.

    EDIT: Also, you should use the Url.Content() like in the first CSS tag. This helps resolve the actual server pathing when the page loads. You don’t want to use relative pathing.

    So your tags should look like…

    <!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.3.2.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.7.2.custom.min.js")" type="text/javascript"></script>    
<script src="@Url.Content("~/Scripts/fullcalendar.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/fullcalendar.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/jquery-ui-1.7.2.custom.css")" rel="stylesheet" type="text/css"    />

    Edit 2:
    Actually, I think I see the real reason you’re not getting anything in your view.

    In your layout.cshtml, you’ll need to add a body tag. Soo…

    <!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="../../Scripts/fullcalendar.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.7.2.custom.min.js" type="text/javascript">        </script>
<script src="../../Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<link href="../../Content/fullcalendar.css" rel="stylesheet" type="text/css" />
<link href="../../Content/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css"    />



</head>
<body>
    <div id="page">
        @RenderBody()
    </div>
</body>

    You need the RenderBody() method so the Razor engine knows where to put the view content that isn’t defined in a section. You can’t have more than one RenderBody() method in the layout view.

    • 0