天天看点

MVC 使用Helpers实现Ajax

MVC 使用Helpers实现Ajax

View

<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>


<div id="TimePnl" style="width: 300px; height: 30px; border: 1px dotted silver;">
</div>
@Ajax.ActionLink("Click Me", "GetTime", new AjaxOptions { UpdateTargetId = "TimePnl" })      

MVC3需要在_Layout.cshtml 中加入

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

Controller

public ActionResult GetTime()
        {
return Content("Now Time:"+DateTime.Now.ToString());
        }      

示例使用ActionLink超链接发送请求到GetTime,返回一个ContentResult,通过AjaxOptions中的UpdateTargetId属性指定了需要更新的页面元素。

AjaxOptions中还有其他可以指定的属性:

MVC 使用Helpers实现Ajax

OnComplete和OnSuccess的区别:OnComplete是获取了Http请求时引发的,此时页面还没有进行更新,OnSuccess是在页面已经更新后引发的。

使用Ajax.BeginForm

View

<div id="myPnl" style="width: 300px; height: 30px; border: 1px dotted silver;">
</div>      
// @using Ajax.BeginForm("SaveAlert", new AjaxOptions { UpdateTargetId = "myPnl" }))      
@using (Ajax.BeginForm("Save", new AjaxOptions { UpdateTargetId = "myPnl" }))
{
    @Html.Label("I am Label") 
    <br />
    <input id="TextBox1" value="I am TextBox" />

    <input type="submit" value="提交" />
}      

Controller

public ActionResult Save(string str)
        {
return Content("Save OK!");
        }

public ActionResult SaveAlert(string str)
        {
return JavaScript("alert('Save Complete!')");
        }      

posted on 2011-12-30 03:11 getpro 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/getpro/archive/2011/12/30/2306885.html