在MVC下我们不能利用AJAX.NET控件，那么要实现UpdateProgress来显示进度怎么办，我们可以利用JQUERY来实现这个功能。顺便说一句JQuery将集成在下一版本的Visual Studio中，是MS AJAX FrameWork的一部分。
1.接着上一篇的XML Menu，我们先编辑Menu.XML，添加如下代码：
<MenuItem Order="4" Action="Test" Controller="AJAXFORM">
AJAXFORM
</MenuItem>
2.在View目录下添加AJAXFORM目录和View Test.
效果如下：
代码：
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
Test
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script src="http://www.cnblogs.com/Scripts/jquery-1.2.3-intellisense.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$.formValidator.initConfig();
$("#data").formValidator({ onshow: "please input test data", onfocus: "test data required", oncorrect: "OK" })
.inputValidator({ min: 1, empty: { leftempty: true, rightempty: true }, onerror: "test data required" });
var options = {
target: '#divResult', // target element(s) to be updated with server response
beforeSubmit: check, // pre-submit callback
success: showResponse, // post-submit callback
url: 'Test', // override for form's 'action' attribute
type: 'post', // 'get' or 'post', override for form's 'method' attribute
dataType: 'json' // 'xml', 'script', or 'json' (expected server response type)
// other available options:
//clearForm: true // clear all form fields after successful submit
//resetForm: true // reset the form after successful submit
// $.ajax options can be used here too, for example:
//timeout: 3000
};
$('form').ajaxForm(options);
});
function checkForm() {
return jQuery.formValidator.pageIsValid();
}
function showResponse(data) {
data = decodeURI(data);
$("#data").val(decodeURI($("#data").val())); //后台来的数据经过编码
$("#divLoading").removeClass().addClass ("Hidden");
$("#DivResultData").html(data); //提交前编码，这 里再解码
}
function check() {
if (checkForm()) {
$("#divLoading").removeClass().addClass("Visible");
$("#divResult").removeClass().addClass("Visible");
$("#data").val(encodeURI($("#data").val())); //提交前编码
}
}
</script>
<h2>
Test</h2>
<%using (Html.BeginForm("", "", FormMethod.Post, new { @onsubmit = "return checkForm();" }))
{ %>
<fieldset>
<legend>AJAX Form 演示 </legend>
<h3>
Test</h3>
<%=Html.TextBox("data", "", new { @class = "InputNormal" })%>
<div id="dataTip">
</div>
<input id="submit" type="submit" value="submit" />
</fieldset>
<div id="divResult" class="Hidden">
<h3>
Result</h3>
<fieldset>
<div id="divLoading">
<img src='<%=Url.Content("~/Content/images/loader.gif")%>' alt="load" />
please waiting...</div>
<div id="DivResultData">
</div>
</fieldset>
</div>
<%} %>
</asp:Content>
用了form插件，用div实现UpdateProgress