ASP.NET MVC 3.0的WebGrid - 支持AJAXMVC、NET、ASP、AJAX
我遇到下面的问题：一个jQuery脚本引用，需要为了使Ajax支持在的WebGrid帮手
我想我的WebGrid AJAX启用。我得到这个$ C $下的局部视图
@ModelType的WebGrid
@ Model.GetHtml（TABLESTYLE：=的WebGrid，headerStyle：=的WebGrid头，footerStyle：=的WebGrid躯，alternatingRowStyle：=的WebGrid-交替排，selectedRowStyle：=的WebGrid选择行rowStyle：=的WebGrid排式
列：= Model.Columns（Model.Column（
COLUMNNAME：= GemeentePostColumnsEnum.NIS code.ToString（）），
Model.Column（COLUMNNAME：= GemeentePostColumnsEnum.GemeenteNaam.ToString（）），
Model.Column（COLUMNNAME：= GemeentePostColumnsEnum.DistrictNaam.ToString（）），
Model.Column（COLUMNNAME：= GemeentePostColumnsEnum.Post code.ToString（）），
Model.Column（COLUMNNAME：= GemeentePostColumnsEnum.PostNaam.ToString（）），
Model.Column（
格式：= @@＆LT;文本＆GT; @ Ajax.ActionLink（编辑，AddEdit，新增功能{.NIS code = item.NIS code}，新AjaxOptions随着{.UpdateTargetId =formGemeentePost .InsertionMode = InsertionMode.Replace，.HttpMethod =GET，.OnFailure =失败}）＆LT; /文＆GT;）））
这code的控制器：
功能SearchForm（searchModel作为GemeentePostWebService.GemeentePostCriteria）作为PartialViewResult
searchModel.Taal code =NL
code填补型号
ViewBag.WebGrid = CreateGrid（viewModelList）
返回PartialView（部分/ _Grid，ViewBag.WebGrid）
结束如果
端功能
专用功能CreateGrid（来源作为列表（GemeentePostModel））作为的WebGrid
返回新的WebGrid（来源：=来源，rowsPerPage：= 10，ajaxUpdateContainerId：=网格，defaultSort：= GemeentePostColumnsEnum.GemeenteNaam）
端功能
当我输入一些搜索值并提交表单，我得到以下错误：
一个jQuery脚本引用，需要为了使Ajax支持在的WebGrid帮手
使用的结果是：我得到了正确的过滤后的值，但我的分区（updatetargetid）没有填满
我已经添加了jQuery和不显眼的脚本，其中包括他们在我的头：
＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML＆GT;
＆LT; HEAD＆GT;
＆LT;冠军＆GT，X＆LT; /标题＆GT;
＆LT;链接HREF =/ X /内容/ Site.css相对=样式类型=文本/ CSS/＆GT;
＆LT;链接HREF =/ X /内容/主题/基/ jquery.ui.all.css相对=样式类型=文本/ CSS/＆GT;
＆LT;脚本的src =/ X /脚本/ jQuery的-1.5.1.min.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本的src =/ X /脚本/ jQuery的-UI-1.8.11.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本的src =/ X /脚本/ jquery.unobtrusive-ajax.min.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
＆LT; /头＆GT;
解决方案
您可能面临的一个问题是，其中提到jquery.unobtrusive-ajax.min.js文件是您的网页上。
如果您使用的是YSlow的还是PageSpeed，的建议之一是，CSS被放置在头部，javascript中被排在最后。
这会使你看到发生了什么（只是有它发生在我身上也一样）。
如果你的参考是在底部，在页面（或刷新）的第一次加载时，javascipt的文件尚未加载的的WebGrid助手试图开始做这件事之前，你会得到弹出信息对丢失的引用。如果您关闭它，那么分页或排序的实际工作，而此消息消失......直到你再次刷新页面。
您可以将您的脚本引用顶端，或者你可以写一个剧本的document.ready延迟处理。
I'm encountering the following problem: "A JQuery script reference is required in order to enable Ajax support in the "WebGrid" helper"
I want to make my WebGrid AJAX enabled. I got this code for the Partial View
@ModelType WebGrid
@Model.GetHtml(tableStyle:="webgrid", headerStyle:="webgrid-header", footerStyle:="webgrid-footer", alternatingRowStyle:="webgrid-alternating-row", selectedRowStyle:="webgrid-selected-row", rowStyle:="webgrid-row-style",
columns:=Model.Columns(Model.Column(
columnName:=GemeentePostColumnsEnum.NISCode.ToString()),
Model.Column(columnName:=GemeentePostColumnsEnum.GemeenteNaam.ToString()),
Model.Column(columnName:=GemeentePostColumnsEnum.DistrictNaam.ToString()),
Model.Column(columnName:=GemeentePostColumnsEnum.PostCode.ToString()),
Model.Column(columnName:=GemeentePostColumnsEnum.PostNaam.ToString()),
Model.Column(
format:=@@<text>@Ajax.ActionLink("Edit", "AddEdit", New With {.NISCode = item.NISCode}, New AjaxOptions With {.UpdateTargetId = "formGemeentePost", .InsertionMode = InsertionMode.Replace, .HttpMethod = "GET", .OnFailure = "failure"})</text>)))
And this code for the controller:
Function SearchForm(searchModel As GemeentePostWebService.GemeentePostCriteria) As PartialViewResult
searchModel.Taalcode = "nl"
'Code to fill up Model
ViewBag.WebGrid = CreateGrid(viewModelList)
Return PartialView("Partial/_Grid", ViewBag.WebGrid)
End If
End Function
Private Function CreateGrid(source As List(Of GemeentePostModel)) As WebGrid
Return New WebGrid(source:=source, rowsPerPage:=10, ajaxUpdateContainerId:="grid", defaultSort:=GemeentePostColumnsEnum.GemeenteNaam)
End Function
When I enter some search values and submit the form, I get the following error:
"A JQuery script reference is required in order to enable Ajax support in the "WebGrid" helper"
With as result: I got the right filtered values, but my div (updatetargetid) isn't filled up.
I already added the jQuery and unobtrusive scripts and included them in my header:
<!DOCTYPE html>
<html>
<head>
<title>X</title>
<link href="/X/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="/X/Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<script src="/X/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="/X/Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script>
<script src="/X/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>
</head>
解决方案
An issue you could be facing is where the reference to the "jquery.unobtrusive-ajax.min.js" file is on your page.
If you're using YSlow or PageSpeed, one of the suggestions is that css gets placed in the head, javascript gets placed at the bottom.
This causes what you're seeing to happen (just had it happen to me as well).
If your reference is at the bottom, on the first load of the page (or a refresh), the javascipt file is not loaded yet before the WebGrid helper tries to start doing it's thing, and you'll get the popup message about the missing reference. If you dismiss it, then paging or sorting actually works, and the message goes away...until you refresh the page again.
You can either move your script reference to the top or you can write a document.ready script to delay processing.
