user.js

最新推荐文章于 2024-09-05 09:09:01 发布

原创最新推荐文章于 2024-09-05 09:09:01 发布 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

web 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一个使用jQuery插件实现的表单验证方法，并详细解释了如何设置各种验证规则，如长度验证、电话号码格式验证等。同时，还展示了如何在通过验证后通过AJAX提交表单数据。

$.extend($.fn.validatebox.defaults.rules, {
    midLength: {
        validator: function(value,param){
            return value.length>= param[0] && value.length<= param[1];
        },
        message: '长度为4-8之间'
    },
    equalLength: {
        validator: function(value,param){
            return value.length == param[0] ;
        },
        message: '密码长度为6位'
    },
    phoneValidator: {
        validator: function(value){
            //var flag=/^((13[0-9])|(14[5|7])|(15([0-3]|[5-9]))|(18[0,5-9]))\\d{8}$/.test(value);
            var flag=true;
            return flag  ;
        },
        message: '联系电话格式错误'
    }
});

$('#email').validatebox({
    required:true,
    validType:'email',
    missingMessage:'邮箱必填'

});

$('#age').numberbox({
    min:0,
    max:100,
    required:true,
    missingMessage:'年龄必填',
    precison:0

});
/*
$('#phone').numberbox({

    required:true,
    missingMessage:'联系方式必填',
    precison:0

});*/
$('#birthday').datebox({

    // required:true,
    // missingMessage:'出生日期必填',
    editable:false,
    formatter:$.fn.datebox.defaults.formatter = function(date){
        var y = date.getFullYear();

        var m = date.getMonth()+1;
        if(m<10){
            m="0"+m;
        }
        var d = date.getDate();
        if(d<10){
            d="0"+d;
        }
        return y+'-'+m+'-'+d;
    }
});
$('#city').combobox({
    url:'/getAllCity',
    valueField:'id',
    textField:'name',
    limitToList:true,
    required:true

});

$('#save').click(function (){
    if($('#myform').form('validate')){
        // var json_data = {
        //     "name":$('#name').val(),
        //     "password":$('#password').val(),
        //     "email":$('#email').val(),
        //     "age":$('#age').val(),
        //     "phone":$('#phone').val(),
        //     "sex":$('input[name="sex"]:checked').val(),
        //     "city":$('#city').val(),
        //     "birthday":$('#birthday').val()
        // };
        var id=$('#userId').val();
        $.ajax({
            type:'post',
            //contentType:"application/json",
            url:(id==null||id=="") ?'/userAdd':'/userUpdate?userId='+id,
            cache:false,
           // data:JSON.stringify(json_data),
            //data:JSON.stringify({"name":$('#name').val(),"password":$('#password').val(),"age":$('#age').va(),"sex":$('#sex').val()}),
            data:$('#myform').serialize(),
            //data:$('#myform').serializeArray(),
            dataType:'json',
            success:function (data) {
                $('#mydailog').dialog('close');
                $('#user_grid').datagrid('reload');
                $.messager.show({
                    title:'提示信息',
                    msg:data.msg
                });
            },
            error:function (data) {
                $.messager.show({
                    title:'提示信息',
                    msg:data.msg
                })
            }
        })
    }else{
        $.messager.show({
            title:'提示信息',
            msg:'数据验证不通过，不能保存'
        })
    }


});

$('#close').click(function (){
    $('#mydailog').dialog('close');
});

$('#clear').click(function (){
    $('#search_form').form('clear');
    $('#user_grid').datagrid('reload',{

    });

});

$('#search').click(function () {

    var userNumber=$('#userNumber').val();
    var userName=$('#userName').val();
    var userSex=$('#userSex').val();
    var userCity=$('#userCity').val();
    var userPhone=$('#userPhone').val();
    var userEmail=$('#userEmail').val();
    if(userNumber=='' && userName=='' && userSex==null && userCity=='' &&  userPhone=='' && userEmail==''){
        $.messager.show({
            title:'提示信息',
            msg:'至少选择一个查询条件！',
            style: {
            }
        });
    }else {
        $('#user_grid').datagrid('load',{
            "id":userNumber,
            "name":userName,
            "sex":userSex,
            "city":userCity,
            "phone":userPhone,
            "email":userEmail
        });
    }
});