1.首先,请在配置文件设置如下:(该项默认都存在且为true)

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

2.在你的_layout.cshtml中引入JS文件:

<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>

3.获取简单的某个值,比如ID,NAME等int,string类型:

数据实体User.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web; namespace MvcApplication1.Models
{
public class User
{
public int ID { get; set; }
public string Name { get; set; }
}
}

控制器UserController.cs:(部分代码)

      /// <summary>
/// 定义的用户仓库
/// </summary>
private List<User> _userRepository = new List<User> {
new User{ID=1,Name="ab"},
new User{ID=2,Name="bc"},
new User{ID=3,Name="cd"},
new User{ID=4,Name="ace"}
};
#region GetUserID For (获取简单的某个值)
public ActionResult UserID()
{
return View();
}
[HttpPost]
public int UserID(string name)
{
User user = _userRepository.FirstOrDefault(x => string.Equals(x.Name, name, StringComparison.CurrentCultureIgnoreCase));
if (user == null)
{
return -1;
}
return user.ID;
}
#endregion

视图UserID.cshtml:

@using MvcApplication1.Models;
@model User
@{
ViewBag.Title = "查询用户ID";
}
@using (Ajax.BeginForm("UserID", "User", new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "div_uid", InsertionMode = InsertionMode.Replace }))
{
@Html.TextBox("name")
<button type="submit" name="CX" style="width:80px; height:30px;">查询UserID</button>
}
<div id="div_uid"></div>
<!--如果是异步,则本文本框输入的值不会被刷新掉-->
<input type="text" autocomplete="off" />

如果你前面该引入的文件都引了,那么在点击查询时,

div_uid 中就会显示查询到的ID

结果如下:

4.获取用户列表,用于异步刷新列表:

注意:如果你有一个列表需要异步查询并更新查询结果,那就需要使用分布视图!也就是说你还需要一个View才可以,不可以将结果直接返回到本页!

控制器UserController.cs:(部分代码)

     #region GetUserList  (获取用户列表,用于异步刷新列表)
// GET: /User/
public ActionResult UserList()
{
var result = _userRepository;
return View(result);
}
[HttpPost]
public ActionResult UserList(string name)
{
var result = _userRepository;
if (!string.IsNullOrWhiteSpace(name))
{
result = _userRepository.Where(u => u.Name.Contains(name)).ToList();
}
return PartialView("_pview", result);
}
#endregion

主视图UserList.cshtml:

@using MvcApplication1.Models;
@model List<User>
@{
ViewBag.Title = "Index";
}
@using (Ajax.BeginForm("UserList", "User", new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "tb", InsertionMode = InsertionMode.Replace }))
{
@Html.TextBox("name")
<button type="submit" name="CX" style="width:80px; height:30px;">查询UserList</button>
}
<table>
<thead>
<tr>
<td>用户ID</td>
<td>用户名称</td>
</tr>
</thead>
<tbody id="tb">
@Html.Partial("_pview", Model)
</tbody>
</table>
<!--如果是异步,则本文本框输入的值不会被刷新掉-->
<input type="text" autocomplete="off" />

分布视图_pview.cshtml:

@using MvcApplication1.Models;
@model List<User>
@{
Layout = null;
ViewBag.Title = "_pview";
}
@foreach (User u in Model)
{
<tr>
<td>@u.ID</td>
<td>@u.Name</td>
</tr>
}

结果如下:

点击查询后:

5.好了,基本上主流的2个用法都有,希望能对大家有帮助!

