首页定义验证实体

using System.ComponentModel.DataAnnotations;
using System.Web.Mvc; namespace MvcApplication1.Models
{
public class Student
{
[Display(Name = "名称")]
[Required(AllowEmptyStrings = false, ErrorMessage = "输入名称")]
public string Name { get; set; } [Display(Name = "Age")]
[Required(AllowEmptyStrings = false, ErrorMessage = "输入年龄")]
[Remote("CheckAge", "Home")]
public int Age { get; set; }
}
}

编写Controller

using MvcApplication1.Models;
using System.Web.Mvc; namespace MvcApplication1.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
} [HttpPost]
public ContentResult Index(Student student)
{
return Content("success");
} public JsonResult CheckAge(int age)
{
if (age < )
{
return Json(true, JsonRequestBehavior.AllowGet);
}
return Json("Error", JsonRequestBehavior.AllowGet);
}
}
}

前端

@model MvcApplication1.Models.Student

@{
ViewBag.Title = "index";
} <h2>index</h2>
<script src="~/script/jquery.min.js"></script>
<script src="~/script/jquery.validate.min.js"></script>
<script src="~/script/jquery.validate.unobtrusive.min.js"></script>
<script src="~/script/jquery.form.js"></script>
@using (Html.BeginForm(null, null, FormMethod.Post, new { name = "from1", id = "from1" }))
{
@Html.TextBoxFor(model => model.Name)
@Html.ValidationMessageFor(model => model.Name)
@Html.TextBoxFor(model => model.Age)
@Html.ValidationMessageFor(model => model.Age)
<input type="submit" value="提交" id="js_button" />
}

采用Mvc + jquery.validate.js 验证好处:

1.快速开发

2.支持后台验证 [Remote("CheckAge", "Home")]

3.不用在脚本中写入验证规rules如:

        $("#from1").validate({
rules: {
Name: { required: true, maxlength: },
Age: { required: true, maxlength: }
}
});

实现Ajax

网上查找基本上都是

   $(document).ready(function () {
$("#from1").validate({
submitHandler: function (form) {
form.submit();
}
})
})

但是此方法根本就不能进入,因为jquery.validate.unobtrusive.min.js已经重写了jquery.validate.min.js的validate方法

看了源码

b.valid()  b是个form 所以果断修改验证代码如下,亲测成功。

帮你们解决问题的,点个赞

作者:释迦苦僧  出处:http://www.cnblogs.com/woxpp/p/5791296.html

本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。

MVC validate.js下使用 ajaxSubmit的更多相关文章

  1. jquery.validate.js在IE8下报错不运行

    因为项目要表单验证,所以特意去找了jquery.validate这个应该是jquery官方团队出品的表单验证插件. 实际应用时,却在IE8调试时碰到了问题. 从jquery.validate官网下载了 ...

  2. Asp.Net 服务器控件下使用Jquery.validate.js

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. jQuery验证控件jquery.validate.js使用说明

    官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuery plugin: Validation 使用说明 转载 ...

  4. jquery.validate.js插件使用

    jQuery验证控件jquery.validate.js使用说明+中文API 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-valid ...

  5. jQuery表单验证插件——jquery.validate.js

    官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script src="../j ...

  6. jQuery插件之验证控件jquery.validate.js

    今天学习一下jQuery.Validate插件,为便于日后翻阅查看和广大博客园园友共享,特记于此. 本博客转载自:jQuery Validate jQuery Validate 插件为表单提供了强大的 ...

  7. Jquery.validate.js表单验证插件的使用

    作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...

  8. aspx中的表单验证 jquery.validate.js 的使用 以及 jquery.validate相关扩展验证(Jquery表单提交验证插件)

    这一期我们先讲在aspx中使用 jquery.validate插件进行表单的验证, 关于MVC中使用 validate我们在下一期中再讲     上面是效果,下面来说使用步骤 jQuery.Valid ...

  9. (转)jQuery验证控件jquery.validate.js使用说明+中文API

    官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuery plugin: Validation 使用说明 转载 ...

随机推荐

  1. Good Bye 2016 - B

    题目链接:http://codeforces.com/contest/750/problem/B 题意:地球的子午线长度为40000,两极点的距离为20000.现在你从北极出发,按照题目输入方式来走. ...

  2. DelphiXE10.1项目中增加预编译的方法

    操作: 菜单选择Proceject->Options->Delphi Compilerz在Conditional Defines(第一行)中添加预编译标识.例:VCL代码:uses{$IF ...

  3. oracle(sql)基础篇系列(二)——多表连接查询、子查询、视图

        多表连接查询 内连接(inner join) 目的:将多张表中能通过链接谓词或者链接运算符连接起来的数据查询出来. 等值连接(join...on(...=...)) --选出雇员的名字和雇员所 ...

  4. 第二天 ci执行流程

    第二天 ci执行流程 welcome 页面 this this->load 单入口框架index.php 两个文件夹 system application定义 定义常亮路径 载入 codeign ...

  5. 【JBOSS】控制台数据库连接信息

    数据库连接 信息 进入         在这个页面中(IP和端口已自己的为主):ConnectionCount 这个项目代表在服务开启后,总共使用的连接数!ConnectionCreatedCount ...

  6. Android图书应用-西游记

    下载App 屏幕截图:          功能介绍:1. 侧边滑动目录导航2. 阅读偏好设置3. 记忆阅读进度 内容介绍: 西游记,中国古典名著,内容分三大部分: 第一部分(一到七回)介绍孙悟空的神通 ...

  7. appium过程中的问题

    1.在eclipse中点击Genymotion Virtual Device Manager ,选择虚拟设备,点击start后,无反应.    解决方法:Help/Install New Softwa ...

  8. UML类图关系--继承(泛化)、实现、关联、聚合、组合、依赖

    在UML类图中,常见的有以下几种关系:  泛化(Generalization),  实现(Realization),关联(Association),聚合(Aggregation),组合(Composi ...

  9. angular 中父元素ng-repeat后子元素ng-click失效

    在angular中使用ng-repeat后ng-click失效,今天在这个上面踩坑了.特此记录一下. 因为ng-repeat创造了新的SCOPE.如果要使用这个scope的话就必须使用$parent来 ...

  10. QT 文件对话框(QFileDialog)

    1.选择文件(上传.打开...) QString QFileDialog::getOpenFileName( QWidget *parent = , //parent,用于指定父组件.注意,很多Qt组 ...