jquery validate remote的用法

简介: JS: rules: { Email: { required: true, email: true }...

JS:

rules: {
                Email: {
                    required: true,
                    email: true                    
                },
                Password: {
                    required: true,
                    remote: {
                        url: "/Users/Login",
                        type: "Post",
                        data: {
                            Email: function () { return $("#Email").val(); },
                            Password:function(){return $("#Password").val();}
                        }
                    }
                   
                },
                remember: {
                    required: false
                }
            },

cshtml:

<form class="login-form" action="/Users/Login" method="post">
            <h3 class="form-title">Sign In</h3>
            <div class="alert alert-danger display-hide">
                <button class="close" data-close="alert"></button>
                <span>Email or Password is wrong!</span>
            </div>
            <div class="form-group">
                <label class="control-label visible-ie8 visible-ie9">Email</label>
                <input class="form-control form-control-solid placeholder-no-fix" type="text" autocomplete="off" placeholder="Email" name="Email" id="Email">
            </div>

            <div class="form-group">
                <label class="control-label visible-ie8 visible-ie9">Password</label>
                <input class="form-control form-control-solid placeholder-no-fix" type="password" autocomplete="off" placeholder="Password" name="Password" id="Password"/>
            </div>
            <div class="form-actions">
                <button type="submit" class="btn btn-success uppercase">Login</button>
                <label class="rememberme check">
                    <input type="checkbox" name="remember" value="1" />Remember
                </label>
                <a href="javascript:;" id="forget-password" class="forget-password">Forgot Password?</a>
            </div>
            <div class="create-account">
                <p>
                    <a href="javascript:;" id="register-btn" class="uppercase">Register an account</a>
                </p>
            </div>
        </form>

Controller:

[HttpPost]
        public ActionResult Login(string Email,string Password)
        {
            string Msg = "";
            try
            {
                string outmsg = "";
                WeUser user = wbll.ULogin(Email, Password, out outmsg);
                switch (outmsg)
                {
                    case "-1": //没有此帐户或帐户错误
                        Msg = "false";
                        break;
                    case "error": //密码错误
                        Msg = "false";
                        break;
                    case "succeed":
                        Msg = "true";
                        return RedirectToAction("Index", "UsersCenter");                       
                    default:
                        break;
                }
            }
            catch
            {
                Msg = "false";
            }
            return Content(Msg);
        }

当密码输入框失去焦点时出现如下提示:

当点击“LOGIN"提交登录时会出现如下提示:

学习交流群:364976091
相关文章
|
2月前
|
JavaScript
jQuery :nth-of-type(n)选择器的用法详解
jQuery中,:nth-of-type(n)选择器可以对selector选择器匹配选择到的所有HTML元素进行二次匹配选择,为了更好地阐述:nth-of-type(n)的语法,这里假设selector是一个元素p选择器,如此,:nth-of-type(n)可以用于匹配p元素选择器选择到的p元素指向的父元素中第n个类型为p的子元素,而且与p是否是该父元素的第n个子元素无关,比如
48 5
|
9月前
|
JavaScript 前端开发 API
【前端用法】jQuery在线引用地址(全)
【前端用法】jQuery在线引用地址(全)
1243 0
|
26天前
|
JavaScript 前端开发
必知的技术知识:jQuery中queue和dequeue的用法
必知的技术知识:jQuery中queue和dequeue的用法
|
9月前
|
缓存 前端开发 JavaScript
【前端用法】jquery获取当前页面的URL信息
【前端用法】jquery获取当前页面的URL信息
67 0
|
2月前
|
JavaScript 程序员
让我们一起抄代码,JQuery 用法整理
让我们一起抄代码,JQuery 用法整理
40 0
|
JavaScript 前端开发
Form表单利用Jquery Validate验证以及ajax提交
Form表单利用Jquery Validate验证以及ajax提交
63 0
|
存储 JavaScript 前端开发
【前端每日一问002】jquery中each与data方法的用法与概念
【前端每日一问002】jquery中each与data方法的用法与概念
|
JavaScript 前端开发
将jquery validate校验框架的remote异步验证设置为同步校验
将jquery validate校验框架的remote异步验证设置为同步校验
298 0
将jquery validate校验框架的remote异步验证设置为同步校验
|
JavaScript
关于JQuery validate表单校验插件对级联下拉框的校验问题
关于JQuery validate表单校验插件对级联下拉框的校验问题
228 0
关于JQuery validate表单校验插件对级联下拉框的校验问题
|
JavaScript 数据安全/隐私保护
jQuery的DOM文档对象模型,常见的事件,遍历,validate插件,自定义事件方法
jQuery的DOM文档对象模型,常见的事件,遍历,validate插件,自定义事件方法
113 0
jQuery的DOM文档对象模型,常见的事件,遍历,validate插件,自定义事件方法