MVC之Ajax.BeginForm使用详解之更新列表的更多相关文章

  1. MVC之Ajax.BeginForm使用详解之更新列表 mvc验证jquery.unobtrusive-ajax

    MVC之Ajax.BeginForm使用详解之更新列表   1.首先,请在配置文件设置如下:(该项默认都存在且为true) <add key="UnobtrusiveJavaScrip ...

  2. Ajax.BeginForm参数详解

    在Asp.Net的MVC中的语法,在Razor页面中使用,替代JQuery的Ajax使用,方便快捷. 使用Ajax.BeginForm方法会生成一个form表单,最后以Ajax的方式提交表单数据:需要 ...

  3. MVC验证09-使用MVC的Ajax.BeginForm方法实现异步验证

    原文:MVC验证09-使用MVC的Ajax.BeginForm方法实现异步验证 MVC中,关于往后台提交的方法有: 1.Html.BeginForm():同步 2.Ajax.BeginForm():异 ...

  4. [置顶] MVC输出缓存(OutputCache参数详解)

    1.学习之前你应该知道这些 几乎每个项目都会用到缓存,这是必然的.以前在学校时做的网站基本上的一个标准就是1.搞定增删改查2.页面做的不要太差3.能运行(ps真的有这种情况,答辩验收的时候几个人在讲台 ...

  5. MVC输出缓存(OutputCache参数详解)

    版权声明:本文为博主原创文章,未经博主允许转载随意. https://blog.csdn.net/kebi007/article/details/59199115 1.学习之前你应该知道这些 几乎每个 ...

  6. Asp.Net MVC学习总结之过滤器详解(转载)

    来源:http://www.php.cn/csharp-article-359736.html   一.过滤器简介 1.1.理解什么是过滤器 1.过滤器(Filters)就是向请求处理管道中注入额外的 ...

  7. $.ajax()所有参数详解

    原文:https://www.cnblogs.com/everest33Tong/p/6159700.html [一]$.ajax()所有参数详解 url: 要求为String类型的参数,(默认为当前 ...

  8. ajax方法参数详解与$.each()和jquery里面each方法的区别

    JQuery中$.ajax()方法参数详解 url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为g ...

  9. Asp.Net MVC part2 View、Controller详解

    View详解Razor视图引擎简介HtmlHelper强类型页面 Razor视图引擎简介强大的@:表示使用C#代码,相当于aspx中的<%%>可以完成输出功能当遇到html标签时会认为C# ...

随机推荐

  1. Icinga使用总结

    1. 在定义命令的时候,往往需要修改commands.cfg配置文件,如果使用NPRE插件监控远程服务器,其实,定义命令也没这么复杂 commands.cfg中有关check_nrpe的命令定义如下: ...

  2. C算法编程题(二)正螺旋

    前言 上一篇<C算法编程题(一)扑克牌发牌> 写东西前总是喜欢吐槽一些东西,还是多啰嗦几句吧,早上看了一篇博文<谈谈外企涨工资那些事>,里面楼主讲到外企公司包含的五类人,其实不 ...

  3. SQL Server安全(11/11):审核(Auditing)

    在保密你的服务器和数据,防备当前复杂的攻击,SQL Server有你需要的一切.但在你能有效使用这些安全功能前,你需要理解你面对的威胁和一些基本的安全概念.这篇文章提供了基础,因此你可以对SQL Se ...

  4. Elasticsearch 教程--分布式集群

    集群 补充章节 正如前文提到的,这就是第个补充的章节,这里会介绍 Elasticsearch 如何在分布式环境中运行. 本章解释了常用术语,比如 集群 (cluster), 节点 (node) 以及  ...

  5. MacOS使用AMPPS环境

      下载(http://www.ampps.com/download)并安装AMPPS 基本配置:2.1选中所有扩展2.2 变更PHP版本为5.3 配置虚拟主机(Virtual Hosts) AMPP ...

  6. Nancy之Forms authentication的简单使用

    一.前言 想必大家或多或少都听过微软推出的ASP.NET Identity技术,可以简单的认为就是一种授权的实现 很巧的是,Nancy中也有与之相类似的技术Authentication,这两者之间都用 ...

  7. 分页控件layui的使用

    $.getJSON( )的使用方法简介 $.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] ) url是必选参数,表示json ...

  8. html5 前端图片处理(预览、压缩、缩放)

    现在手机图片是越来越大了,上传图片流量耗费巨大.同时预览也是一个问题,所以利用HTML5 file和canvas来解决这个问题. var upload = { _o: null,//对象id _aut ...

  9. CSS画猪

    效果查看:http://hovertree.com/texiao/css3/6/ CSS3画猪头: http://hovertree.com/texiao/css3/6/1/ 代码如下: <!D ...

  10. Error LNK1104 cannot open file 'libboost_system-vc140-mt-gd-1_58.lib'

    I had a similar problem when trying to use boost unit testing in Visual Studio 2015 (Community Editi ...