Javascript 我的代码没有在Asp.NETMVC的_布局中呈现@scripts部分，甚至当我运行it give失败弹出窗口时
//这是我的控制器类，我使用iam在Asp.NETMVC中制作时间表。。。。我每次运行控件时都会弹出一个失败的弹出窗口，我不太确定，但我认为我的布局或其他问题可能是因为没有在Asp.net Mvc 5中加载jqueryJavascript 我的代码没有在Asp.NETMVC的_布局中呈现@scripts部分，甚至当我运行it give失败弹出窗口时,javascript,.net,asp.net-mvc,asp.net-mvc-4,razorengine,Javascript,.net,Asp.net Mvc,Asp.net Mvc 4,Razorengine,//这是我的控制器类，我使用iam在Asp.NETMVC中制作时间表。。。。我每次运行控件时都会弹出一个失败的弹出窗口，我不太确定，但我认为我的布局或其他问题可能是因为没有在Asp.net Mvc 5中加载jquery public class TutorController : Controller { public ActionResult Index() { return View(); } p
public class TutorController : Controller
{
public ActionResult Index()
{
return View();
}
public JsonResult GetEvents()
{
using (TutorHubContext dc = new TutorHubContext())
{
var events = dc.TimeTables.ToList();
return new JsonResult { Data = events, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
}
}
}
@{
ViewBag.Title = "Index";
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h2>Index</h2>
<div id="calender"></div>
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.print.css" rel="stylesheet" media="print" />
@section Scripts {
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script>
<script>
$(document).ready(function () {
events = [];
$.ajax({
type: "GET",
url: "/Tutor/GetEvents",
success: function (data) {
$.each(data, function (i, v) {
events.push({
eventID: v.EventID,
title: v.Subject,
description: v.Description,
start: moment(v.Start),
end: v.End != null ? moment(v.End) : null,
color: v.ThemeColor,
allDay: v.IsFullDay
});
})
GenerateCalender(event)
},
error: function (error) {
alert('failed');
}
})
function GenerateCalender(events) {
$('#calender').fullCalendar('destroy');
$('#calender').fullCalendar({
contentHeight: 400,
defaultDate: new Date(),
timeFormat: 'h(:mm)a',
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay,agenda'
},
eventLimit: true,
eventColor: '#378006',
events: events
})
}
})
</script>
}
</body>
</html>
公共类TutorController:控制器
{
公共行动结果索引（）
{
返回视图（）；
}
public JsonResult GetEvents（）
{
使用（TutorHubContext dc=new TutorHubContext（））
{
var events=dc.TimeTables.ToList（）；
返回新的JsonResult{Data=events，JsonRequestBehavior=JsonRequestBehavior.AllowGet}；
}
}
}
@{
ViewBag.Title=“Index”；
}
指数
@节脚本{
$（文档）.ready（函数（）{
事件=[]；
$.ajax({
键入：“获取”，
url:“/Tutor/GetEvents”，
成功：功能（数据）{
$。每个（数据、功能（i、v）{
事件。推({
eventID:v.eventID，
标题：v.主题，
描述：v.描述，
开始：力矩（v.开始），
结束：v.结束！=零？力矩（v.结束）：零，
颜色：v.ThemeColor，
全天
});
})
生成贷方（事件）
},
错误：函数（错误）{
警报（“失败”）；
}
})
功能生成贷方（事件）{
$（'日历'）.fullCalendar（'销毁'）；
$（“#日历”）.fullCalendar({
身高：400，
defaultDate:新日期（），
时间格式：“h（：mm）a'，
标题：{
左：“上一个，下一个今天”，
中心：'标题'，
右图：“月、基本周、基本日、日程”
},
eventLimit：对，
eventColor:“#378006”，
事件：事件
})
}
})
}
//请任何人帮帮我这里有点可疑。你说那是你的观点；但看起来它包含了一个完整的
文档
您的_Layout.cshtml应该包含外部位，在该文件中，您需要调用@RenderSection（“脚本”，必需：false）
稍后在您的视图中，您应该像当前一样拥有@部分脚本{…}
为了清楚起见，我将使我的_Layout.cshtml包含以下内容（注意，根据@Stephen Muecke的建议，我添加了jQuery）：
@RenderSection（“Css”，必需：false）
@RenderBody（）
@RenderSection（“脚本”，必需：false）
那么我的{View}.cshtml将包含：
<h2>Index</h2>
<div id="calender"></div>
@section Css {
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.print.css" rel="stylesheet" media="print" />
}
@section Scripts {
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script>
<script>
$(document).ready(function () {
events = [];
$.ajax({
type: "GET",
url: "/Tutor/GetEvents",
success: function (data) {
$.each(data, function (i, v) {
events.push({
eventID: v.EventID,
title: v.Subject,
description: v.Description,
start: moment(v.Start),
end: v.End != null ? moment(v.End) : null,
color: v.ThemeColor,
allDay: v.IsFullDay
});
})
GenerateCalender(event)
},
error: function (error) {
alert('failed');
}
})
function GenerateCalender(events) {
$('#calender').fullCalendar('destroy');
$('#calender').fullCalendar({
contentHeight: 400,
defaultDate: new Date(),
timeFormat: 'h(:mm)a',
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay,agenda'
},
eventLimit: true,
eventColor: '#378006',
events: events
})
}
})
</script>
}
索引
@第Css节{
}
@节脚本{
$（文档）.ready（函数（）{
事件=[]；
$.ajax({
键入：“获取”，
url:“/Tutor/GetEvents”，
成功：功能（数据）{
$。每个（数据、功能（i、v）{
事件。推({
eventID:v.eventID，
标题：v.主题，
描述：v.描述，
开始：力矩（v.开始），
结束：v.结束！=零？力矩（v.结束）：零，
颜色：v.ThemeColor，
全天
});
})
生成贷方（事件）
},
错误：函数（错误）{
警报（“失败”）；
}
})
功能生成贷方（事件）{
$（'日历'）.fullCalendar（'销毁'）；
$（“#日历”）.fullCalendar({
身高：400，
defaultDate:新日期（），
时间格式：“h（：mm）a'，
标题：{
左：“上一个，下一个今天”，
中心：'标题'，
右图：“月、基本周、基本日、日程”
},
事件限制：真，
eventColor:“#378006”，
事件：事件
})
}
})
}
我使用的是visual studio 2017，如果您收到警报（“失败”），则未包含jquery-{version}.js
（需要是第一个脚本）
那么很明显，该代码包含在页面中并正在执行。至于AJAX调用失败的原因，您必须检查实际错误<代码>警报（“失败”）并没有告诉你多少，是吗？该函数中的error
变量中有什么？使用浏览器的调试工具时，在“网络”选项卡中，服务器的响应是什么？当调试服务器端代码时，它在哪里失败？我必须在哪里提到jquery-{version}的版本.js中的类或文件以及我的控制工具工作正常，但在收到警报后，它实际上没有选择_布局，但在那之后，它出现了一个失败的消息。这是my _Layout.csHtml虽然这当然更好，但浏览器可以原谅在HTML文档中包含完整的HTML文档。OP报告警报（'failed'）行已成功执行，这非常明确地表明客户端代码至少已成功执行。
<h2>Index</h2>
<div id="calender"></div>
@section Css {
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.print.css" rel="stylesheet" media="print" />
}
@section Scripts {
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script>
<script>
$(document).ready(function () {
events = [];
$.ajax({
type: "GET",
url: "/Tutor/GetEvents",
success: function (data) {
$.each(data, function (i, v) {
events.push({
eventID: v.EventID,
title: v.Subject,
description: v.Description,
start: moment(v.Start),
end: v.End != null ? moment(v.End) : null,
color: v.ThemeColor,
allDay: v.IsFullDay
});
})
GenerateCalender(event)
},
error: function (error) {
alert('failed');
}
})
function GenerateCalender(events) {
$('#calender').fullCalendar('destroy');
$('#calender').fullCalendar({
contentHeight: 400,
defaultDate: new Date(),
timeFormat: 'h(:mm)a',
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay,agenda'
},
eventLimit: true,
eventColor: '#378006',
events: events
})
}
})
</script>
}