在项目开发中,我们离不开表单提交,本篇主要记录mvc的Ajax.BeginForm提交方式。

  1. 需要用到的js    

    @Url.Script("~/Content/Scripts/jquery-1.7.1.js")

    @Url.Script("~/Content/Scripts/jquery.validate.min.js")

    @Url.Script("~/Content/Scripts/jquery.validate.unobtrusive.min.js")

    @Url.Script("~/Content/Scripts/jquery.unobtrusive-ajax.min.js")

     

  2. 表单

    @using (Ajax.BeginForm("EditUser", "UserCenter", new
    AjaxOptions { Url = Url.Action("EditUser"), HttpMethod = "POST", OnSuccess = "ajaxForm" }, new { id = "editeForm" }))

    {

    @Html.AntiForgeryToken()

    <table
    border="0" cellspacing="0" cellpadding="0" width="100%">

    <tbody>

    <tr>

    <td
    width="13%" align="right">

    @Html.LabelFor(model => model.nickname):

    </td>

    <td
    width="87%">

    @Html.TextBoxFor(model => model.nickname, new { @class = "input1" })

    @Html.ValidationMessageFor(model => model.nickname)

    <span
    class="red ml10">*</span>

    <span
    class="f12 cGray">必填</span>

    </td>

    </tr>

    <tr>

    <td
    align="right">

    @Html.LabelFor(model => model.email):

    </td>

    <td
    id="td_email">

    @{

    if (Model != null)

    {

    if (string.IsNullOrEmpty(Model.email))

    {

    <font
    class="red">未绑定邮箱
    </font>
    <a
    href="javascript:void(0)" onclick="triggerLi(3)"

    class="cBlue f12 ml10">
    马上去绑定</a>

    }

     

    else
    if (Model.email_verified == 0)

    {

    @Html.Raw(Model.email)

    <font
    class="red">未验证</font>
    <a
    href="javascript:void(0)" onclick="triggerLi(3)"

    class="cBlue f12 ml10">马上去验证</a>

     

    }

    else

    {

    @Html.Raw(Model.email) <span>已绑定</span>

     

     

    }

    }

    }

    </td>

    </tr>

    <tr>

    <td
    align="right">

    @Html.LabelFor(model => model.mobile):

    </td>

    <td
    id="td_mobile">

    @{

    if (Model != null)

    {

    if (string.IsNullOrEmpty(Model.mobile))

    {

    <font
    class="red">未绑定手机
    </font>
    <a
    href="javascript:void(0)" onclick="triggerLi(4)"

    class="cBlue f12 ml10">
    马上去绑定</a>}

     

    else
    if (Model.mobile_verified == 0)

    {

    @Html.Label(Model.mobile)

    <font
    class="red">未验证</font>
    <a
    href="javascript:void(0)" onclick="triggerLi(4)"

    class="cBlue f12 ml10">马上去验证</a>

     

    }

    else

    {

    @Model.mobile <span>已验证</span>

    }

    }

    }

    </td>

    </tr>

    <tr>

    <td
    align="right">

    @Html.LabelFor(model => model.qq):

    </td>

    <td>

    @Html.TextBoxFor(model => model.qq, new { @class = "input1" })

    @Html.ValidationMessageFor(model => model.qq)

    </td>

    </tr>

    <tr>

    <td
    align="right">

    @Html.LabelFor(model => model.sex):

    </td>

    <td>

    @{
    Collection<CodeDescription> sex = ViewBag.Sex as
    Collection<CodeDescription>;}

    @Html.RadioButtonListFor(model => model.sex, sex, System.Web.UI.WebControls.RepeatDirection.Horizontal)

    @Html.ValidationMessageFor(model => model.sex)

    </td>

    </tr>

    <tr>

    <td
    align="right">

    @Html.LabelFor(model => model.birthday):

    </td>

    <td>

    @Html.TextBoxFor(model => model.birthday, new { @class = "Wdate", onClick = "WdatePicker()" })

    @Html.ValidationMessageFor(model => model.birthday)

    </td>

    <tr>

    <td
    align="right">

    @Html.LabelFor(model => model.province_id):

    </td>

    <td>

    @Html.HiddenFor(model => model.province_id)

    @Html.HiddenFor(model => model.city_id)

    <span
    id="span_province"></span><span
    id="span_city" style="margin-left: 10px"></span>

    @*@Html.EditorFor(model => model.Address)

    @Html.ValidationMessageFor(model => model.Address)*@

    </td>

    </tr>

    <tr>

    <td
    align="right">

    @Html.LabelFor(model => model.job):

    </td>

    <td>

    @{

    Collection<CodeDescription> Vocation = ViewBag.Vocation as
    Collection<CodeDescription>;}

    @Html.RadioButtonListFor(model => model.job, Vocation, System.Web.UI.WebControls.RepeatDirection.Horizontal)

    @Html.ValidationMessageFor(model => model.job)

    </td>

    </tr>

    <tr
    class="bg">

    <td
    valign="top" align="right">

    @Html.LabelFor(model => model.trade_style):

    </td>

    <td>

    @{

    Collection<CodeDescription> InvestmentStyle = ViewBag.InvestmentStyle as
    Collection<CodeDescription>;}

    @Html.RadioButtonListFor(model => model.trade_style, InvestmentStyle, System.Web.UI.WebControls.RepeatDirection.Horizontal)

    @Html.ValidationMessageFor(model => model.trade_style)

    </td>

    </tr>

    <tr
    class="bg">

    <td
    class="pb10" valign="top" align="right">

    @Html.LabelFor(model => model.trade_begin):

    </td>

    <td
    class="pb10">

    @{

    List<SelectListItem> dorpDownList = new
    List<SelectListItem>();

    for (int year = 1990; year < DateTime.Now.Year; year++)

    {

    SelectListItem selectListItem = new
    SelectListItem();

    if (Model != null && Model.trade_begin == year)

    {

    selectListItem.Selected = true;

    }

    selectListItem.Text = year.ToString();

    selectListItem.Value = year.ToString();

    dorpDownList.Add(selectListItem);

    }

    }

    @Html.DropDownListFor(model => model.trade_begin, dorpDownList) 年

    @Html.ValidationMessageFor(model => model.trade_begin)

    </td>

    </tr>

    <tr>

    <td
    class="tc" colspan="2">

    <input
    class="btn" value="提交修改"
    type="submit" name="">

    </td>

    </tr>

    </tbody>

    </table>

     

    }

    表单中的用户昵称采用

    [Required(ErrorMessage = "请输入昵称")]

