标签: jquery-validate

这是我第一次使用 jQuery 验证，我遇到了问题。这是我的表单的 HTML：

<form id="signup" novalidate="novalidate">
            <div class="form-group">
              <label class="sr-only" for="emailAddress">Email address</label>
              <input type="email" class="form-control" id="emailAddress" placeholder="Enter email" data-required>
            </div>
            <div class="form-group">
              <label class="sr-only" for="emailAddressConfirm">Confirm Email address</label>
              <input type="email" class="form-control" id="emailAddressConfirm" placeholder="Confirm email" data-required>
            </div>
            <div class="form-group">
              <label class="sr-only" for="password">Password</label>
              <input type="password" class="form-control" id="password" placeholder="Password" data-required>
            </div>
            <div class="form-group">
              <label class="sr-only" for="passwordConfirm">Confirm Password</label>
              <input type="password" class="form-control" id="passwordConfirm" placeholder="Confirm Password" data-required>
            </div>
            <button type="submit" class="btn btn-primary">Sign up</button>
          </form>

还有我的 JavaScript：

$("form#signup").on("submit", function(){
    $("form#signup").validate({
        rules: {
            password: {
                required: true,
                minlength: …

我有两个页面，一个是主页面，第二个是 PartialView 页面，并使用 jquery get 方法在弹出窗口中显示

我的主页

@model CT.SmartQueue.Entity.QueueModel
@{
ViewBag.Title = "AdminPanel";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Queue Lists</h2>
<div class="col-lg-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>For Service Centre Only: </h5>
                        <div class="ibox-tools">

                        </div>
                    </div>
                    <div class="ibox-content">
                        <table class="table table-striped">
                            <tr>
                                <th>
                                    Code
                                </th>
                                <th>
                                    Name
                                </th>
                                <th>
                                    Description
                                </th>
                                <th>
                                    IsActive
                                </th>
                                <th>
                                    Edit
                                </th>
                            </tr>

                            @foreach (var item in Model.ClientQueueModel)
                            {
                                <tr>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.Code)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.Name)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.Description)
                                    </td>
                                    <td> …

我正在使用 Jquery 验证插件，一切正常，但是当我尝试验证复选框时出现错误：

TypeError: b is undefined

这是我的引导复选框脚本：

<div class="col-xs-8">
                    <div class="checkbox icheck">
                        <label>
                            <input type="checkbox" required> I agree to the <a href="#">terms</a>
                        </label>
                    </div>
                </div>

这是我使用的 jquery 验证：

$("#formRegister").validate({
            errorElement: "span",
            errorClass: "help-block",
            highlight: function (element, errorClass, validClass) {
                // Only validation controls
                if (!$(element).hasClass('novalidation')) {
                    $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
                }
            },
            unhighlight: function (element, errorClass, validClass) {
                // Only validation controls
                if (!$(element).hasClass('novalidation')) {
                    $(element).closest('.form-group').removeClass('has-error').addClass('has-success');
                }
            },
            errorPlacement: function (error, element) {
                if (element.parent('.input-group').length) {
                    error.insertAfter(element.parent());
                }
                else if (element.prop('type') === …

我一整天都在为 JQuery 验证问题而苦苦挣扎。它仅验证第一个字段。

我已经成功地在这里重现它：

$(document).ready(function() {
  $('#go').click(function() {
    
    console.log('go clicked');
    
    if ($('#detailsForm').valid()) {
      alert('if you see this then the form is valid.');
    }

  });
});

<!DOCTYPE html>
<html>

  <head>
    <script data-require="jquery@1.10.0" data-semver="1.10.0" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
    <script data-require="jquery-validate@1.10.0" data-semver="1.10.0" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.js"></script>
    <script data-require="jquery-validate@1.10.0" data-semver="1.10.0" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/additional-methods.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
    <h1>This doesn't work :(</h1>
    
     <form id="detailsForm">

        <div class="row guttered-bottom">

            <div class="col-md-6 col-xs-12">


                <div class="row">
                    <div class="col-md-12 col-xs-12">
                        <br />
                        First Name<div style="color:#E320C9">*</div>
                        <div class="input-container">
                            <input id="ReserveFirstName" type="text" class="input-large input-wide" placeholder="Enter your …

你能帮助将以下Javascript转换成jQuery等价吗？

// Let's use a lowercase function name to keep with JavaScript conventions
function selectAll(involker) {
    // Since ASP.NET checkboxes are really HTML input elements
    //  let's get all the inputs
    var inputElements = document.getElementsByTagName('input');

    for (var i = 0; i < inputElements.length; i++) {
        var myElement = inputElements[i];

        // Filter through the input types looking for checkboxes
        if (myElement.type === "checkbox") {

            // Use the involker (our calling element) as the reference 
            //  for our checkbox status
            myElement.checked = …

我正在尝试使用patern表单验证插件附带的扩展规则使用正则表达式验证密码.我已经尝试过很多来自互联网的表达方式,到目前为止,没有一个符合我的要求,或者由于某种原因,他们只是按照描述不起作 我需要的是验证以下内容:

1. 密码必须从6个字符到20个
2. 它必须包含至少一个大写字母
3. 它必须包含至少一个数字
4. 它必须包含至少一个小写字母
5. 必须有可能重复
6. 这个字符的可能性无关紧要
7. 它不能允许空格
8. 来自其子集的特殊字符应该是可选的

因此,用户应该能够输入以下示例:

1. aaaaaa1A
2. PASSW0RD
3. abCdef9
4. $$$ h1Tzzzz

我想到的只是看到这里是否有人可以帮助我.我不是正则表达专家.

如何使用自定义 CSS 类来显示错误消息？我不想设置标准 label.error 的样式。我想使用已有的 CSS 类。

这对我来说也没用,当我尝试这个时出现错误:

error.insertBefore(element)
error.css('float','left')

要么:

error.attr('style','float:left')

只有我可以像这样添加这些属性:

$(error).someproperty

这是我的代码因为我无法复制粘贴,因为我在TFS上工作并且不允许复制/粘贴.问题是,使用此代码我不能float left错误消息.我希望该错误出现在文本框的左侧和下方.更重要的是,我只是在测试,我把float =right它放在上面,所以忘了它.float:left也没有用.我检查了一下.

我有一个测验,我需要为一个confirm email address字段添加一些验证,基本上它只需匹配上面字段中给出的电子邮件地址.我使用以下javascript,我可以在这里添加一些东西,以确保电子邮件匹配？

if ($('#mtQuiz').length > 0) {
    $('#myQuiz').validate({
        errorElement: "em",
        errorContainer: $("#warning"),
        rules: {
            'entry[first_name]':            'required',
            'entry[last_name]':     'required',
            'entry[email]': {
                required: true,
                email: true
            },
            'entry[confirm_email]': {
                required: true,
                email: true
            }
        },
        messages: {
            'entry[first_name]':    'Please enter first name',
            'entry[last_name]': 'Please enter last name',
            'entry[email]': {
                required: ' Please enter a valid email address',
                minlength: 'Not a valid email address'
            },
            'entry[confirm_email]': {
                required: ' Please make sure email matches above',
                minlength: 'Does not match above …

早上好，我想知道您是否可以在这个问题上对我有所帮助：当另一个输入值满足条件时，我将根据需要对select元素应用验证。我正在使用验证jQuery插件来做到这一点。这是伪代码：（if(textbox == "valueX"){mySelectEelement is required;}表示我必须从select元素中选择一个值。）。因此出于某种原因，select元素未采用我想应用的验证。

请查看我为此目的在Plunker上创建的完整示例代码：

<html lang="en">
<head>
 <title></title>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script src="https://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<script>
$( function() {
$.validator.setDefaults({
      //debug: true,
      success: "valid"
    });

    $( "#myform" ).validate({
      rules: {
        borough: {
              required: false
        }
      }
    });

    $('#state').on('change', function () {
    if ($(this).val().toUpperCase() == "NY" || $(this).val().toUpperCase() == "NEW YORK") {
        $('#borough').rules('add', {
            required: true
        });
    } else{
       $('#borough').rules('remove');
    }
});    
} );
</script>

</head>
<body>
<form id="myform">
<div>
<p id="pid"></p>
<input id='text' type='text' …

我试图找到一种方法来选择两种语言之间的切换，因此我需要在messages_en.js文件中存储一些自定义消息。

是否可以将自定义消息存储在messages_en.js中，例如：

name: {
   required: 'Enter name',
   minlength: 'Name should consist of min. {0} characters',
   maxlength: 'Name is too long',
}

要么

name: $.validator.format( "{0} should consist of min. {1} characters" ),

{0}字段名称在哪里？

messages_en.js

$.extend( $.validator.messages, {
  required: "This field is required.",
  remote: "Please fix this field.",
  email: "Please enter a valid email address.",
  url: "Please enter a valid URL.",
  date: "Please enter a valid date.",
  dateISO: "Please enter a valid date (ISO).",
  number: "Please enter a …

我只是给了validate(errorElement,...)的选项,我设置了规则,没有调用validate方法,或者将它与任何事件相关联,但是jQuery自动验证,如何控制它何时验证？

如何使用jQuery Validation插件验证正则表达式？在这段代码中,我们可以使用一个jQuery插件"jQuery Validation"插件验证表单,但我不知道使用此插件验证正则表达式.

 <!DOCtype html>
   <html>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.min.js"></script>
<body>
<form method="post" name="signup_form" enctype="multipart/form-data">
<table>
<tr><td>First Name:</td><td><input type="text" name="first_name" placeholder="First name" required><span> *</span></td></tr>
<tr><td>Middle Name:</td><td><input type="text" name="middle_name" placeholder="Middle Name"></td></tr>
<tr><td>Last Name:</td><td><input type="text" name="last_name" placeholder="Last Name" required><span> *</span></td></tr>
<tr><td>Username:</td><td><input type="text" name="username" placeholder="Username" required><span> *</span></td></tr>
<tr><td>Password:</td><td><input id="password1" type = "password" name="password" required/><span> *</span></td></tr>
<tr><td>Re-Enter Password:</td><td><input class="left" id="password_again" type = "password"  name="password_again" required/><span> *</span></td></tr>
<tr><td>Email:</td><td> <input id="email" type="email" name="email" required/><span> *</span></td></tr>
<tr><td>Gender:</td><td><input type="radio" name="gender" …