Javascript 为什么ajax结果不显示在子视图中?
我正在做这样一个ajax调用:Javascript 为什么ajax结果不显示在子视图中?,javascript,jquery,ajax,asp.net-mvc-3,razor,Javascript,Jquery,Ajax,Asp.net Mvc 3,Razor,我正在做这样一个ajax调用: @Ajax.ActionLink("My Schedule", "GetSchedule", "Schedule", new { selectedDate = strToday}, new AjaxOptions { UpdateTargetId = "theTimes", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" }) @model SchoolIn.ViewModels.Sche
@Ajax.ActionLink("My Schedule", "GetSchedule", "Schedule", new { selectedDate = strToday}, new AjaxOptions { UpdateTargetId = "theTimes", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" })
@model SchoolIn.ViewModels.ScheduleData
@{
ViewBag.Title = "Index";
}
<link href="../../Content/themes/base/jquery-ui-1.10.4.custom.css" rel="stylesheet"
type="text/css" />
<link href="../../Content/themes/base/jquery-ui-1.10.4.custom.min.css" rel="stylesheet"
type="text/css" />
<script src="../../Scripts/jquery-1.10.2.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.10.4.custom.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.10.4.custom.min.js" type="text/javascript"></script>
<div class ="ui-widget" >
<label for ="datep">Date: </label><input id="datep" />
</div>
@ViewBag.theDate
@if (Model.Assignments != null)
{
<table>
<tr>
<th>
Assignment Course
</th>
<th>
Class Day
</th>
<th>
Class Time
</th>
</tr>
@foreach (var item in Model.Assignments.Select((x, i) => new { Data = x, Index = i }))
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Data.Course)
</td>
<td>
@Html.DisplayFor(modelItem => item.Data.HomeworkGrade)
</td>
<td>
@Html.DisplayFor(modelItem => item.Data.Date)
</td>
</tr>
}
</table>
}
<input type="hidden" autofocus=true/>
<script type="text/javascript">
$(document).ready(function () {
$("#datep").datepicker({ showOn: "both", buttonText: "Select Date", changeMonth: true, changeYear: true, yearRange: "-2:+2", showOtherMonths: true, onSelect: function (date, datepickder) {
var sltdDate = { selectedDate: date };
$.ajax({
type: "GET",
url: "/Schedule/GetSchedule",
data: sltdDate,
datatype: "html",
sucess: function (data) {
}
});
}
});
});
</script>
它调用一个包含数据选择器的局部视图。以下是控制器操作的外观:
public ActionResult GetSchedule(string selectedDate)
{
ViewBag.fromGetSchedule = selectedDate;
var viewModel = new ScheduleData();
String dayofweek = DateTime.Now.DayOfWeek.ToString();
viewModel.Courses = db.Courses;
int intTeacherId = Convert.ToInt32(Session["intTeacherId"]);
DateTime daySearch = Convert.ToDateTime(selectedDate);
viewModel.Assignments = from a in db.Assignments where a.teacherId == intTeacherId select a;
viewModel.Assignments = (from x in db.Assignments where x.teacherId == intTeacherId && x.Date == daySearch select x).ToList();
ViewBag.theDate = daySearch.ToShortDateString();
return PartialView(viewModel);
}
}
这一切都很好。它调用如下所示的局部视图:
@Ajax.ActionLink("My Schedule", "GetSchedule", "Schedule", new { selectedDate = strToday}, new AjaxOptions { UpdateTargetId = "theTimes", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" })
@model SchoolIn.ViewModels.ScheduleData
@{
ViewBag.Title = "Index";
}
<link href="../../Content/themes/base/jquery-ui-1.10.4.custom.css" rel="stylesheet"
type="text/css" />
<link href="../../Content/themes/base/jquery-ui-1.10.4.custom.min.css" rel="stylesheet"
type="text/css" />
<script src="../../Scripts/jquery-1.10.2.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.10.4.custom.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.10.4.custom.min.js" type="text/javascript"></script>
<div class ="ui-widget" >
<label for ="datep">Date: </label><input id="datep" />
</div>
@ViewBag.theDate
@if (Model.Assignments != null)
{
<table>
<tr>
<th>
Assignment Course
</th>
<th>
Class Day
</th>
<th>
Class Time
</th>
</tr>
@foreach (var item in Model.Assignments.Select((x, i) => new { Data = x, Index = i }))
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Data.Course)
</td>
<td>
@Html.DisplayFor(modelItem => item.Data.HomeworkGrade)
</td>
<td>
@Html.DisplayFor(modelItem => item.Data.Date)
</td>
</tr>
}
</table>
}
<input type="hidden" autofocus=true/>
<script type="text/javascript">
$(document).ready(function () {
$("#datep").datepicker({ showOn: "both", buttonText: "Select Date", changeMonth: true, changeYear: true, yearRange: "-2:+2", showOtherMonths: true, onSelect: function (date, datepickder) {
var sltdDate = { selectedDate: date };
$.ajax({
type: "GET",
url: "/Schedule/GetSchedule",
data: sltdDate,
datatype: "html",
sucess: function (data) {
}
});
}
});
});
</script>
然后在部分视图中,我从datepicker中选择一个日期,并对前面提到的相同操作进行ajax调用。linq查询再次运行良好,一切正常。我检查视图中的代码,查看它是否正在接收使用断点从控制器发送的数据,并且数据确实通过,但它不显示在视图中。它显示表的标题,但在@Html.Foreach{}循环中没有显示任何内容
为什么ajax结果不显示在子视图中?再次感谢您在这方面的帮助。首先,我需要更正输入错误。。。成功之后,我将视图包装到一个div容器中,然后使用success函数将返回的数据放入div容器中。下面是success函数的外观
success: function (data) {
$("#returnedData").html(data);
}
您是否应该对ajax请求的成功处理程序中返回的数据进行处理?我以前没有使用过ajax请求……不确定这是否必要。