[Remote("UniqueNickCheck", "Account", ErrorMessage = "昵称已存在", HttpMethod = "post")]

[StringLength(8, MinimumLength = 2, ErrorMessage = "长度介于2-8位")]

[Display(Name = "昵称")]

public
string nickname { get; set; }

 

    配置验证唯一性。

  1. 实体

    public
    class
    UserInfo

    {

     

    public
    int ret { set; get; }

    public
    string msg { set; get; }

    ///
    <summary>

    ///
    用户编号

    ///
    </summary>

    [ScaffoldColumn(false)]

    public
    string userid { set; get; }

     

    ///
    <summary>

    ///
    用户名

    ///
    </summary>

    [ScaffoldColumn(false)]

    public
    string username { set; get; }

     

    [Required(ErrorMessage = "请输入昵称")]

    [Remote("UniqueNickCheck", "Account", ErrorMessage = "昵称已存在", HttpMethod = "post")]

    [StringLength(8, MinimumLength = 2, ErrorMessage = "长度介于2-8位")]

    [Display(Name = "昵称")]

    public
    string nickname { get; set; }

     

    ///
    <summary>

    ///
    头像地址

    ///
    </summary>

    [ScaffoldColumn(false)]

    public
    string userimg { get; set; }

     

     

    private
    string _mobile = "";

    ///
    <summary>

    ///
    手机号

    ///
    </summary>

    [Display(Name = "手机")]

    [RegularExpression(@"^(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$", ErrorMessage = "手机号码格式错误")]

    [Editable(false)]

    public
    string mobile

    {

    get { return _mobile; }

    set { _mobile = value; }

    }

    ///
    <summary>

    ///
    手机号是否已验证:未验证 1:已验证

    ///
    </summary>

    [ScaffoldColumn(false)]

    public
    int mobile_verified { get; set; }

     

    ///
    <summary>

    ///
    邮箱地址

    ///
    </summary>

    private
    string _email = "";

    [Display(Name = "邮箱")]

    [DataType(DataType.EmailAddress)]

    [Editable(false)]

    public
    string email

    {

    get { return _email; }

    set { _email = value; }

    }

     

    ///
    <summary>

    ///
    邮箱是否已验证:未验证 1:已验证

    ///
    </summary>

    [ScaffoldColumn(false)]

    public
    int email_verified { get; set; }

     

    ///
    <summary>

    ///
    性别:未填 1:男 2:女

    ///
    </summary>

    [Display(Name = "性别")]

    public
    int sex { get; set; }

     

    ///
    <summary>

    ///
    出生年月

    ///
    </summary>

    [Display(Name = "生日")]

    [RegularExpression(@"^((?:19|20)\d\d)-(0[1-9]|1[012])-(0[1-9]|[12][0-9]|3[01])$", ErrorMessage = "日期格式为yyyy-MM-dd")]

    public
    string birthday { get; set; }

     

    [Display(Name = "QQ")]

    [StringLength(20,MinimumLength=1,ErrorMessage="长度为1-20")]

    [RegularExpression(@"^\d{1,20}$", ErrorMessage = "QQ号码为1-20位数字")]

    public
    string qq { get; set; }

     

    ///
    <summary>

    ///
    所在省/直辖市区号

    ///
    </summary>

    [Display(Name = "现居地址")]

    public
    string province_id { get; set; }

     

    ///
    <summary>

    ///
    所在城市区号

    ///
    </summary>

    public
    string city_id { get; set; }

     

    ///
    <summary>

    ///
    职业

    ///
    </summary>

    [Display(Name = "职业")]

    public
    sbyte? job { get; set; }

     

    ///
    <summary>

    ///
    投资风格

    ///
    </summary>

    [Display(Name = "投资风格")]

    public
    sbyte? trade_style { get; set; }

     

    ///
    <summary>

    ///
    入市时间(年份)

    ///
    </summary>

    [Display(Name = "入市时间")]

    public
    int? trade_begin { get; set; }

     

    ///
    <summary>

    ///
    用户角色

    ///
    </summary>

    [ScaffoldColumn(false)]

    public
    sbyte? userrole { get; set; }

     

    ///
    <summary>

    ///
    用户开通的直播室编号

    ///
    </summary>

    [ScaffoldColumn(false)]

    public
    int? cast_room_id { get; set; }

     

    }

  2. 相关js

    window.ajaxForm= function (data ) {

    if (data.success) {

    var infoqq=$.trim($("#@Html.NameFor(model => model.qq)").val());

    if(infoqq=="")

    $("#@Html.NameFor(model => model.qq)").val(qq);

    art.dialog.tips(data.Message, showtime);

    } else {

    $(".error").remove();

    if(typeof(data)=="string")

    window.location.href = "@FormsAuthentication.LoginUrl";

    else
    if (data.returnUrl) window.location.href = data.returnUrl;

    else
    if(data.controlID){

    var $err=$("<label generated=\"true\" class=\"error\"></label>");

    $err.insertAfter($("#"+data.controlID)).html(data.Message);

    }

    else art.dialog.tips(data.Message, showtime);

    }

     

     

    }

        数据验证js插件 validate使用格式

    $("#fromVCode").validate({

rules: {

validatecode: {

required: true,

maxlength: 6

}

},

highlight: false,

errorPlacement: function(error, element) {

element.next().next("div").empty();

error.appendTo(element.next().next("div"));

},

success: function(label) {

label.remove();

},

submitHandler: function(form) {

var $err=$("<label generated=\"true\" class=\"error\"></label>");

$("#btnValidatecode").attr("disabled", "disabled");

if($("#confirmphone").val()=="")

{

$("#confirmphone").next().next("div").empty();

$err.appendTo($("#confirmphone").next().next("div")).html("请输入手机号!");

("#btnValidatecode").removeAttr("disabled");

return
false;

}

var par=$(form).serialize()+"&mobile="+$("#confirmphone").val();

 

$.post("@Url.Action("ValidateCode", "UserCenter")", par,

function(data) {

if (data.success) {

$(form)[0].reset();

$("#td_mobile").html($("#confirmphone").val()+"<span>已验证</span>");

art.dialog.tips(data.Message, showtime);

} else {

if(typeof(data)=="string")

window.location.href = "@FormsAuthentication.LoginUrl";

else
if (data.returnUrl) window.location.href = data.returnUrl;

else art.dialog.tips(data.Message, showtime);

}

$("#btnValidatecode").removeAttr("disabled");

});

return
false;

}

});

 

    

