zoukankan      html  css  js  c++  java
  • 爱上MVC系列~前端验证与后端数据有效性验证

    回到目录

    有一句话,在10年前就是真理,到现在也一直都是,“前端验证可以没有,但后端验证必须要有”,这句话相信大家都没有意见吧,前端验证一般指通过JS方式实现的,友好的,个性的验证方式,而后端验证是指从表单提交过来,要进行入库之前的,数据有效性的验证,它不需要有美丽的外表,它需要有的仅仅是“有效”!

    下面我将到MVC环境里的前端验证和后端验证作一个详细的说明,一个使用上的说明。

    前端验证(KnockoutJs实现)

      //创建订单使用knockoutJs
        var CreateOrder = function () {
            var self = this;
            self.productid = ko.observable().extend({
                required: true
            });
            self.productname = ko.observable().extend({
                required: true
            });
            self.username = ko.observable().extend({
                required: true
            });
            self.price = ko.observable().extend({
                required: true,
                min: { params: 1, message: "价格要是大于(0)的整数!" }
            });
            self.count = ko.observable().extend({
                required: true,
                min: { params: 1, message: "您最少也要买一个吧!" },
                max: { params: 100, message: "最大一次只能买(100)个!" }
            });
            self.Do = function () {//ko方法名需要是大写的
                self.errors = ko.validation.group(self);
                if (self.isValid()) {
                    $.ajax({
                        url: "/order/doOrder",
                        type: "POST",
                        data: { productid: self.productid(), productname: self.productname(), price: self.price(), count: self.count(), username: self.username() },
                        success: function (data) {
                            if (data.code == 1) {
                                location.href = location.href;
                            }
                            else
                                alert(data.code);
                        }
                    })
    
                } else {
                    self.errors.showAllMessages();
                }
            }
        }
        ko.applyBindings(new CreateOrder());

    后端验证(数据实体有效性验证和ViewModel业务规则验证)

    在这里多说两句,数据实体有效性验证是指和数据表相关的验证规则,如你的UserName字段长度为128字符,那么,你的实体验证的长度就是128,而ViewModel业务规则验证是指针对具体业务设计的视图模型,如用户注册模块,在这个模块里,你的UserName被产品经理规则为50个字符,那么,你的这个业务规则验证的长度就是50,当然,你的其它业务可能也用到了UserName字段,而它的业务规则当然可以不同,这就是有效性和业务规则。

    下面代码是一个返回Json结果的Post请求方法,代码如下

            public JsonResult DoOrder(int productid, string username, string productname, decimal price, int count)
            {
    
                var entity = new Entity.Order_Info
                {
                    TotalPrice = price * count,
                    UserId = userid,
                    UserName = username,
                    AddDate = DateTime.Now,
                    Info = "用户下单",
                    Order_Detail = new List<Order_Detail> { new Order_Detail { Count = count, ProductId = productid, ProductName = productname, SalePrice = price } }
                };
    
                if (productid <= 0)
                {
                    ModelState.AddModelError("ProductId", "商品ID不合法...");
                }
    
                #region 在action里拼接ModelState错误消息
                var errors = new StringBuilder();
                foreach (string key in ViewData.ModelState.Keys)
                {
                    ModelState modelState = ViewData.ModelState[key];
                    foreach (ModelError error in modelState.Errors)
                    {
                        errors.Append(error.ErrorMessage + ",");
                    }
    
                }
                #endregion
    
                if (entity.IsValid && ModelState.IsValid)
                    orderService.DoOrder(entity);
                else
                    return Json(new { code = entity.GetRuleViolationMessages() + errors });
    
                return Json(new { code = 1 });
            }

    回到目录

  • 相关阅读:
    如何设置nginx日志格式来查看负载分担结果
    Nginx缓存使用官方教程及常见问题解答
    nginx缓存和flask_cache
    flask_wtf/wtforms几个坑点,先简单记此
    maven-dependency-plugin插件的使用
    maven+jenkins+jmeter性能测试:maven把项目依赖拷贝到项目指定位置
    sudo:抱歉,您必须拥有一个终端来执行 sudo 解决办法;ssh执行sudo命令的方法;给用户增加sudo免密权限
    innerHTML引起IE的内存泄漏
    innerHTML与IE浏览器内存泄露问题
    IE内存泄露与无法回收研究小结
  • 原文地址:https://www.cnblogs.com/lori/p/4104509.html
Copyright © 2011-2022 走看看