0

asp.net mvc 内に PagedList.mvc ページング ライブラリをインストールしました。次のスクリプトを追加しました:-

var getPage = function () {
    var $a = $(this);
    var options = {
        url: $a.attr("href"),
        type: "get"
    };
    $.ajax(options).done(function (data) {
        var target = $a.parent("div.pagedList").attr("data-tms-target");
        $(target).replaceWith(data);
    });
    return false;
};



$(".main-content").on("click", ".pagedList a", getPage);

メインビューは次のようになります:-

@model IPagedList<TMS.Models.AuditInfo>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<div id="AuditTable">
@Html.Partial("_AuditTable", Model)
    </div>

_AuditTable 部分ビューは次のとおりです。

  @model IPagedList<TMS.Models.AuditInfo>
    <div class="row-fluid sortable" >       
    <div class="box span12">
    <div class="box-header well" data-original-title id="auditlist">
    <h2><i class="icon-home"></i> Audit Info </h2>
    <div class="box-icon">
    <a href="#" class="btn btn-setting btn-round"><i class="icon-cog"></i></a>
    <a href="#" class="btn btn-minimize btn-round"><i class="icon-chevron-up"></i></a>
    <a href="#" class="btn btn-close btn-round"><i class="icon-remove"></i></a>
    </div><div class="box-content">
     <div class="pagedList" data-tms-target="#AuditTable">
      @Html.PagedListPager(Model , page => Url.Action("Index",new { page }),
                            PagedListRenderOptions.ClassicPlusFirstAndLast)

                            </div>
        <table class="table table-striped table-bordered bootstrap-datatable datatable">
                              <thead>
                                  <tr>
           <th>
                User Name
            </th>
            <th>
                Audit Action
            </th>
            <th>
                Technology Type
            </th>
            <th>
                Technology
            </th>
            <th>
                Date Time Start
            </th>
            <th>
                Date Time End
            </th>
        </tr>
     </thead>
        <tbody>
              @foreach (var item in Model) {
        <tr>

            <td>
                @item.UserName
            </td>
            <td>
                @(item.AuditAction == null ? "None" : item.AuditAction.Name)
            </td>
            <td>
                @(item.TechnologyType == null ? "None" : item.TechnologyType.Name)
            </td>
            <td>
                @Html.DisplayTextFor(_ => item.Technology.TechnologyID).ToString()
            </td>
            <td>
                @Html.DisplayFor(model=>item.DateTimeStart)
            </td>
             <td>
                @Html.DisplayFor(model=>item.DateTimeStart)
            </td>
        </tr>
    }

    </tbody>
    </table>
    </div></div></div>

しかし、問題は、ページのリンクをクリックしても何も起こらないことです.リンクのhrefは正しいリンクを指していますが、リンクをクリックしても何も読み込まれません.リンクを右クリックすると開くをクリックするとページが開きます。どうすればこの問題を克服できますか?

最後に、アクションメソッドは次のとおりです:-

public ActionResult Index(int page = 1)
        {
             var audit = auditinfoRepository.AllIncluding(auditinfo => auditinfo.Technology,auditinfo2=>auditinfo2.TechnologyType,auditinfo3=>auditinfo3.AuditAction).OrderByDescending(a=>a.DateTimeStart)
                .ToPagedList(page,30);
             if (Request.IsAjaxRequest())
             {
                 ViewBag.FromSearch = true;
                 return PartialView("_AuditTable", audit);
             }
             return View(audit);
        }
4

1 に答える 1

0

デフォルトでは、ASP.NET MVC 3 は控えめな jquery をすべてのAjax.*ヘルパーで使用します。したがって、すべての MicrosoftAjax スクリプト (この役に立たない c**p) を取り除くことから始めて、代わりに次のものを配置します。

<script src="@Url.Content("~/Scripts/jquery-1.5.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

次に、web.config で目立たない AJAX を有効にするだけです (まだ行っていない場合)。

<appSettings>
    <add key="ClientValidationEnabled" value="true"/> 
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/> 
</appSettings>

jquery は、これらの HTML 5data-*属性を含むすべてのリンクを目立たないように AJAX 化します。

于 2013-07-15T04:16:58.863 に答える