14.1.配置文件

14.2.AjaxHelper – 异步链接按钮

14.3.AjaxHelper – 异步表单

  • AjaxOptions常见属性：

14.4.AjaxOptions对象生成【对应】触发ajax请求的标签的 属性

14.1.配置文件

页面添加非入侵js文件

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript">
</script>

可在单个视图页面(View)上关闭

@{Html.EnableUnobtrusiveJavaScript(false);}

@{Html.EnableClientValidation(false);}

14.2.AjaxHelper – 异步链接按钮

必须开启 非入侵式 Ajax：导入Jquery和unobtrusiveAjax文件

View中：@Ajax.ActionLink 创建 ajax 超链接按钮

一般用来请求动态生成的部分html代码(分部视图)

@Ajax.ActionLink("链接文本", "PartialView", new AjaxOptions() {
                         UpdateTargetId="divMsg",//数据显示的html容器id
                         InsertionMode= InsertionMode.Replace, //替换容器内容
                         HttpMethod="Post" })

Controller中

public PartialViewResult PartialView()

        {

            Models.Student stu = new Models.Student() {  StudentID = 1,  Name = "Ruiky" };

            return PartialView(stu);

        }
 
PartialView.cshtml (分布视图)
<h2>PartialView</h2>

@model _06MVCAjax_CodeFirst.Models.Student

@Html.ValueFor(s => s.StudentID)

@Html.ValueFor(s => s.Name)
 
效果图：
 
 
 
 

14.3.AjaxHelper – 异步表单

AjaxBeginForm.cshtml

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>AjaxBeginForm</title>

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

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

    <script type="text/javascript">

        function suc(resText) {

            alert(resText);

        };

        function err(xhr) {

            alert(xhr.readyState)

        }

    </script>

    <style type="text/css">

        #imgLoad{

            display:none

        }

    </style>

</head>

<body>

    <h1>异步表单：</h1>

    @using (Ajax.BeginForm("GetDateTime", "Html", new AjaxOptions()

    {

        HttpMethod = "post", //传输方式

        OnSuccess = "suc", //加载成功调用的js方法

        OnFailure="err", //出错调用的js方法

        LoadingElementId = "imgLoad" //请求所现实的元素

    }))

    {

        <input type="text" name="txtName" />

        <input type="submit" />

        <div id="imgLoad">loding....</div>

    }

</body>

</html>

HtmlController.cs

public ActionResult GetDateTime()

        {

            //例：报错的情况（除以0）

            //System.Threading.Thread.Sleep(2000);

            //int a = 0;

            //int b = 1 / a;

            string str =Request.Form["txtName"];

            System.Threading.Thread.Sleep(2000);

            return Content(DateTime.Now + "," + str);

        }

AjaxOptions常见属性：

UpdateTargetId 目标元素id，获取服务器响应后，将获取的响应报文体显示到目标元素的innerHTML中。
InsertionMode

  • InsertAfter插入目标元素原有内容之后；

  • InsertBefore插入目标元素原有内容之前；

  • Replace 替换目标元素原有内容
LoadingElementId

LoadingElementId：异步对象readyState==4之前显示"正在加载"状态的元素id

14.4.AjaxOptions对象生成【对应】触发ajax请求的标签的 属性

MVC – 14.ajax异步请求的更多相关文章

  1. MVC – 14.ajax异步请求

    14.1.配置文件 14.2.AjaxHelper – 异步链接按钮 14.3.AjaxHelper – 异步表单 AjaxOptions常见属性: 14.4.AjaxOptions对象生成[对应]触 ...

  2. MVC的Ajax异步请求

    @using (Ajax.BeginForm("GetTime","order",new AjaxOptions() { Confirm="你确认这么 ...

  3. MVC&WebForm对照学习：ajax异步请求

    写在前面:由于工作需要,本人刚接触asp.net mvc,虽然webform的项目干过几个.但是也不是很精通.抛开asp.net webform和asp.net mvc的各自优劣和诸多差异先不说.我认 ...

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

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

  5. ajax异步请求实例

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

  6. ajax异步请求302分析

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

  7. POI导出Excel不弹出保存提示_通过ajax异步请求(post)到后台通过POI导出Excel

    实现导出excel的思路是:前端通过ajax的post请求,到后台处理数据,然后把流文件响应到客户端,供客户端下载 文件下载方法如下: public static boolean downloadLo ...

  8. ajax异步请求

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

  9. spring HandlerInterceptorAdapter拦截ajax异步请求，报错ERR_INCOMPLETE_CHUNKED_ENCODING

    话不多说,直接上正文. 异常信息: Failed to load resource: net::ERR_INCOMPLETE_CHUNKED_ENCODING 问题描述: 该异常是在页面发送ajax请 ...

随机推荐

  1. smarty调用php函数

    模板书写: {'param1'|functionName:'param2':'param3'} php函数原型: echo functionName('param1','param2','param3 ...

  2. 通过socket实现多个连接并实现ssh功能

    一.前言 上一篇中我们已经知道了客户端通过socket来连接服务端,进行了一次数据传输,那如何实现客户端多次发生数据?而服务端接受多个客户端呢? 二.发送中文信息 在python3中,socket只能 ...

  3. 让块元素在同一行显示的方法： float 和inline-block

    float: 定义:按照一个指定的方向移动,遇到父级的边界或者相邻的浮动元素就会停下来(不完全脱离文档流) 值: left.right.none 特点: 1.浮动的块元素可以在一行显示,宽度是被内容撑 ...

  4. [DeeplearningAI笔记]序列模型3.6Bleu得分/机器翻译得分指标

    5.3序列模型与注意力机制 觉得有用的话,欢迎一起讨论相互学习~Follow Me 3.6Bleu得分 在机器翻译中往往对应有多种翻译,而且同样好,此时怎样评估一个机器翻译系统是一个难题. 常见的解决 ...

  5. 跟我一起写Makefile(二)

    Makefile 总述——————— 一.Makefile里有什么? Makefile里主要包含了五个东西:显式规则.隐晦规则.变量定义.文件指示和注释. 1.显式规则.显式规则说明了,如何生成一个或 ...

  6. centos7 网络问题

    1虚拟机网卡设置--网卡设置模式为NET模式(正常情况是可以直接上网的)2“cd /etc/sysconfig/network-scripts/3使用命令“sudo vi ifcfg-ens33”进入 ...

  7. 816E. Karen and Supermarket 树形DP

    LINK 题意:给出n个商品,除第一个商品外,所有商品可以选择使用优惠券,但要求其前驱商品已被购买,问消费k以下能买几个不同的商品 思路:题意很明显就是树形DP.对于一个商品有三种选择,买且使用优惠券 ...

  8. linux 中 permission denied的问题

    想在linux中运行一个脚步,却提示permission denied. 文件权限不允许. 为了获得执行权限,借助chmod指令修改文件权限即可. 1.如果是运行程序时出现此提示,一般执行chmod ...

  9. CSS 文本属性

    一.文本位置 text-align: 参数 /** * left center right:左中右**/text-align: left; 二.文本行间距 line-height: 参数 特别要注意: ...

  10. 使用itextpdf提取pdf内容

    package test; import java.io.FileInputStream; import java.io.IOException; import java.util.ArrayList ...