在ASP.NET MVC中使用
-Microsoft ASP.NET Ajax
-jQuery
Ajax的使用范围
-适合Ajax的场景
-不适合Ajax的场景
Ajax软肋:
不保存Http状态,没有回退,状态保留
不支持JavaScript脚本
Ajax成瘾症
Ajax使用实例
-每个Ajax请求都会制定确定的Action
-Action会判断是否来自Ajax
-针对Ajax请求必须返回一个特殊的View
脚本启用问题
<%using (Ajax.BeginForm(“HelloAjax”,
new AjaxOptions{ UpdateTargetId= “results” }))
{ %>
<%= Html.TextBox(“query”, null, new {size=40}) %>
<input type=”submit” />
<%} %>
<div id=”results”></div>
<script src=”/Scripts/MicrosoftAjax.js” type=”text/javascript”></script>
<script src=”/Scripts/MicrosoftMvcAjax.js” type=”text/javascript”></script>
写在低下,页面先加载后加载脚本
加载是阻塞模式,后加载脚本好 //小技巧
Action
public string HelloAjax(string query)
{
return “You entered: “ + query;
}
<form action="/Home/HelloAjax" method="post"
onsubmit=”Sys.Mvc.AsyncForm.handleSubmit(this, new Sys.UI.DomEvent(event),
{ insertionMode: Sys.Mvc.InsertionMode.replace,
updateTargetId:'result'});">
js禁用咋办?
解决脚本启用问题
x-requested-with: XMLHttpRequest
query=Hello%20Ajax!&X-Requested-With=XMLHttpRequest
检查是否有x-requested-with
public ActionResultHelloAjax(string query)
{
//确认请求来自于ajax
string isAjaxPost= Request.Form[“X-Requested-With”] ??
Request.Headers[“X-Requested-With”];
if (!String.IsNullOrEmpty(isAjaxPost))
{return Content(“You entered: “ + query);} //ajax
return RedirectToAction(“Index”, new { query = query }); //http请求
}}
//有魔术字[“X-Requested-With”] ,应该用函数封装
//make sure this is an Asynchpost
if (Request.IsAjaxRequest())// 这是微软自带的
{
return Content(“You entered: “ + query);
}
else
{
return RedirectToAction(“Index”, new { query = query });
}
}
使用PrtialView返回
[<%if(ViewData.Model.Count>0){ %>
<table cellpadding=”5”>
<tr><td><b>Product</b></td>
<td><b>Price</b></td></tr>
<%foreach(MVCAjax.Models.Productp in ViewData.Model)
{ %>
<tr><td><%= Html.Encode(p.ProductName) %></td>
<td><%= p.UnitPrice%></td></tr>
<%} %>
</table>
<%} %>
PartialView返回
IList<Product> products = new List<Product>();
if(!String.IsNullOrEmpty(query)){
NorthwindDataContextdb= new NorthwindDataContext();
varproducts = from p in db.Products
where p.ProductName.StartsWith(query)
select p).ToList();
}
if(Request.IsAjaxRequest())
{return View(“ProductSearchResults”, products);
}else{
return View(products);
}
<div id=”results”><%Html.RenderPartial(“ProductSearchResults”, ViewData.Model); %></div>
2011-4-22 23:54 danny
-Microsoft ASP.NET Ajax
-jQuery
Ajax的使用范围
-适合Ajax的场景
-不适合Ajax的场景
Ajax软肋:
不保存Http状态,没有回退,状态保留
不支持JavaScript脚本
Ajax成瘾症
Ajax使用实例
-每个Ajax请求都会制定确定的Action
-Action会判断是否来自Ajax
-针对Ajax请求必须返回一个特殊的View
脚本启用问题
<%using (Ajax.BeginForm(“HelloAjax”,
new AjaxOptions{ UpdateTargetId= “results” }))
{ %>
<%= Html.TextBox(“query”, null, new {size=40}) %>
<input type=”submit” />
<%} %>
<div id=”results”></div>
<script src=”/Scripts/MicrosoftAjax.js” type=”text/javascript”></script>
<script src=”/Scripts/MicrosoftMvcAjax.js” type=”text/javascript”></script>
写在低下,页面先加载后加载脚本
加载是阻塞模式,后加载脚本好 //小技巧
Action
public string HelloAjax(string query)
{
return “You entered: “ + query;
}
<form action="/Home/HelloAjax" method="post"
onsubmit=”Sys.Mvc.AsyncForm.handleSubmit(this, new Sys.UI.DomEvent(event),
{ insertionMode: Sys.Mvc.InsertionMode.replace,
updateTargetId:'result'});">
js禁用咋办?
解决脚本启用问题
x-requested-with: XMLHttpRequest
query=Hello%20Ajax!&X-Requested-With=XMLHttpRequest
检查是否有x-requested-with
public ActionResultHelloAjax(string query)
{
//确认请求来自于ajax
string isAjaxPost= Request.Form[“X-Requested-With”] ??
Request.Headers[“X-Requested-With”];
if (!String.IsNullOrEmpty(isAjaxPost))
{return Content(“You entered: “ + query);} //ajax
return RedirectToAction(“Index”, new { query = query }); //http请求
}}
//有魔术字[“X-Requested-With”] ,应该用函数封装
//make sure this is an Asynchpost
if (Request.IsAjaxRequest())// 这是微软自带的
{
return Content(“You entered: “ + query);
}
else
{
return RedirectToAction(“Index”, new { query = query });
}
}
使用PrtialView返回
[<%if(ViewData.Model.Count>0){ %>
<table cellpadding=”5”>
<tr><td><b>Product</b></td>
<td><b>Price</b></td></tr>
<%foreach(MVCAjax.Models.Productp in ViewData.Model)
{ %>
<tr><td><%= Html.Encode(p.ProductName) %></td>
<td><%= p.UnitPrice%></td></tr>
<%} %>
</table>
<%} %>
PartialView返回
IList<Product> products = new List<Product>();
if(!String.IsNullOrEmpty(query)){
NorthwindDataContextdb= new NorthwindDataContext();
varproducts = from p in db.Products
where p.ProductName.StartsWith(query)
select p).ToList();
}
if(Request.IsAjaxRequest())
{return View(“ProductSearchResults”, products);
}else{
return View(products);
}
<div id=”results”><%Html.RenderPartial(“ProductSearchResults”, ViewData.Model); %></div>
2011-4-22 23:54 danny
发表评论
-
10.2Asp.net MVC各层使用TDD方式
2011-05-01 12:09 769Asp.net MVC各层使用TDD方式 Asp.net M ... -
10.1TDD简介
2011-04-30 23:09 532MVC中的测试驱动开发 为什么需要TDD TDD的由来 它 ... -
9、MVC程序安全限定
2011-04-29 22:14 1784常见网络安全攻击隐患 针对Asp.net MVC防御体系 安 ... -
8.2ASP.NET MVC2使用Ajax类库实例
2011-04-29 13:05 893ASP.NET MVC2使用Ajax类库实例 .net fo ... -
7.2自定义开发Filter
2011-04-27 16:04 595Custom Filters ➤IAuthorization ... -
7.1Filter的使用
2011-04-26 22:20 475Filter的使用 -对Action的附加说明 Asp.n ... -
6.3Action的调用与属性
2011-04-26 09:43 640Action的调用与属性 1、唤起Action R ... -
6.2ActionResult的使用
2011-04-25 19:14 651ActionResult public abstract c ... -
6.1Controller类的基本构成
2011-04-25 09:17 641关于Controller Controller是什么? C ... -
5.6在Webform中使用routing
2011-04-23 22:48 630在Webform中使用routing 在Asp.net 4中使 ... -
5.5URL和Action匹配的秘密
2011-04-22 09:11 868Routes是如何把URL映射为Action -请求路由管道 ... -
5.4使用routing生成URL
2011-04-21 11:05 566使用routing生成URL URL生成器概述 1、质询每个 ... -
5.3使用Routes
2011-04-20 09:11 7145.3使用Routes 注册Area Route publi ... -
5.2Routes匹配URL的工作方式
2011-04-19 08:55 825URL的匹配规则 -site/{controller}/{ac ... -
5.1Url和Routes介绍
2011-04-17 12:05 6195.1Url和Routes介绍 关于Urls -域名好记好拼 ... -
4、View引擎介绍
2011-04-16 22:03 616View引擎介绍 Request =>Routing= ... -
3、HtmlHelper类(续)
2011-04-16 13:41 620HtmlHelper类(续) Html.TextArea 用 ... -
2、HtmlHelper类
2011-04-15 22:33 1069HtmlHelper类 <%Html. MVC1 & ... -
1、View层
2011-04-15 09:06 599ViewDataDictionary类 View 负责输出 ...
相关推荐
程序描述:本章介绍开发AJAX的开源框架GWT(Google Web Toolkit) 。最典型的Google Maps和Gmail等Google服务也正是基于此框架开发的。读者将能够快速掌握GWT的各种开发所涉及到的内容。 /firstgwt/FirstGWT....
8.1Web页表单元素的组成 8.2在普通的Web页中插入表单 8.3获取表单数据的两种方法 8.4PHP传参的常用方法 8.5在Web页中嵌入PHP脚本 8.6在PHP中获取表单数据 8.7对URL传递的参数进行编码解码 8.8PHP与Web表单的综合应用...
8.1Web页表单元素的组成 8.2在普通的Web页中插入表单 8.3获取表单数据的两种方法 8.4PHP传参的常用方法 8.5在Web页中嵌入PHP脚本 8.6在PHP中获取表单数据 8.7对URL传递的参数进行编码解码 8.8PHP与Web表单的综合应用...
分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计进度条、设计工具栏和菜单栏、设计面板、设计表格、设计表单、设计数据表、对Ajax的支持...
分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计进度条、设计工具栏和菜单栏、设计面板、设计表格、设计表单、设计数据表、对Ajax的支持...
8.1 一维数组与多维数组 119 8.1.1 一维数组简介 119 8.1.2 多维数组简介 119 8.2 常用的数组操作 120 8.2.1 数组的创建与调用 120 8.2.2 数组的更新 121 8.2.3 数组元素的遍历 122 8.3 数组索引与键值的操作技巧 ...
19.6 jQuery中的Ajax 19.7 工具函数 19.8 jQuery选择器和选取方法 19.9 jQuery的插件扩展 19.10 jQuery UI类库 第20章 客户端存储 20.1 localStorage和sessionStorage 20.2 cookie 20.3 利用IE userData持久化数据 ...
19.6 jQuery中的Ajax 19.7 工具函数 19.8 jQuery选择器和选取方法 19.9 jQuery的插件扩展 19.10 jQuery UI类库 第20章 客户端存储 20.1 localStorage和sessionStorage 20.2 cookie 20.3 利用IE userData持久化数据 ...
19.6 jQuery中的Ajax 19.7 工具函数 19.8 jQuery选择器和选取方法 19.9 jQuery的插件扩展 19.10 jQuery UI类库 第20章 客户端存储 20.1 localStorage和sessionStorage 20.2 cookie 20.3 利用IE userData持久化数据 ...
8.1 函数定义 166 8.2 函数调用 168 8.3 函数的实参和形参 173 8.4 作为值的函数 178 8.5 作为命名空间的函数 181 8.6 闭包 182 8.7 函数属性、方法和构造函数 188 8.8 函数式编程 194 第9章 类和模块 201 9.1 类和...
1.2.3 .NET Framework 类库 1.3 安装Visual Studio 2008 1.3.1 安装Visual Studio 2008 1.3.2 主窗口 1.3.3 文档窗口 1.3.4 工具箱 1.3.5 解决方案管理器 1.3.6 属性窗口 1.3.7 错误列表窗口 1.4 安装SQL Server ...
19.6 jquery中的ajax 550 19.7 工具函数 563 19.8 jquery选择器和选取方法 566 19.9 jquery的插件扩展 574 19.10 jquery ui类库 577 第20章 客户端存储 579 20.1 localstorage和sessionstorage 581 20.2 cookie 586 ...
19.6 jquery中的ajax 550 19.7 工具函数 563 19.8 jquery选择器和选取方法 566 19.9 jquery的插件扩展 574 19.10 jquery ui类库 577 第20章 客户端存储 579 20.1 localstorage和sessionstorage 581 20.2 cookie 586 ...
1.2.3 .NET Framework 类库 1.3 安装Visual Studio 2008 1.3.1 安装Visual Studio 2008 1.3.2 主窗口 1.3.3 文档窗口 1.3.4 工具箱 1.3.5 解决方案管理器 1.3.6 属性窗口 1.3.7 错误列表窗口 1.4 安装SQL Server ...
1.2.3 .NET Framework 类库 1.3 安装Visual Studio 2008 1.3.1 安装Visual Studio 2008 1.3.2 主窗口 1.3.3 文档窗口 1.3.4 工具箱 1.3.5 解决方案管理器 1.3.6 属性窗口 1.3.7 错误列表窗口 1.4 安装SQL Server ...
1.2.3 .NET Framework 类库 1.3 安装Visual Studio 2008 1.3.1 安装Visual Studio 2008 1.3.2 主窗口 1.3.3 文档窗口 1.3.4 工具箱 1.3.5 解决方案管理器 1.3.6 属性窗口 1.3.7 错误列表窗口 1.4 安装SQL Server ...
1.2.3 .NET Framework 类库 1.3 安装Visual Studio 2008 1.3.1 安装Visual Studio 2008 1.3.2 主窗口 1.3.3 文档窗口 1.3.4 工具箱 1.3.5 解决方案管理器 1.3.6 属性窗口 1.3.7 错误列表窗口 1.4 安装SQL Server ...
1.2.3 .NET Framework 类库 1.3 安装Visual Studio 2008 1.3.1 安装Visual Studio 2008 1.3.2 主窗口 1.3.3 文档窗口 1.3.4 工具箱 1.3.5 解决方案管理器 1.3.6 属性窗口 1.3.7 错误列表窗口 1.4 安装SQL Server ...