写在前面:由于工作需要,本人刚接触asp.net mvc,虽然webform的项目干过几个。但是也不是很精通。抛开asp.net webform和asp.net mvc的各自优劣和诸多差异先不说。我认为虽然mvc和webform有诸多不同,但是也只是为了达到相同的目的而在各自的机制下采取了不同的手段而已。更何况它们都是基于asp.net框架的。因此在解决mvc开发过程中的问题时,我很容易联想到在webform下同样的问题是如何解决的。以此来作为对照。我姑且把这种方法叫做迁移学习法吧。我以"小孩之心"来揣测肯定有很多前辈也做样做过吧。

前几天有人问起一个问题:在webform中,异步请求可以跳转到当前页面后台的一个方法吗?就像mvc中跳转到当前控制器的action一样。我当时给出了参考方案:使用webmethod。是的,今天就围绕这个话题来展开。简单地讲讲在webform和mvc中的ajax异步请求。

webfrom中的ajax异步请求

先来扯个蛋。我们知道为了实现模型显示和逻辑的分离,webform采用了事件驱动。也就是事先注册好对应的操作的事件操作。这么一来,每次服务器控件的事件触发,都会page load一下。然后才执行相应的事件逻辑。这样做的一个后果是每次都要初始化页面的数据。为了平衡,又采用了viewstate,在Page_Load事件中加上if(Page.IsPostBack)的判断来过滤重复的初始化绑定工作。当然即使这样,还是引发了服务器回传,会导致页面全局的刷新(虽然省去了初始化数据绑定时的数据请求)。那么说了这么多废话,你自然而然的会想到要使用一种什么办法来阻止这种行为的发生。我们知道aspx页面实际上最后请求的是页面本身(也就是form表单生成的action指向自己)。在这之中,我们似乎可以察觉点什么。也就是如何实现请求自身的同时还能不导致界面的全部刷新,那么很自然地就想到了一种技术:回调。说了这么多,来段代码回顾下webform中使用jquery实现异步请求。

aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="weixin_api.Index" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="Scripts/jquery-1.4.1.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script>
$(function () {
$("#btnTest").click(function () {
$.ajax({
type: "POST",
contentType: "application/json",
url: "Index.aspx/SayHello",
data: null,
dataType: "json",
success: function (msg) {
alert(msg.d);
}
});
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" id="btnTest" value="Test" />
</div>
</form>
</body>
</html> aspx.cs:
[System.Web.Services.WebMethod]
public static string SayHello()
{
return "Hello";
}

从WebMethod属性不难看出这实际上还是应用了webservice组件的方式来实现的。当然ajax实现异步请求的资源可以使aspx、ashx、webservice等,其用法基本差不多,此处不作赘述。

mvc中的ajax异步请求

由于mvc采用基于路由映射,所以Controller中的Action可以直接通过url请求。下面是mvc中实现jquery局部刷新的实例

@model IEnumerable<MvcAppDemo.Models.MovieDB>

@{
ViewBag.Title = "List";
} <p>
<a href="#" id="Add">添加</a>
<div id="create"></div>
</p> <table>
<tr>
<th>
@Html.DisplayNameFor(model => model.Title)
</th>
<th>
@Html.DisplayNameFor(model => model.Director)
</th>
<th>
@Html.DisplayNameFor(model => model.Date)
</th>
<th>
Delete
</th>
</tr>
@if (Model != null && Model.Count() != )
{
foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Title)
</td>
<td>
@Html.DisplayFor(modelItem => item.Director)
</td>
<td>
@Html.DisplayFor(modelItem => item.Date)
</td>
<td></td>
</tr>
}
}
</table> <script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$("#Add").click(function () {
$.get("/Movies/Create", function (response) {
$("#create").html(response);
});
return false;
});

MVC&WebForm对照学习:ajax异步请求的更多相关文章

  1. 【Spring学习笔记-MVC-5】利用spring MVC框架,实现ajax异步请求以及json数据的返回

    作者:ssslinppp      时间:2015年5月26日 15:32:51 1. 摘要 本文讲解如何利用spring MVC框架,实现ajax异步请求以及json数据的返回. Spring MV ...

  2. MVC&WebForm对照学习:文件上传(以图片为例)

    原文  http://www.tuicool.com/articles/myM7fe 主题 HTMLMVC模式Asp.net 博客园::首页::  ::  ::  ::管理 5 Posts :: 0 ...

  3. MVC&WebForm对照学习:传值方式

    刚从webform开发转到mvc,如果说像路由这样稍微复杂一点的知识点还可以暂时先放一放(前提是默认的路由规则基本满足大部分需求),那有个问题在快速开发中,我想是必须要当即解决的,那就是webform ...

  4. MVC&WebForm对照学习:文件下载

    说完了WebForm和MVC中的文件上传,就不得不说用户从服务器端下载资源了.那么今天就扯扯在WebForm和MVC中是如何实现文件下载的.说起WebForm中的文件上传,codeshark在他的博文 ...

  5. 09.VUE学习之watch监听属性变化实现类百度搜索栏功能ajax异步请求数据,返回字符串

    cmd下安装axios npm install axios 安装好后,会多出node_modules文件夹 思路: 监听data里的word改变时,发送ajax异步请求数据, 把返回的数据赋值给dat ...

  6. ajax异步请求实例

    1. 问题分析 用户管理显示页面:usermanagement.tpl(也可以说是MVC中的V,即视图) 用户管理数据发送页面:usermanagement.php(也可以说是MVC中的M,即模型) ...

  7. ajax异步请求

    做前端开发的朋友对于ajax异步更新一定印象深刻,作为刚入坑的小白,今天就和大家一起聊聊关于ajax异步请求的那点事.既然是ajax就少不了jQuery的知识,推荐大家访问www.w3school.c ...

  8. ajax异步请求302分析

    1.前言 遇到这样一种情况,打开网页两个窗口a,b(都是已经登录授权的),在a页面中退出登录,然后在b页面执行增删改查,这个时候因为授权原因,b页面后端的请求肯定出现异常(对这个异常的处理,进行内部跳 ...

  9. 关于我们ajax异步请求的方法与知识

      做前端开发的朋友对于ajax异步更新一定印象深刻,作为刚入坑的小白,今天就和大家一起聊聊关于ajax异步请求的那点事.既然是ajax就少不了jQuery的知识,推荐大家访问www.w3school ...

随机推荐

  1. [转载]如何申请淘宝app_key、app_secret、SessionKey?

    不知道如何申请淘宝开发平台的App Key?其实申请App key很简单,主要了解申请步骤以及各个App key的数据阶段状态就可以了!下面由淘客帝国为您做详细图文讲解!申请比较简单,不过为了新手能够 ...

  2. iOS开发之深入探讨runtime机制02-runtime的简单使用

    runtime机制为我们提供了一系列的方法让我们可以在程序运行时动态修改类.对象中的所有属性.方法. 下面就介绍运行时一种很常见的使用方式,字典转模型.当然,你可能会说,“我用KVO直接 setVal ...

  3. 常见的排序算法之Java代码解释

    一 简要介绍 一般排序均值的是将一个已经无序的序列数据重新排列成有序的 常见的排序分为: 1 插入类排序 主要就是对于一个已经有序的序列中,插入一个新的记录.它包括:直接插入排序,折半插入排序和希尔排 ...

  4. poj 2387 Til the Cows Come Home (最短路,dijkstra模版题)

    题目 #define _CRT_SECURE_NO_WARNINGS #include<string.h> #include<stdio.h> #include<math ...

  5. poj 2031 Building a Space Station(最小生成树,三维,基础)

    只是坐标变成三维得了,而且要减去两边的半径而已 题目 //最小生成树,只是变成三维的了 #define _CRT_SECURE_NO_WARNINGS #include<stdlib.h> ...

  6. 2014多校第一场A题 || HDU 4861 Couple doubi

    题目链接 题意 : 有K个球,给你一个数P,可以求出K个值,(i=1,2,...,k) : 1^i+2^i+...+(p-1)^i (mod p).然后女朋友先取,再xp取,都希望赢,如果女朋友能赢输 ...

  7. REST_FRAMEWORK加深记忆-加了用户登陆认证,自定义权限的API接口

    哈哈,终于快结束了.. urls.py from django.conf.urls import include, url from django.contrib import admin urlpa ...

  8. hdu 1524 A Chess Game 博弈论

    SG函数!! 代码如下: #include<stdio.h> #include<cstring> #define I(x) scanf("%d",& ...

  9. hdu 4430 Yukari's Birthday

    思路: 分析知道1<=r<40:所以可以枚举r,之后再二分k. 代码如下: #include<iostream> #include<stdio.h> #includ ...

  10. 使用预处理PreparedStatement执行Sql语句

    /** * 使用预处理的方式执行Sql * @param sql Sql语句 * @param obj 变量值数组 * @return 查询结果 * @throws SQLException */ p ...