Mvc form提交的更多相关文章

  1. 【转】MVC form提交实体接收参数时空字符串值变成null

    问题:entity.BZ的值是null,Request.Form["BZ"]的值是空字符串 目标:让entity.BZ的值是空字符串. 解决方法:在实体的BZ属性上加上 [Disp ...

  2. spring mvc form表单提交乱码

    spring mvc form表单submit直接提交出现乱码.导致乱码一般是服务器端和页面之间编码不一致造成的.根据这一思路可以依次可以有以下方案. 1.jsp页面设置编码 <%@ page ...

  3. spring MVC做form提交Neither BindingResult nor plain target object for bean name 'command' available

    这两天在做spring3.0 MVC+hibernate3.2的练习中,做简单的form提交, 一直报java.lang.IllegalStateException: Neither BindingR ...

  4. asp.net MVC中form提交和控制器接受form提交过来的数据

    1.cshtml页面form提交2.控制器处理表单提交数据4种方式方法1:使用传统的Request请求取值[HttpPost]public ActionResult AddNews(){    str ...

  5. 表单提交学习笔记(一)—利用jquery.form提交表单(后台.net MVC)

    起因:一开始想用MVC本身的Form提交方法,但是提交完之后想进行一些提示,MVC就稍显不足了,最后用jquery插件---jquery.form.js,完美解决了问题~~ 使用方法 一.下载jque ...

  6. ASP.NET Core MVC – Form Tag Helpers

    ASP.NET Core Tag Helpers系列目录 ASP.NET Core MVC Tag Helpers 介绍 ASP.NET Core MVC – Caching Tag Helpers ...

  7. ASP.NET-AJAX.FORM提交附件失败

    尝试了不少时间在AJAX.FORM提交附件,发现完全不行,经过下面的这个博客的介绍,使用ajax.form.js插件提交成功,记录一下该博文网址和结论: 相关网址:http://www.cnblogs ...

  8. 百度编辑神器ueditor在ajax或form提交内容时候异常

    百度编辑神器ueditor在ajax或form提交内容时候异常,一:⑴web.config中<system.web> <httpRuntime requestValidationMo ...

  9. 关于button和form提交的一些问题

    1.form 中type 为submit 和button的区别 submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理( ...

随机推荐

  1. Cocoapods - pod install 成功后找不到头文件解决

    问题描述:使用Cocoapods时,import 找不到头文件. 问题原因:这是因为还没设置头文件的目录. 解决办法:在项目的Target的里设置一下,添加cocoapods头文件目录:目录路径直接写 ...

  2. LeetCode 206 Reverse a singly linked list.

    Reverse a singly linked list. Hint: A linked list can be reversed either iteratively or recursively. ...

  3. Linux C编程学习6---字符串处理、数据转换

    1.字符串 应用程序按其功能可分为数值计算.非数值计算以及输入输出操作等.非数值计算程序占相当大的比例,其核心就是字符串处理1.1.字符测试 1.1.1.测试字符是否为英文字母 int isalpha ...

  4. Java基础学习(三)

    /* java中的八种基本数据类型: 整数: byte . short . int . long 小数: float double 字符: char 布尔: boolean 字符串的类型: Strin ...

  5. Power BI for Office 365 概览

    伴随着数据量的日益增长,通过自服务式的商业智能把数据转换成辅助决策支持的工具,越来越成为迫切的需求.在以前,处理这些数据往往只是IT人员范围内的事,但是通过Power BI for Office 36 ...

  6. java接口

    一.定义 Java接口(Interface),是一系列方法的声明,是一些方法特征的集合,一个接口只有方法的特征没有方法的实现,因此这些方法可以在不同的地方被不同的类实现,而这些实现可以具有不同的行为( ...

  7. MIT 6.828 JOS学习笔记16. Lab 2.2

    Part 3 Kernel Address Space JOS把32位线性地址虚拟空间划分成两个部分.其中用户环境(进程运行环境)通常占据低地址的那部分,叫用户地址空间.而操作系统内核总是占据高地址的 ...

  8. "不能在 DropDownList 中选择多个项。"其解决办法及补充

    探讨C#.NET下DropDownList的一个有趣的bug及其解决办法 摘要: 本文就C#.Net 环境下Web开发中经常使用的DropDownList控件的SelectedIndex属性进行了详细 ...

  9. 前馈网络求导概论(一)·Softmax篇

    Softmax是啥? Hopfield网络的能量观点 1982年的Hopfiled网络首次将统计物理学的能量观点引入到神经网络中, 将神经网络的全局最小值求解,近似认为是求解热力学系统的能量最低点(最 ...

  10. 2分钟 sublime设置自动行尾添加分号并换行:

    18:03 2016/4/162分钟 sublime设置自动行尾添加分号并换行:注意:宏文件路径要用反斜杠/,2个\\会提示无法打开宏文件.不需要绝对路径很简单利用宏定义:1.录制宏:由于是录制动作宏 ...