Question

我正在学习MVC和jquery，但我有一个视图，我可以加载但是它是空白的。

我正在尝试使用jquery-fullcalendar获取基本日历。

我会发布我的观看代码，看看我可能做错了什么。

更新我曾尝试使用fullcalendars示例代码但仍然没有让任何人知道原因？

 <script>
   $(document).ready(function () {
      $('#calendar').fullCalendar({
          // put your options and callbacks here
      })
  });
</script>

  <div id='calendar'></div>

我知道我只是遗漏了一些东西，但我却看不到它。

Answer 1

使用“基本”模板，我将从视图中删除jquery脚本标记。当我在VS2012中创建一个新的MVC4项目时，_Layout.cshtml看起来像这样

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    @RenderBody()

    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
</body>
</html>

@ Scripts.Render行（“〜/ bundles / jquery”）将jquery脚本标记放在视图正文之后。您可以更改视图，以便在jquery脚本标记之后呈现fullcalender.js和文档就绪函数

@{
    ViewBag.Title = "Index";
}
@section scripts {
    <link href="@Url.Content("~/Scripts/fullcalendar.css")"rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/fullcalendar.js")" type="text/javascript"></script>
    <script type ='text/javascript'>
        $(document).ready(function () {
            $('#calendar').fullCalendar({});
        });
    </script>
}
<h2>Index</h2>

<div id='calendar'></div>

Answer 2

如果有其他人遇到此问题，我使用 Telerik 作为菜单，并且在布局中有此代码

@（Html.Telerik（）。ScriptRegistrar（）。DefaultGroup（group =＆gt; group.Combined（true）.Compress（true））） @（Html.Telerik（）。StyleSheetRegistrar（）。DefaultGroup（group =＆gt; group.Add（“telerik.common.css”）。Add（“telerik.windows7.css”）。Combined（true）.Compress（true ）））

这些位于正文的地方，我只是将它们移到头部，它似乎没有影响菜单，但确实修复了完整的日历并开始渲染它

使用带有MVC4的jquery完整日历

2 个答案: