调用的过程是,通过Jquery注册单击事件,当单击分部视图中的按钮,就取得分部视图中文本框的值,然后调用$.Get()函数以Get形式调用控制器SearchPeople方法,参数为searchText=searhTerm,如果成功,返回一个匿名回调函数,返回结果更新#people-data元素。

实际上也可以使用$("#people-data").load("SearchPeople",{ searchText: searchTerm })。但是jquery load()方法的传递方式是根据参数data来自动决定,如果没有参数传递,则采用get方式传递,如果有参数传递,则会自动转换为post。

1、主视图:Index.cshtml

@model IEnumerable<BootstrapMVC30Days.Models.Person>

@{
ViewBag.Title = "Index";
}

@{ Html.RenderPartial("PersonSearchForm");}    //插入分部视图@{Html.RenderPartial("PartialView");}
<div id="people-data">
@Html.DisplayForModel(Model)
</div>

@section scripts
{
<script type="text/javascript">
$(function () {
$("#search-btn").click(function () {
var searchTerm = $("#search-text").val();
$.get("SearchPeople", { searchText: searchTerm })
.success(function (data) {
$("#people-data").html(data);
});
});
});
</script>
}

2、分部视图 _PersonSearchForm.cshtml

<hr />
<div class="container">
<div class="pull-right">
<form class="form-inline" role="form">
<div class="form-group">
<label class="sr-only" for="search-text">Email Address</label>
<input type="text" class="form-control" id="search-text" placeholder="请输入查询文字" />
</div>
<button type="button" class="btn btn-success" id="search-btn">查询</button>   //不能使用submit,也就是说不能使用<input type="submit"/>或<button type="submit" ></button> 。因为当点击鼠标的话,这样就相当于提交表单,访问Person主视图所在的控制器了。而文档框中没有值。也可以这样submit, 脚本这样写,

