3

ビュー ページに表示する、異なる部分ビューにそれぞれ 2 つの WebGrid があります。すべて正常に動作していますが、WebGrid で並べ替えまたはページ付けを行うと、ajax を介して更新されません。私は何を間違っていますか?

PartialView1 :

<%@ 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>

PartialView2

<%@ 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>

メインページ:

<%@ 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 タグの内容:

<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: $(...).parent(...).delegate は関数ではありません

コード上:

$(containerId).parent().delegate(containerId + ' a[data-swhglnk="true"]', 'click', function()

上記のコードは、WebGrid によって動的に生成されます。私はそれを書いていません。

4

3 に答える 3

1

申し分なく私は問題を知っていますが、私は新しいです。そのため、これをまとめるには少し時間がかかります。問題は、部分的なビューが原因で、並べ替えと伝播のイベント リスナーがリッスンを停止することです。Jquery を使用して複数ページのテーブルを設定しようとすると、これと同じ問題が発生します。ページを切り替えると、リスナーが切断されます。これは、Jquery 内で発生しており、他の利点の中でもとりわけ重要です。これはセキュリティ上の理由から行われるため、変更しないでください。したがって、今のところ、これを回避する方法は 2 つあります。1 つ目は、アタッチが必要になるたびにコールバックを介して再接続することです。2 つ目は、リスニングの責任をサブクラスに落とし込むことです。

答えとともに例を投稿しますが、報奨金はもうすぐです。いずれにせよ、興味がある場合はお知らせください。コードはすぐに入手できます。

于 2013-02-28T07:05:04.803 に答える
1

jQuery が含まれていて、jQuery も参照している場合webgrid、jQuery は 2 回定義されます。それはあなたのエラーを説明します:

$(containerId).parent().delegate(containerId + ' a[data-swhglnk="true"]', 'click', function()

ウェブページのリンクを無効にすると、機能するはずです。jQuery 1.9+ をwebgrid使用する必要があり、古いバージョンの jQuery を使用している場合は、新しいバージョンに置き換えてください。

jQuery 1.9+ と互換性がない場合、エラーが発生する可能性がwebgridあります。コメントを残して、さらにヘルプを得てください。

ヒント: 複数の jQuery インクルードについて、最終的に生成された HTML を確認してください。

于 2013-02-21T11:17:41.480 に答える
1
try this
$(containerId).parent.delegate(containerId + ' a[data-swhglnk="true"]', 'click', function()
于 2013-02-22T11:59:56.863 に答える