ajax.BeginForm异步提交表单并更新数据

using (Ajax.BeginForm("GetBasicInformation", "Employee", //
new AjaxOptions { UpdateTargetId = "basicInfo", //设置HTML元素的ID,从服务器接收的内容将被插入到该元素中
LoadingElementId="loading",//指定HTML元素的ID,这是执行ajax请求其间要显示的HTML元素

LoadingElementDuration = 3000, //指定动画的持续时间,用于显露由LoadingElementId指定的元素,单位为毫秒
Url = Url.Action("GetBasicInformation"), //设置所请求的服务器端URL,此项效果:如果未启用JavaScript,则创建一个回递给原始动作方法的form元素,确保优雅降级
HttpMethod = "Post" },//请求的http方法

new { @class = "profileForm", id = "BasicInformation" }))//

{

}

上段的浏览器中源代码效果如下:

<form action="/Employee/GetBasicInformation?Length=8"

class="profileForm" data-ajax="true"

data-ajax-loading="#loading"

data-ajax-loading-duration="3000"

data-ajax-method="Post"

data-ajax-mode="replace"

data-ajax-update="#basicInfo"

data-ajax-url="/Employee/GetBasicInformation"

id="BasicInformation" method="post">

控制器中代码如下:

[HttpPost]
public PartialViewResult GetBasicInformation()
{

。。。。。。。

。。。。。。。

。。。。。。。

return PartialView();
}

PartialViewResult.ascx中是你要刷新的视图内容

例如:

<h2>基本信息</h2>
<span class="c_edit" id="spantest"></span>
<div class="basicShow" id="basicshow">
<span><%=Model.NAME %> <%=Model.SEX %> <%=Model.EDUCATION_BACKGROUND %> <%=Model.WORK_EXPERIENCE %><br>
<%=Model.PHONENUMBER %> <%=Model.EMAIL %> <%=Model.SITUATIONID.SITUATION %>
<br>
</span>
<div class="m_portrait">
<div></div>
<img width="120" height="120" alt="jason" src="<%=Url.Content("~/style/images/default_headpic.png") %>">
</div>
</div>

时间: 2024-12-19 16:37:22

ajax.BeginForm异步提交表单并更新数据的相关文章

.net mvc Ajax.BeginForm 异步提交表单

Ajax.BeginForm异步表单用validform验证插件...... 之前找了一个jquery的验证插件validform,对此插件很满意,但是这个插件对<input type="button">按钮不感冒(检测不到这个按钮的onclick事件),只检测<input type="submit">的提交事件. 于是乎想到mvc 有一个异步表单Ajax.BeginForm,经测试可用.记录下来以便查阅 <script src=&qu

TP 框架 ajax[利用异步提交表单]

1 //[] 2 3 $(function () { 4 $("#send-btn" ).click(function (){ 5 //接受表单的值 6 var username=$('input[name=username]').val(); 7 var content=$('textarea[name=content]').val(); 8 if(username==''){ 9 alert('用户名不能为空!'); 10 username.focus(); 11 return ;

ASP.NET MVC 网站开发总结(五)——Ajax异步提交表单之检查验证码

首先提出一个问题:在做网站开发的时候,用到了验证码来防止恶意提交表单,那么要如何实现当验证码错误时,只是刷新一下验证码,而其它填写的信息不改变? 先说一下为什么有这个需求:以提交注册信息页面为例,一般注册都需要用户填一个验证码信息(防止机器恶意注册),并且这个验证码会提交到后台去进行比对,若是错了则不会检查其他提交信息而直接返回浏览器端提示验证码错误.若是简单地用form表单直接将数据提交到指定的url,当验证码填写错误的信息返回浏览器端的时候,不可避免整个页面都会重新刷新一次,这是用户所不想要

Jquery异步提交表单到Action

转载请注明出处:jiq?钦's technical Blog 一 需求 出于兴趣最近在做分布式注册中心的管理界面,其中一个模块是左边的树显示所有ZooKeeper节点,使用的ztree实现,点击树节点的时候会查询后台action返回节点数据,显示在右边区域,为了不刷整个页面,所以采用的是Jquery的异步请求Action返回JSON数据,参考我的这篇文章,然后使用Jquery的load函数载入显示节点信息的nodeInfo.jsp,以返回的JSON数据为参数. 效果如下: 现在的需求是:我要在编

JQuery 异步提交表单

1.使用post提交方式 2.构造表单的数格式 3.结合form表单的submit调用ajax的回调函数. 使用 jQuery 异步提交表单代码: 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>无标题页</title> </head> <script src="js/jquery-1.4.2.js"></sc

SpringMVC中的异步提交表单

1.前言 近期在做一个项目,前台框架用的是EasyUI+SpringMVC,因为对SpringMVC不太了解,所以刚開始接触的时候有点吃力,在此通过一个EasyUi中的DataGrid表格来总结一下.  2.SpringMVC中的View向控制器传參 在SpringMVC中,View怎样向控制器传參数呢? 尤其是Form表单提交的时候,详细有例如以下几种方式 2.1 HttpServletRequest 能够通过getParameter()方法来获取前台传过来的參数 2.2 Form表单绑定 /

Jquery 异步提交表单(post)

方法  $.post(url,params,function(data){}); 表单的action,method属性都没有 button的type不能为submit只能为button 前台代码 <script type="text/javascript"> $(function()         {    //异步提交表单  $("#save").click(function(){      $.post("${ctx}/order/sav

php实现点击文字提交表单并传递数据至下一个页面

<?php $id="4";//等会要把这个数据传到第二个页面 ?> <?php echo "<li>"; echo "<form name=\"myquestion\" method=\"post\" action=\"question.php\">"; echo "<input name=\"questionID\&

使用ajax异步提交表单

虽然这篇文章的标题是提交表单,但是主要的难点在于使用ajax提交文本域的内容, 在工作中的经常会需要ajax跨域的问题,通常的需求使用jsonp就可以得到解决,但是当前项目中有一个图片服务器,客户端需要直接上传图片到图片服务器中,这就产生了一个跨域post提交文件的问题,很显然jquery本身jsonp只支持get方式的异步提交肯定是不行 其中也尝试过使用ifrmae的方法来提交数据,在网上有,但是效果不理想,并且也很复杂的样子,最后选择出了jquery.from.js 这个插件,可以实现异步的