首页 > Web开发 > 详细

MVC下HtmlHelper自带BeginForm表单提交与异步Ajax请求

时间:2016-03-06 17:11:51      阅读:566      评论:0      收藏:0      [点我收藏+]

假如有一个数据表格UserInfo:

public class UserInfo
{
    public int Id { get; set; }
    public string Name { get; set; }
    public string Pwd { get; set; }
    public int Sex { get; set; }
}

控制器下Action方法:UserInfos

表单提交过来后UserInfo user对象可以获取到value值,只要html标签的name值与UserInfo下的属性名相同

public ActionResult UserInfos(UserInfo user)
{
    if (user.Name != "admin" && user.Pwd != "123")
    {
        return Content("用户名或密码错误");
    }
    else
    {
        return Content("登录成功");
    }
}

html代码(表单提交):

@using (Html.BeginForm("UserInfos", "Home", FormMethod.Post))
{
    <input type="text" name="Id" value="" />
    <input type="text" name="Name" value="" />
    <input type="text" name="Pwd" value="" />
    <select name="Sex">
        <option value="-1">请选择</option>
        <option value="1"></option>
        <option value="0"></option>
    </select>
    <input type="submit" id="btnOK" value="提交" />
}

html代码(异步表单表单提交):

@using (Ajax.BeginForm("UserInfos", "Home", new AjaxOptions() { Confirm = "您确定要提交吗?", HttpMethod = "post", InsertionMode = InsertionMode.Replace, UpdateTargetId = "result", LoadingElementId = "loading", OnSuccess = "afterSuccess", OnFailure = "afterError" }))
{
    <input type="text" name="Id" value="" />
    <input type="text" name="Name" value="" />
    <input type="text" name="Pwd" value="" />
    <select name="Sex">
        <option value="-1">请选择</option>
        <option value="1"></option>
        <option value="0"></option>
    </select>
    <input type="submit" id="btnOK" value="提交" />
}
    <span style="color:red;font-size:10px;" id="result"></span>
    <div id="loading" style="display:none;">
        <img src="~/Content/loading.jpg" />
    </div>

上面的InsertionMode = InsertionMode.Replace为追加数据

UpdateTargetId = "result"为请求返回的数据填充到这个ID值

OnSuccess = "afterSuccess"和 OnFailure = "afterError"为成功与失败要执行的JS函数

MVC下HtmlHelper自带BeginForm表单提交与异步Ajax请求

原文:http://www.cnblogs.com/genesis/p/5247711.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!