Javascript 在局部视图内渲染的WebGrid将引发“；jQuery未定义”&引用，尝试执行基于ajax的分页或筛选时

我正在开发一个asp.net mvc5 web应用程序。我有以下几点：- 1.包含@

Html.Action

的主视图，该视图调用返回部分视图的操作方法。 2.在局部视图中，我定义了一个web网格。 3.如果我在局部视图的webgrid内单击“显示详细信息”链接，将显示一个模式弹出窗口，在模式弹出窗口内，我将有另一个web网格。 我面临的问题是，如果我尝试在模式弹出窗口中呈现的web网格内执行基于Ajax的排序或分页，我将得到以下错误：-

"jQuery is not defined".

主要观点如下：-

@Html.Action("GetStaffSkill", "Staff", new  {staffmasterdetails = Model.SkillID})

上述@Html.Action将调用以下操作方法：-

public ActionResult GetStaffSkill(.....)
  {


      var records = new PagedList<Staff>();
    //codegoes here
      return PartialView("_gridstaff",records);
  }

那么，有人能告诉我如何强制jQuery保持活动状态并理解从@Html.Action呈现的部分视图吗

---

谢谢

页面代码是从上到下执行的。JQuery

脚本.Render

可能位于布局的底部

要解决这个问题，您可以将其移动到布局cshtml页面的顶部

但我不知道这是否是更好的解决方案，因为页面底部的渲染脚本可以防止延迟页面显示

              <div class="well">


    <div style="margin-top:17px;">
        @{
        var grid = new WebGrid(
                    canPage: true,
                    rowsPerPage: Model.PageSize,
                    canSort: true,
                    ajaxUpdateContainerId: "grid", fieldNamePrefix: "staff");

        grid.Bind(Model.Content, rowCount: Model.TotalRecords, autoSortAndPage: false);
        grid.Pager(WebGridPagerModes.All);

        @grid.GetHtml(htmlAttributes: new { id = "grid" },   // id for ajaxUpdateContainerId parameter
        fillEmptyRows: false,
        tableStyle: "table table-bordered table-hover",
        mode: WebGridPagerModes.All,
        columns: grid.Columns(

          grid.Column("Skill",canSort:false,format:

             @<text>


<a data-modal='' href="@Url.Action("ShowDetails", "Skill", new {skillmasterDetail= item.StaffID, skillsummaryView=true })   "   title='show detials'>  
Show Details</a>

$(document).ready(function () {

    $(function () {
        $.ajaxSetup({ cache: false });
        //$("a[data-modal]").on("click", function (e) {
            $(document).on('click', 'a[data-modal]', function (e){
            $('#myModalContent').css({ "max-height": screen.height * .82, "overflow-y": "auto" }).load(this.href, function () {
                $('#myModal').modal({
                    //height: 1000,
                    //width: 1200,
                    //resizable: true,
                    keyboard: true,
                    backdrop: 'static',
                    draggable: true
                }, 'show').draggable({
                    handle: ".modal-header"
                });
                $('#myModalContent').removeData("validator");
                $('#myModalContent').removeData("unobtrusiveValidation");
                $.validator.unobtrusive.parse('#myModalContent');
                bindForm(this);
              $("input[data-autocomplete-source]").each(function () {
                  var target = $(this);
                    target.autocomplete({
                        source: target.attr("data-autocomplete-source"), minLength: 1, delay: 1000, appendTo: $("#myModal")



                   });

                });
            });
            return false;
        });


    });