Question

我正在使用表单验证jquery。并形成像这样的输入

<form id="form-valid">
 <select id="country" name="country" class="input-group form-control input-sm">
    <option value="Asia">Asia</option>
    <option value="America">America</option>
    <option value="Eropa">Eropa</option>
    <option value="Africa">Africa</option>
    <option value="Australia">Australia</option>
 </select>
 <input type="text" id="codetax" name="codetax"><input>
 <select id="status" name="status" class="input-group form-control input-sm">
    <option value="small">samll island</option>
    <option value="big">big island</option>
    <option value="medium">medium island</option>
 </select>
 <button class="btn btn-default btn-primary btn-sm btn-form-filter form-control"    data-target="tmppo" id="btnsave" type="button">Save</button>
</form>

但我的问题是，我需要检查国家是否是亚洲，税号和状态必须填写。但如果国家不是亚洲，税码和地位可能是空的。当我使用提交按钮时，我该怎么做？关于jquery表单验证，我还是新手。请帮助我。

更新确定它现在可以正常工作，我使用depends

进行验证

$('#form').validate({
            errorElement: 'span',
            errorClass: 'help-block',
            rules: {
                country: {
                    required: true
                },
                taxcode: {
                    required: {
                        depends: function(element) {
                            if ($('#country').val() == 'Asia') {
                                return true;
                            } else {
                                return false;
                            }
                        }
                    }
                },
            },
             messages: {
                codetax : "Pleasa instert taxcode
            },
        });

在代码html上我必须使用＆＃34; name＆＃34;得到规则。对于所有tq帮助我：）

Answer 1

我认为您希望通过documentation site上的validate使用.addMethod()库提供的内置方法。我修改了你的表单以更好地符合。

<script>
$(document).ready(function() {
    // Add the method here, you can modify the code inside as need be
    $.validator.addMethod("country", function(value, element) {
        if(value == 'Asia') {
            var getCodeTax  =   $('input[name=codetax]').val();
            if(getCodeTax === '') {
                return false;
            }
        }

        return true;

    }, 'You must select tax code');

    $('form').validate({
        rules: {
            status:"required",
            // This applies the country method above to the country dropdown
            country: "country"
        },
        messages: {
        }
    });
});
</script>
<form id="form-valid" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
 <select name="country" id="country" class="input-group form-control input-sm">
    <option value="">Select</option>
    <option value="Asia">Asia</option>
    <option value="America">America</option>
    <option value="Eropa">Eropa</option>
    <option value="Africa">Africa</option>
    <option value="Australia">Australia</option>
 </select>
 <input type="text" id="codetax" name="codetax" />
 <select id="status" name="status" class="input-group form-control input-sm">
    <option value="small">samll island</option>
    <option value="big">big island</option>
    <option value="medium">medium island</option>
 </select>
 <input class="btn btn-default btn-primary btn-sm btn-form-filter form-control"  value="save"  data-target="tmppo" id="btnsave" type="submit">
</form>

Answer 2

您可以创建一个功能来检查按钮点击事件中选择的国家/地区类型

$( "btnsave" ).click(function() {
  var country = $("country").val();

  if (country == 'Asia')
  {
    //show required message here.
  }
}

Answer 3

更改要提交的按钮类型。

$(document).on('submit', '#form-valid' function(e){
var country = $("#country").val();
if(country == 'Asia'){
   if($('#codetax').val()=="" || $('#status').val()==""){
      e.preventDefault();
      //now form won't submit. Still need to add error messages.
      }
   }
});

如果您不想更改要提交的按钮类型，请执行以下操作：

$(document).on('click', '#btnsave' function(e){
var country = $("#country").val();
if(country == 'Asia'){
   if($('#codetax').val()!="" && $('#status').val()!=""){
      $('#form-valid').submit();
   }
   else{
      //add your error messages
   }
}
});

检查jquery上的表单验证

3 个答案: