Fatal编程技术网
  • ajax/
  • 部分视图中的Asp.net MVC WebGrid未通过Ajax更新

部分视图中的Asp.net MVC WebGrid未通过Ajax更新

ajax asp.net-mvc-3 jquery

部分视图中的Asp.net MVC WebGrid未通过Ajax更新,ajax,asp.net-mvc-3,jquery,webgrid,Ajax,Asp.net Mvc 3,Jquery,Webgrid,我有两个WebGrids，每个位于不同的局部视图中，显示在视图页面上。一切正常，但当我在WebGrid上进行排序或分页时，它不会通过ajax进行更新。我做错了什么 部分视图1： <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IEnumerable<CRMEvent.Models.CRM.DatabaseEntities.CRM_Request>>" %> <%

我有两个WebGrids，每个位于不同的局部视图中，显示在视图页面上。一切正常，但当我在WebGrid上进行排序或分页时，它不会通过ajax进行更新。我做错了什么

部分视图1：

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IEnumerable<CRMEvent.Models.CRM.DatabaseEntities.CRM_Request>>" %>
<%    
  var grid1var = new WebGrid(source: Model, defaultSort: "Id", fieldNamePrefix: "grid1", canSort: true, ajaxUpdateContainerId: "Div1", canPage: true, rowsPerPage: 5);%>
  <div id="Div1">
  <%=grid1var.GetHtml(htmlAttributes: new { id = "grid1" }, tableStyle: "GridTable", headerStyle: "GridHeader", footerStyle: "GridFooter",
  columns: grid1var.Columns(
  grid1var.Column(columnName: "Id", header: "ID", canSort: true),
  grid1var.Column(columnName: "Request_For_Id", header: "Request For", canSort: true),
  grid1var.Column(columnName: "Date_Created", header: "Date", canSort: true, format: item => item.Date_Created.ToString("dd-MM-yyyy"))
))%>
  </div>


item.Date_Created.ToString（“dd-MM-yyyy”））
))%>
部分视图2

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IEnumerable<CRMEvent.Models.CRM.DatabaseEntities.CRM_Request>>" %>
<%    
  var grid2var = new WebGrid(source: Model, defaultSort: "Id", fieldNamePrefix: "grid2", canSort: true, ajaxUpdateContainerId: "Div2", canPage: true, rowsPerPage: 5);%>
  <div id="Div2">
  <%=grid2var.GetHtml(htmlAttributes: new { id = "grid2" }, tableStyle: "GridTable", headerStyle: "GridHeader", footerStyle: "GridFooter",
  columns: grid2var.Columns(
  grid2var.Column(columnName: "Id", header: "ID", canSort: true),
  grid2var.Column(columnName: "Request_For_Id", header: "Request For", canSort: true),
  grid2var.Column(columnName: "Date_Created", header: "Date", canSort: true, format: item => item.Date_Created.ToString("dd-MM-yyyy"))
))%>
  </div>


item.Date_Created.ToString（“dd-MM-yyyy”））
))%>
主页：

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<CRMEvent.Models.CRM.DatabaseEntities.CRM_Request>" %>
<asp:Content ID="Head" ContentPlaceHolderID="HeadContent" runat="server">
<link href="../../Content/Styles/Dashboard.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="Main" ContentPlaceHolderID="MainContent" runat="server">
    <%using (Html.BeginForm("Action", "Dashboard", FormMethod.Post)){ %>
    <div id="MainDashboardDiv">
      <div class="LiveTile">
        <div id="PriorityDiv1">
          <%Html.RenderAction("RecentRequests", Model); %>
        </div>  <!--End of PriorityDiv1 -->
        <div id="PriorityDiv2">
        <%Html.RenderAction("PriorityRequests", Model); %>
        </div>  <!--End of PriorityDiv2 -->
      </div>      <!--End of LiveTile -->
    </div><!--End of MainDashboardDiv -->
    <%} %>
</asp:Content>

<head id="head" runat="server">
    <title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
    <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
    <script src="<%: Url.Content("~/Scripts/jquery-1.9.1.min.js") %>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/modernizr-1.7.min.js") %>" type="text/javascript"></script>
    <asp:ContentPlaceholder ID="HeadContent" runat="server">
    </asp:ContentPlaceholder>      
    <link href="../../Content/menu.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery.js" type="text/javascript"></script>
    <script src="../../Scripts/menu.js" type="text/javascript"></script>
