表单元素验证的几种场景

表单元素验证的几种场景

weixin_30444105

于 2017-03-23 11:15:00 发布

61
 收藏
版权
表单验证在项目中使用还是比较多的，常见的场景我尝试着综合一下，只选取两个例子：

1，简单的表单验证：

    // 表单验证
    $inputForm.validate({
        rules: {
            consignee: "required",
            areaId: "required",
            address: "required",
            zipCode: {
                required:true,
                pattern:/^[0-9]{6}$/
            },
            phone: {
                required:true,
                pattern:/(\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$/
            }
        }
    });
2，表单提交时进行验证：

// 表单验证
    $inputForm.keypress(function(event){
        if(event.keyCode !=13 ){
            $inputForm.validate({
                rules: {
                    productCategoryId: "required",
                    name: "required",
                    sn: {
                        pattern: /^[0-9a-zA-Z_-]+$/,
                        remote: {
                            url: "check_sn.jhtml",
                            cache: false
                        }
                    },
                    price: {
                        required: true,
                        min: 0,
                        decimal: {
                            integer: 12,
                            fraction: ${setting.priceScale}
                        }
                    },
                    electronicPrice: {
                        min: 0,
                        decimal: {
                            integer: 12,
                            fraction: ${setting.priceScale}
                        }
                    },
                    cost: {
                        min: 0,
                        decimal: {
                            integer: 12,
                            fraction: ${setting.priceScale}
                        }
                    },
                    overReadFiguresj: {
                        min: 0,
                        decimal: {
                            integer: 12,
                            fraction: ${setting.priceScale}
                        }
                    },
                    overReadBook: {
                        min: 0,
                        decimal: {
                            integer: 12,
                            fraction: ${setting.priceScale}
                        }
                    },
                    overReadFigure: {
                        min: 0,
                        decimal: {
                            integer: 12,
                            fraction: ${setting.priceScale}
                        }
                    },
                    marketPrice: {
                        min: 0,
                        decimal: {
                            integer: 12,
                            fraction: ${setting.priceScale}
                        }
                    },
                    thcj: {
                        pattern:/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/
                    },
                    thzj: {
                        pattern:/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/
                    },
                    grossWeight: {
                        pattern:/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/
                    },
                    netWeight: {
                        pattern:/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/
                    },
                    importDate: {
                        pattern: /^[1-2][0-9][0-9][0-9][0-1]{0,1}[0-9][0-3]{0,1}[0-9]$/,
                    },
                    weight: "digits",
                    preEntryNumber: "digits",
                    pieces: "digits",
                    stock: "digits",
                    thhh: "digits",
                    thbb: "digits",
                    //thfd: "digits",
                    //thsl: "digits",
                    thsp: "digits",
                    thbeian: "digits",
                    point: "digits",
                    pages: "digits",
                    words: "digits"
                },
                messages: {
                    sn: {
                        pattern: "${message("admin.validate.illegal")}",
                        remote: "${message("admin.validate.exist")}"
                    }
                },
                submitHandler: function(form) {
                    var isRepeats1 = null;
                    var parameters1 = new Array();
                    $timePriceTable.find(".timePriceValueTr").each(function() {
                        var tdArr = $(this).children();
                        var parameter = tdArr.eq(0).find("span").text();
                        if ($.inArray(parameter, parameters1) >= 0) {
                            $.message("warn", "${message("admin.product.timePriceValueRepeat")}");
                            isRepeats1 = true;
                            return false;
                        } else {
                            parameters1.push(parameter);
                        }
                    });
                    if ($specificationIds.filter(":checked").size() > 0 && $specificationProductTable.find("tr:gt(1)").size() == 0) {
                        $.message("warn", "${message("admin.product.specificationProductRequired")}");
                        return false;
                    } else {
                        var isRepeats0 = false;
                        var parameters0 = new Array();
                        $specificationProductTable.find("tr:gt(1)").each(function() {
                            var parameter = $(this).find("select").serialize();
                            if ($.inArray(parameter, parameters0) >= 0) {
                                $.message("warn", "${message("admin.product.specificationValueRepeat")}");
                                isRepeats0 = true;
                                return false;
                            } else {
                                parameters0.push(parameter);
                            }
                        });
                        if (!isRepeats0&&!isRepeats1) {
                            $specificationProductTable.find("tr:eq(1)").find("select").prop("disabled", true);
                            addCookie("previousProductCategoryId", $productCategoryId.val(), {expires: 24 * 60 * 60});
                            form.submit();
                        }
                    }
                }
            });
        }else{
            return false;
        }
    });