$("#search-btn").click(function (e) {
e.preventDefault();
//....

3、控制器方法

// GET: Person
public ActionResult Index()
{
return View(_people);
}

///返回部分视图

public ActionResult SearchPeople(string searchText)
{
var term = searchText.ToLower();
var result = _people
.Where(p => p.FirstName.ToLower().Contains(term) ||
p.LastName.ToLower().Contains(term));

return PartialView("_SearchPeople", result);
}

.netFramework 和SQL 对于空值的处理是不一样的。.net返回所有行,SQL Server 或者EF 返回零行。

the .NET Framework implementation of the Contains method returns all rows when you pass an empty string to it, but the Entity Framework
provider for SQL Server Compact 4.0 returns zero rows for empty strings.

Ajax 异步查询 ,刷新页面的一部分的更多相关文章

  1. Ajax 异步局部刷新

    Ajax 异步局部刷新 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页 ...

  2. Ajax 实现无刷新页面

    注意:如本文所用,在前面的文章库的数目可以在源代码中找到,我将指示在文本,其中链路,为了缩短制品的长度,阅读由此带来的不便.乞求被原谅. 评论文章 Ajax 实现无刷新页面.其原理.代码库.代码. 这 ...

  3. 解决Ajax.BeginForm还是刷新页面的问题

    在.net mvc中用Ajax.BeginForm来实现异步提交,在Ajax.BeginForm里面还是可以用submit按钮,一般来说 submit按钮是提交整个页面的数据.但是在Ajax.Begi ...

  4. PHP + JavaScript + Ajax 实现无刷新页面加载效果

    数据源工厂 Json生成方式1 Json生成方式2 数据搬运工 数据加工师 转换类型 加工展示 结果展示 初始页面 点击按钮之后 总结 今天这个实验的思路就是实现一个无刷新的页面加载效果.具体的思路是 ...

  5. jQuery 使用ajax,并刷新页面

    <script> function del_product_information(id) { $.ajax({ url: "{% url 'del_product_inform ...

  6. JSF中使用f:ajax标签无刷新页面改变数据

    ajax本是用在前端的一种异步请求数据的操作,广泛用于js中,一般的js框架如jq都有被封装好的方法,用于发起异步请求操作.异步操作可以增强用户体验和操作,越来越多的程序都在使用ajax.JSF的fa ...

  7. php ajax返回无故刷新页面

    1 前言 一个php页面,里面两个$.POST请求,一个会刷新页面,一个不会,然后就拉出来研究一下了,仅作为记录使用. 2 代码 HTML代码: <input value="查找&qu ...

  8. Ajax异步打开新页面弹框被拦截,无法将参数值传递到后台

    一.Form提交,打开新页面被拦截 手动触发Form提交打开新页面是不会被拦截的,但是如果通过Ajax异步处理回调后再程序自动触发Form提交的话,就会被浏览器当成广告弹框拦截 1.暂时的解决办法:如 ...

  9. js(三) ajax异步局部刷新技术底层代码实现

    ajax 异步 javaScript and xml 开发五步骤: 1. 创建对象 XMLHttpRequest(chrome,firefox) ie... jquery 2. 找到连接, http的 ...

  10. ajax用get刷新页面元素在IE下无效解决~~

    总结一下解决办法: 在IE下用Ajax请求某一页面,通常会因为缓存的原因而返回上一次的结果,造成混乱,[即get方式时,获取数据,因发送参数和地址都一致,故IE浏览器会从缓存中取,而不会去请求服务器端 ...

随机推荐

  1. iOS 混合变换旋转 CGAffineTransform

    在ios 中, Core Graphics 提供了一系列的函数可以在一个变换的基础上做深层次的变换,如果做一个既要缩放又要旋转的变换,以下的方法比较实用. CGAffineTransformScale ...

  2. HDU 1558

    输入线段的两个短点,如果线段相交那么他们属于一个集合,查看第i条线段所在的集合有几条线段. 好久没码码了,总是各种蠢. 首先找出两条直线的方程,求解相交点的横坐标,然后看是不是在线段内部. 没有注意题 ...

  3. 2017icpc乌鲁木齐网络赛Colored Graph (构造)

    题目 https://nanti.jisuanke.com/t/16958 题意 给定一个n(n<=500)个点的无向图,给每条边黑白染色,输出同色三角形最少的个数和对应的方案 分析 首先考虑给 ...

  4. java基础 4 继承(1)访问权限与作用域

    作用域与可见性 当前类 同一package 子类 其他package public √ √ √ √ protected √ √ √   defalut √ √     private √      

  5. 元数据的概念以及相关的操作os模块、shutil模块

    查看文件的元数据 stat [OPTION]… FILE… OPTION: -f 输出文件系统的状态,而非文件的状态 -t 显示简要格式的文件元数据信息 FILE:可同时查看多个文件的元数据信息,多个 ...

  6. ln 软连接 & 硬连接

    创建软连接的方式 #ln -s soure /file object 创建软连接是连接文件本身,可以跨分区建立软连接,不会应为不同分区而出现不能使用的问题. 在创建软连接的文件中,修改一处文件另一处同 ...

  7. Zookeeper中的FastLeaderElection选举算法简述

    Zookeeper是一个开源的分布式应用协调项目, 当中为了保证各节点的协同工作,Zookeeper在工作时须要有一个Leader. 而Leader是怎样被选举出来的?Zookeep中使用的缺省算法称 ...

  8. 【Android开发-4】进入实践,最喜欢折腾的计算器

    前言:前面对项目文件有了感性认识.接下来我们就须要通过不断实践,对项目的文件有理性的认识. 曾经折腾Unity3d.IOS开发都是拿计算器开刀.所以这次Android开发实践也不例外,继续拿计算器折腾 ...

  9. hdu 3255 Farming(扫描线)

    题目链接:hdu 3255 Farming 题目大意:给定N个矩形,M个植物,然后给定每一个植物的权值pi,pi表示种植物i的土地,单位面积能够收获pi,每一个矩形给定左下角和右上角点的坐标,以及s, ...

  10. 简单了解eMMC

    以下只是个人看法,有不妥之处,请批评指出. 参考资料:http://www.veryarm.com/1200.html 一.eMMC的发展 ROM→NorFlash→NandFlash→eMMC→UF ...