如何使用mvc中的next和prev锚链接显示详细信息

时间:2014-12-17 11:55:30

标签: asp.net-mvc

我是mvc的新手,想要知道如何使用上一个和下一个锚标记显示记录的详细信息,当用户点击下一个,然后应显示id 2的详细信息,然后再次点击下一步然后详细说明3应该显示。我怎么能坚持到这里来实现这个功能。我到目前为止所做的尝试请帮助。

view 
@model Webapp.Models.Person

<div class="navi-but">
                            <a href="#"><span class="previous">Previous</span></a>
                        <a href="#"><span style="padding-right:7px">Next</span><span class="next"></span></a>
</div>
<div>

    <hr />
    <dl class="dl-horizontal">
        <dt>
            @Html.DisplayNameFor(model => model.PersonName)
        </dt>

        <dd>
            @Html.DisplayFor(model => model.PersonName)
        </dd>

        <dt>
            @Html.DisplayNameFor(model => model.Description)
        </dt>

        <dd>
            @Html.DisplayFor(model => model.Description)
        </dd>


    </dl>
</div>
<p>
    @Html.ActionLink("Edit", "Edit", new { id = Model.PersonId }) |
    @Html.ActionLink("Back to List", "Index")
</p>


Controller
public ActionResult Details(int? id)
        {
            if (id == null)
            {
                return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
            }
            Person personmodel = db.Persons.Find(id);
            if (personmodel == null)
            {
                return HttpNotFound();
            }
            return View(personmodel);
        }

1 个答案:

答案 0 :(得分:0)

将标签添加到标签btn next和btnprevious 并按如下方式进行ajax调用:

$("#btnNext").click(function () {
    $.ajax({
       url: 'Category/Next',
        data: { personId:cureentid  },
       success: function (response) {
        $("body").html(response);
    }
  });
 });


$("#btnPrevious").click(function () {
   $.ajax({
      url: 'Category/Previous',
      data: { personId:cureentid },
      success: function (response) {
          $("body").html(response);
      }
    });
});

public ActionResult Next(int personId )
{
   personId++;
   redirecttoactionmethod(persodetails(personId ))

}

public ActionResult Previous(int personId )

{

      personId--;
   redirecttoactionmethod(persodetails(personId ))

}