【问题标题】:Client Side Validation for Blank Fields? [closed]空白字段的客户端验证? [关闭]
【发布时间】:2014-07-28 01:36:41
【问题描述】:

当用户输入一个文本框,然后在不输入数据的情况下进行制表符或点击退出时,有什么方法可以触发客户端 jQuery 验证?我可以让它触发的唯一方法是当有一个回发到服务器并且服务器验证开始时。

四处张望,但没有找到任何东西。

谢谢

这就是我正在尝试的

$('#firstName input').blur(function () {
        if (!$(this).val()) {
            $(this).addClass('input-validation-error');
        }
    });

也试过了……不走运

$(document).ready(function() {
        $('#firstName').keyup(function(event) {
            var input = $(this);
            var message = $(this).val();
            console.log(message);
            if (message) {
                input.removeClass("invalid").addClass("valid");
            } else {
                alert('ERROR');
            }
        });
    });

对于那些可能有这个问题的人,这对我有用,这是最干净的解决方案

$("input").focusout(function() {                
            if (!$(this).val()) {
                $(this).valid();
            }

        });

【问题讨论】:

  • 我认为您将不得不再看一些,然后返回您的代码,解释什么不起作用,您是如何尝试修复它的,并发布一个演示以重现问题。祝你好运。
  • 是的,你可以使用Regex
  • 教程和插件没完没了....你只是没有做太多的研究
  • 会做的家伙。最近一直在研究解决方案,但是当我发现它并没有改变课程时。我尝试在没有值时添加一个类,但由于某种原因它不会触发。 出于某种原因,它不会在页面上进行我的典型验证。

标签: c# jquery asp.net-mvc


【解决方案1】:

这个是测试过的,只是替换脚本的路径

<html>
<head>
    <script src="jquery-1.11.0.min.js"></script>
    <title></title>
</head>
<body>
    <p><input type="text" id="textbox" value="" /></p>
    <script>
        $(function () {
            $("#textbox").focusout(function () {
                //do your validation here
             if (this.value == '') {
                alert('you should enter text here');
            }
        });
        });
    </script>
</body>
</html>

【讨论】:

  • 我修改了这个,它对我有用。我会接受这个作为答案,但我想告诉人们我所做的一切。再次感谢伙计。
【解决方案2】:

尝试使用像 JQuery Validation 这样的 jquery 插件,而不是像这样处理小代码 sn-ps。

导入插件后,您的代码应如下所示。

    $("#registration_form").validate({ // your form id
        errorLabelContainer: $("div.register-status"), // your error label div
        wrapper: 'li', //error wrapper
        rules: { //the rules for your dom elements
        first_name: {required: true, minlength: 2},
        last_name: {required: true, minlength: 2}
        },
        messages: { //validation messages
            first_name: {required: "Please enter your first name", minlength: "Your first name is not long enough."},
            last_name: {required: "Please enter your last name", minlength: "Your last name is not long enough."}
        },
        submitHandler: function(form) { //your submit ajax handler
            $.ajax({
                type: "POST",
                url:  registerurl,
                data: $(form).serialize(),
                success:function showResponse(responseText, statusText, xhr, $form)  { 
                    $("div.register-status").hide().fadeIn().html(responseText);    
                    if(responseText=="success"){
                        $("div.register-status").hide().fadeIn().html("Please wait..."); 
                        $("#registration_form").clearForm();
                    }
                },
                error: function showResponse(responseText, statusText, xhr, $form)  { 
                    $("div.register-status").hide().fadeIn().html(responseText); 
                } 
             });            
            return false;
        }
    });

【讨论】:

  • 我已经将 jquery.validate.js 包含到我的页面中并使用客户端验证。我将尝试添加此代码,看看会发生什么。我假设这是同一个插件?
  • 考虑了几分钟并决定这是双重工作。我已经在我的 AccountViewModel 类中设置了服务器端验证要求,为什么要在视图本身中复制这些信息?我还必须复制验证规则。
  • 找到了更好更简单的验证解决方案。当它允许我时会发布它。
猜你喜欢
  • 2017-04-07
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2023-01-28
  • 1970-01-01
  • 2012-05-13
  • 1970-01-01
  • 2018-06-12
相关资源
最近更新 更多