写在前面：由于工作需要，本人刚接触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. ios开发之数据存取1-SQLite

    iOS开发中常用的数据存取方式有: XML属性列表-PList NSKeyedArchiver 归档 Preference-偏好设置 SQLite3 Core Data-以面向对象的方式操作数据库SQ ...

  2. Unity3D研究院之脚本批量打包渠道包研究

    原地址:http://www.xuanyusong.com/archives/2418#comments 最近在研究Unity3D脚本批量打包,比如在Android平台下各种不同分辨率和不同内存大小的 ...

  3. linux源码阅读笔记 fork函数

    在阅读源码的过程中,发现找不到fork函数的定义.后来在linux/init/main.c中找到了这样一条语句 static inline _syscall0(int,fork) 原来这里就是fork ...

  4. How do you design object oriented projects?

    what are things you do during the high level design phase (before you begin programming) to determin ...

  5. POJ 3258

    River Hopscotch Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 5961   Accepted: 2579 D ...

  6. HDU 3461 Code Lock(并查集，合并区间，思路太难想了啊)

    完全没思路,题目也没看懂,直接参考大牛们的解法. http://www.myexception.cn/program/723825.html 题意是说有N个字母组成的密码锁,如[wersdfj],每一 ...

  7. 用 Xamarin for VS 创建 aar 文件的绑定

    预备工作:相关aar文件,Xamarin for VS一份.我这里以Android中挺火的 MaterialDesignLibrary 为例. 1.首先,创建一个Xamarin Binding Lib ...

  8. http://www.cnblogs.com/xia520pi/archive/2012/05/16/2504205.html

    http://www.cnblogs.com/xia520pi/archive/2012/05/16/2504205.html http://www.cnblogs.com/madyina/p/370 ...

  9. Entity Freamwork 6连接PostgreSql数据库

    原文 Entity Freamwork 6连接PostgreSql数据库 开发环境 VS 2015  Update 1   Postgre Sql 9.4 使用过程 1.使用Nuget在项目中添加对E ...

  10. iOS iOS7越狱

    1.使用盘古越狱工具 (或者PP助手) 2.越狱成功后需要安装Apple File Conduit “2”,用于替代afc2add插件 3.安装AppSync插件 (绕过系统验证,随意安装.运行破解的 ...