双重保险——前端bootstrapValidator验证+后台MVC模型验证

咱们在前端使用BoostrapValidator插件验证最基本的格式要求问题,同时在后台中,使用MVC特有的模型验证来作双重保险。对于boostrapValidator我就不说了,具体请看《bootstrap登入注册时表单验证明现》。而对于后端的模型验证这就是MVC的知识了,我也是很久之前研究过,如今都忘得差很少了,临时捡起来了,在这里我就详细说说。首先是咱们的前端Razor页面也就是咱们的cshtml页面须要引入实体类,假设实体类是UserModel类,它记录了最基本的用户名,密码,邮箱等。在前端的cshtml页面中咱们引用这个类,而后就是正常的html结合bootstrap样式的前端代码编写,可是在这里建议使用UserModel类中的字段来命令标签的id和name属性,若是乱取名,MVC框架怎么来识别是哪一个类?所以在这里建议id和name值都取做UserModel类的字段值。然后在标记了[HttpPost]的Action方法中,将UserModel用做参数传递进来,你就会发现前端的值已经绑定在了相应的字段上了。那么怎么来作后端验证呢?这就须要用到注解属性了。咱们在UserModel类上根据咱们的须要标注[Required][RegularExpression()]等注解属性。而后在action方法中使用:html

ModelState.IsValid

来作判断,若是不知足要求,MVC框架的模型绑定会给咱们将上面的值设置为false。接下来就是咱们本身的判断了。
可是在这里要注意,前端的boostrapValidator插件不能和表单的submit()事件同时使用,举个例子:前端

$(function(){ $(form).boostrapValidator(....); $(form).submit(); //这两个不能同时使用,要否则不会提交表单到后台.
})

bootstrapValidator插件与form.submit()事件冲突,不知道为何就是验证完以后就是不能提交表单,最好仍是使用ajax提交吧。ajax

同时在前端应该判断好bootstrapValidator是否验证经过再去提交表单。也就是说先判断bootstrapValidator.IsValid(),再去提交表单。bootstrap

最好销毁bootstrapvalidator插件并从新加载验证的代码:后端

$("form").data("bootstrapValidator").destory(); $("form").data("bootstrapValidator", null);

参考:http://www.cnblogs.com/RegicideGod/archive/2013/02/04/2892451.html框架

相关文章
相关标签/搜索