MVC 4 WebGrid和Jquery产生两个错误。 在jjax模型更改后，JQuery未定义并且排序错误

在我的div元素里面我正在更新是一个带有webgrid的页面部分，当我指定ajaxUpdateContainerId：在webgrid构造函数中我得到错误：

JavaScript运行时错误：’jQuery’未定义

这是生成的错误引用的javascript：

 (function($) { $.fn.swhgLoad = function(url, containerId, callback) { url = url + (url.indexOf('?') == -1 ? '?' : '&') + '__swhg=' + new Date().getTime(); $('
').load(url + ' ' + containerId, function(data, status, xhr) { $(containerId).replaceWith($(this).html()); if (typeof(callback) === 'function') { callback.apply(this, arguments); } }); return this; } $(function() { $('table[data-swhgajax="true"],span[data-swhgajax="true"]').each(function() { var self = $(this); var containerId = '#' + self.data('swhgcontainer'); var callback = getFunction(self.data('swhgcallback')); $(containerId).parent().delegate(containerId + ' a[data-swhglnk="true"]', 'click', function() { $(containerId).swhgLoad($(this).attr('href'), containerId, callback); return false; }); }) }); function getFunction(code, argNames) { argNames = argNames || []; var fn = window, parts = (code || "").split("."); while (fn && parts.length) { fn = fn[parts.shift()]; } if (typeof (fn) === "function") { return fn; } argNames.push(code); return Function.constructor.apply(null, argNames); } })(jQuery); 

这是我的主页：

 @model IEnumerable @{ ViewBag.Title = "Index"; } @Html.Partial("_SubMenu") 
Index
 
 @Html.ActionLink("Add Lab", "Create", "Lab", new { patientId = ViewBag.PatientId }, null) 
 
 @Html.Partial("_Completed", Model) 
 @section Scripts { @Scripts.Render("~/bundles/jqueryval") @Scripts.Render("~/bundles/sitespec") 

}

部分：

 @model IEnumerable @{ var grid = new WebGrid(Model, ajaxUpdateContainerId: "labs", defaultSort: "Name"); } @grid.GetHtml(columns: grid.Columns( grid.Column("Name"), grid.Column("Given", header: "Date"), grid.Column("TimeGiven", header: "Time"), grid.Column("Value"), grid.Column("Phase"), grid.Column("PatientId"), grid.Column("", format: @@Ajax.ActionLink("Disable", "Disable", new { labid = item.Id, patientid = ViewBag.PatientId }, new AjaxOptions { HttpMethod="POST", UpdateTargetId = "labs"})) ) ) 

如果我从webgrid构造函数中删除ajaxUpdateContainerId，则错误消失。 但是当我点击排序时，我得到一个404寻找我的控制器动作。 为什么要在排序中寻找我的控制器动作？

第二个问题是如果我使用ajax修改部分，在禁用，排序停止工作。 如果我在html.actionlink中替换排序继续工作。

我有jquery 1.9.1。 有任何想法吗？

Answer 1

问题是JavaScript解释器运行由引用jQuery的WebGrid生成的脚本。 但是当时没有加载jQuery ，所以你看到’jQuery’是未定义的消息。 像Sheep建议的那样在头文件（ @Scripts.Render ）中加载jQuery脚本可以解决问题。

但是，我想知道这是否真的是微软的意图，因为他们默认在页面底部加载jQuery。 这通常有助于避免延迟页面显示。

Answer 2

你解决了吗？ 我在IE中遇到了同样的问题，我能够修复它。 我必须将我定义的所有脚本/ css（我的_Layout.cshtml中 ）移动到bundle（ BundleConfig.cs ）中，这似乎解决了这个问题。

      @Styles.Render("~/Content/css") @Scripts.Render("~/bundles/modernizr") @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jqueryui")  

Answer 3

我使用MVC 4 VS2012遇到同样的问题，我的问题是我必须将我的@ Scripts.Render指令移到我的_Layout.cshtml的顶部。 这解决了这个问题

是否有可能@ Scripts.Render指令将jQuery javascript文件放在jqGrid文件之后？ 如果您在浏览器中单击“查看源代码”并查看页面中包含javascript文件的顺序，则可以看到这一点。

jQuery代码库必须始终放在jqGrid库之前，这是在不是这种情况时获得的典型错误消息。