如何使用选择列表验证输入字段?

时间:2019-08-30 06:05:15

标签: jquery jquery-validate

我需要有关jQuery验证插件的一些帮助,该插件的输入字段“ driveamount”在选择isdrive下拉列表后具有值。

如果我选择“是”,则必须在输入字段“ driveamout”中输入金额。 如果我选择“否”,则不需要输入字段“ driveamout”。

这是表格的一部分:

     <div class="row">

        <section class="col col-6">
            <label class="input">Amount
                <input type="text" name="driveamount" id="driveamount" value=" ">
            </label>
        </section>

        <section class="col col-6">
            <label class="select">Is Drive 
                <select name="isdrive " id="isdrive " onChange="Choice();">
                    <option value="">Select</option>
                    <option value="yes">Yes</option>
                    <option value="no">No</option>
                </select>

            </label>
        </section>                                          
    </div>

    $.validator.addMethod('driveaway', function (value, el, param) {
            if($('#isdrive').val() == "yes")
               return false;
            },"Please provide enter amount"); // Message added

 $("#addcar").validate({
          rules: {

            driveamount: {
              driveaway : true,
            },


          },
          messages: {
            }
          }
        });

3 个答案:

答案 0 :(得分:0)

// add the rule here
 $.validator.addMethod("valueNotEquals", function(value, element, arg){
  return arg !== value;
 }, "Value must not equal arg.");

 // configure your validation
 $("form").validate({
  rules: {
   SelectName: { valueNotEquals: "default" }
  },
  messages: {
   SelectName: { valueNotEquals: "Please select an item!" }
  }  
 });

答案 1 :(得分:0)

终于解决了。感谢所有人。

$.validator.addMethod('driveaway', function (value, el, param) {
            if($('#isdrive').val() == "yes" ){
              if($('#daa').val() != ""){
                return true;
              }
                return false;

            }else if($('#isdrive').val() == "no"){
                return true;
            }else {
              return true;
            }
            // if($('#isdrive').val() == " " )
            //    return true;
            // if($('#isdrive').val() == "yes" )
            //    return false;
            // if($('#isdrive').val() == "no")
            //    return true;
        },"Please provide enter correct amount"); // Message added

    $("#addcar").validate({
              rules: {

                driveamount: {
                  driveaway : true,
                },


              },
              messages: {
                }
              }
            });

答案 2 :(得分:-1)

尝试这个

$(document).ready(function(){
$("#isdrive").change(function() {
    var selectedCountry = $(this). children("option:selected"). val();  
    if(selectedCountry == "yes"){
        $("#driveamount").prop('required',true);
    }
    else if(selectedCountry == "no"){           
        $("#driveamount").removeAttr("required");
    }
}); });

这是您的html

    <div class="row">
    <section class="col col-6">
        <label class="input">Amount
            <input type="text" name="driveamount" id="driveamount" value=" ">
        </label>
    </section>

    <section class="col col-6">
        <label class="select">Is Drive 
            <select name="isdrive" id="isdrive">
                <option value="">Select</option>
                <option value="yes">Yes</option>
                <option value="no">No</option>
            </select>

        </label>
    </section>                                          
  </div>