</head>
母版页标题标签内容：

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<CRMEvent.Models.CRM.DatabaseEntities.CRM_Request>" %>
<asp:Content ID="Head" ContentPlaceHolderID="HeadContent" runat="server">
<link href="../../Content/Styles/Dashboard.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="Main" ContentPlaceHolderID="MainContent" runat="server">
    <%using (Html.BeginForm("Action", "Dashboard", FormMethod.Post)){ %>
    <div id="MainDashboardDiv">
      <div class="LiveTile">
        <div id="PriorityDiv1">
          <%Html.RenderAction("RecentRequests", Model); %>
        </div>  <!--End of PriorityDiv1 -->
        <div id="PriorityDiv2">
        <%Html.RenderAction("PriorityRequests", Model); %>
        </div>  <!--End of PriorityDiv2 -->
      </div>      <!--End of LiveTile -->
    </div><!--End of MainDashboardDiv -->
    <%} %>
</asp:Content>

<head id="head" runat="server">
    <title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
    <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
    <script src="<%: Url.Content("~/Scripts/jquery-1.9.1.min.js") %>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/modernizr-1.7.min.js") %>" type="text/javascript"></script>
    <asp:ContentPlaceholder ID="HeadContent" runat="server">
    </asp:ContentPlaceholder>      
    <link href="../../Content/menu.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery.js" type="text/javascript"></script>
    <script src="../../Scripts/menu.js" type="text/javascript"></script>
</head>
另外，当我通过firebug检查控制台时，我在进行排序和分页时看到一个错误： 错误是：

TypeError:$（…）。父项（…）。委托不是函数

关于代码：

$（containerId）.parent（）.delegate（containerId+） a[data swhglnk=“true”]，“单击”，函数（）

上面的代码是由WebGrid动态生成的。我没有编写它。

如果
WebGrid
包含jQuery，并且您也引用了jQuery，那么jQuery定义了两次。这将解释您的错误：

$(containerId).parent().delegate(containerId + ' a[data-swhglnk="true"]', 'click', function()
禁用网页中的链接，它应该可以工作。如果需要使用jQuery 1.9+并且
webgrid
正在使用较旧版本的jQuery，请将其替换为较新版本

如果
webgrid
与jQuery 1.9+不兼容，可能会出现一些错误，请留下评论以获取更多帮助

提示：检查最终生成的多个jQuery包含的HTML。

好吧，我知道这个问题，但我是新来的。所以这需要我整理一下。问题是您的局部视图导致排序和传播上的事件侦听器停止侦听。如果您y使用Jquery设置多页表；当您切换页面时，您的侦听器将断开连接。这发生在Jquery内部，还有其他好处；这是出于安全原因，所以不要更改。因此，目前有两种方法可以解决此问题。第一种方法是每次需要连接时通过回调重新连接，然后第二种方法是将听力责任下放到一个子班

try this
$(containerId).parent.delegate(containerId + ' a[data-swhglnk="true"]', 'click', function()
我会将答案与示例一起发布，但bounty快到了。所以我希望有机会，如果您有兴趣，请告诉我，我很快就会收到代码。

您能告诉我们jQuery的版本号吗？您自己包括jQuery吗？@Simon，您指的是jQuery 1.9.1或用于webgrid逻辑的jQuery文件。如果您指的是jQuery 1.9.1，那么我t已经在我的VS2010中更新了，我只是在我的viewpage中添加了一个链接，如果你是指jquery文件webgrid logic，我不会这么做。webgrid自己做。你能试着在局部视图中包含你需要的脚本文件吗？@ssilas777，嘿，我已经添加了整个页面代码（使用SCcript）.嘿，我没有生成委托代码，因此没有机会编辑它。我很想知道解决方案。如果我有机会，我将非常感激。我同意我已经看到了这个问题的许多不同变体。有很多方法可以解决它，但我所看到的没有一个是干净和安全的。因此，如果我陷入困境，这就是我正在研究的问题p在计算机上，我没有忘记我正在处理它。我希望我能找到解决方案，并能帮助可能面临同样问题的其他人。@mariozski，在这种情况下，你建议我怎么做。我正因为WebGrid而陷入困境。你能试着调试你的javascript，看看$（containerId）指向什么吗？