实现ajax异步查询功能,Ajax异步表单简单实现收索功能(示例代码)

异步收索的作用简单来说就是:在不更新整个网页的情况下更新你想改变的网页某个部分。

下面是实现:

1.准备工作

在mvc5 中要用Ajax,首先要添加jQuery的Ajax文件。方法:右击项目--管理NuGet程序包--查找jQuery--找到关于Ajax的,然后安装。

2。 Index.页面

@model IEnumerable

@{

Layout = "~/Views/Shared/_Layout.cshtml";

}

@using (Ajax.BeginForm("Indec","Home", //方法和控制器

new AjaxOptions //怎么实现Ajax功能

{

InsertionMode = InsertionMode.Replace, //覆盖

HttpMethod = "Get",

UpdateTargetId = "serch", //目标:id为search的元素

}))

{

}

@*将要刷新的页面弄成partial页面,否则会将整个页面又放在这个地方*@

@Html.Partial("Index1",Model)

3.控制器

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

using ajax异步.Models;

namespace ajax异步.Controllers

{

public class HomeController : Controller

{

// GET: Home

private dbcontext db = new dbcontext();

public ActionResult Index( string idd)

{

if (Request.IsAjaxRequest()) //如果是Ajax请求,也就是点了查询,那么返回查询的数据

{

var people = from m in db.ajax

where m.id.ToString() == idd

select m;

return PartialView("Index1", people);//返回要更新的partial页面

}

else//第一次不是Ajax请求,返回数据库的全部数据

{

return View(db.ajax.ToList());

}

}

}

}

4,partial页面

@model IEnumerable

idname

@foreach (var item in Model)

{

@Html.DisplayFor(c => item.id)@Html.DisplayFor(c => item.name)

}

实现的方式很简单  主要就是Ajax辅助方法   然后安装要用的jQuery文件   最后把要更新的部分设置为partial页面