Databases
StackOverflow2013
Postsdbo
POjQuery FullCalendar invoking populate data method failing
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery FullCalendar invoking populate data method failing
    primarykey
    data
    text
    <p>I am currently working on a little website in ASP.NET MVC3 (Razor) where I need a page that displays a calendar with some appointments in it. </p> <p>I have chosen FullCalendar and have run into some trouble. I got the calendar displaying fine by injecting it into a <code>&lt;div&gt;</code>.</p> <p>But as soon as I try to add the "events" property so that my populate data method is invoked the calendar is not even being show and naturally I never reach the method in the controller. Even if I try to add a header section where I manipulate the title and navigation arrows it wont render.</p> <p>I have included all the necessary scripts in my masterpage here is the source view of the index view were you can see all the scripts included.</p> <p>I cannot understand what I am doing wrong. I should be able to render the HTML just fine and invoke the method so I get some appointments in my calendar.</p> <p>Also why can I not do a simple operation like modifying the header and positioning the title where I want. My syntax must be broken?</p> <pre><code> &lt;title&gt;Index&lt;/title&gt; &lt;link href="/Content/Site.css" rel="stylesheet" type="text/css" /&gt; &lt;link href="/css/jquery.lightbox-0.5.css" rel="Stylesheet" type="text/css" media="screen" /&gt; &lt;link href="/Content/fullcalendar.css" rel="stylesheet" type="text/css" /&gt; &lt;script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/jquery.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/MicrosoftAjax.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"&gt; &lt;/script&gt; &lt;script src="/Scripts/jquery.validate.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/fullcalendar.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/jquery.lightbox-0.5.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/Venatores.js" type="text/javascript"&gt;&lt;/script&gt; </code></pre> <p>Datamodel:</p> <pre><code> public class EventModel { public int ID { get; set; } public string Title { get; set; } public DateTime StartDateTime { get; set; } public DateTime EndDateTime { get; set; } public bool IsAllDay { get; set; } } </code></pre> <p>Controller named CalendarController:</p> <pre><code> public ActionResult Index() { return View(); } public JsonResult PopulateData(double start, double end) { // var startDateTime = FromUnixTimestamp(start); // var endDateTime = FromUnixTimestamp(end); EventModel appointment = new EventModel(); appointment.StartDateTime = DateTime.Now; appointment.EndDateTime = appointment.StartDateTime.AddHours(2.0); appointment.IsAllDay = false; appointment.Title = "Riffel"; appointment.ID = 1; List&lt;EventModel&gt; appointments = new List&lt;EventModel&gt;(); appointments.Add(appointment); var clientList = new List&lt;object&gt;(); foreach (EventModel e in appointments) { clientList.Add( new { id = e.ID, title = e.Title, //description = e.Description, start = ToUnixTimespan(e.StartDateTime), end = ToUnixTimespan(e.EndDateTime), allDay = e.IsAllDay, url = "www.google.com" }); } return Json(clientList.ToArray(), JsonRequestBehavior.AllowGet); } private static DateTime FromUnixTimestamp(double timestamp) { var origin = new DateTime(1970, 1, 1, 0, 0, 0, 0); return origin.AddSeconds(timestamp); } private long ToUnixTimespan(DateTime date) { TimeSpan tspan = date.ToUniversalTime().Subtract( new DateTime(1970, 1, 1, 0, 0, 0)); return (long)Math.Truncate(tspan.TotalSeconds); } </code></pre> <p>My Index view:</p> <pre><code>&lt;script type="text/javascript" language="javascript"&gt; $(document).ready(function () { $('#calendar').fullCalendar({ //events: "/Calendar/PopulateData" }); }); &lt;/script&gt; &lt;h2&gt;Index&lt;/h2&gt; &lt;div id="calendar"&gt;&lt;/div&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. UStereško
    1. USMemphis
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. CONobody has any input?
      singulars
      1. POjQuery FullCalendar invoking populate data method failing
      1. USMemphis
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload