Question

我正在尝试制作一个选择“报价”的表格，如果选择“租赁”选项，则需要“扁平化”，但如果选择“促销”，那么它就会成为“促销”。需要。我不知道该怎么做。

我正在使用jQuery Form Plugin。

       <form id="item" name="item" method="post" action="">                            
        <fieldset>
        <h3>Type</h3> 
        <label for="property_type">offer</label>  
        <div class="input">
        <select id="property_type" name="property_type">    
        <option selected="selected" value="">Select your offer</option>
        <option value="rent">rent</option>
        <option value="sale">sale</option>
        </select>
        </div>
        </fieldset>

        <fieldset class="rent clearfix hide">
          <label for="requiered by rent">show + requiered by rent</label> 
          <select id="rentflat" name="rentflat">
          <option selected="selected" value="">Select</option>
          <option value="1">condition 1</option>
          <option value="2">condition 2</option>
          </select>
        </fieldset>

        <fieldset class="sale clearfix hide">
          <label for="requiered by sale">show requiered by sale</label> 
          <select id="saleflat" name="saleflat">
          <option selected="selected" value="">Select</option>
          <option value="1">condition 1</option>
          <option value="2">condition 2</option>
          </select>
        </fieldset>

        <button type="submit" class="btn">inserieren</button>

      </form>

我的验证脚本

      $(document).ready(function () {
          $("#item").validate({
              rules: {
                  property_type: {
                      required: true,
                      rentflat: {
                          depends: function () {
                              return $('#item select[name="property_type"]').val() === 'rent';
                          }
                      },
                      saleflat: {
                          depends: function () {
                              return $('#item select[name="property_type"]').val() === 'sale';
                          }
                      }
                  },
                  messages: {
                      property_type: "offer is required!",
                      rentflat: "rentflat is required!",
                      saleflat: "saleflat is required!"
                  }

              }
          });
      });

生活的例子在这里jsbin

Answer 1

你的嵌套语法都被搞砸了。

您的评论代码：

rules: {
    property_type: {
        required: true,
        rentflat: {  // <-- does not go inside of 'property_type'
            // depends function belongs inside of a rule
            depends: function () {
                return $('#item select[name="property_type"]').val() === 'rent';
            }
        },
        saleflat: {  // <-- does not go inside of 'property_type'
            // depends function belongs inside of a rule
            depends: function () {  
                return $('#item select[name="property_type"]').val() === 'sale';
            }
        }
    },
    messages: {  // <-- does not go inside of 'rules' option
        property_type: "offer is required!",
        rentflat: "rentflat is required!",
        saleflat: "saleflat is required!"
    }

}

1）您错误地将messages放在rules内。他们是兄弟姐妹。

2）您错误地将rentflat和saleflat字段：规则声明放在property_type字段：规则声明中。同样，所有字段：规则声明都是彼此的兄弟，所以你不能把它们放在另一个中。

3）您的depends功能正确无误。但是，您没有将depends函数分配给规则。您的depends函数必须是required规则声明中<（em> in ）的值。

固定版本：

// this is the 'rules' option
rules: {    
    property_type: {      // <-- field name
        required: true    // <-- rules
    },
    rentflat: {           // <-- field name
        required: {       // <-- rules
            // depends function inside of 'required' rule
            depends: function () {  
                return $('#item select[name="property_type"]').val() === 'rent';

            }
        }
    },
    saleflat: {           // <-- field name
        required: {       // <-- rules
            // depends function inside of 'required' rule
            depends: function () { 
                return $('#item select[name="property_type"]').val() === 'sale';
            }
        }
    }
},

// this is the 'messages' option, sibling of 'rules' option    
messages: {  
    property_type: "offer is required!",
    rentflat: "rentflat is required!",
    saleflat: "saleflat is required!"
}

工作版本：http://jsfiddle.net/knLXp/

在动态表单中验证需要选项（jQuery）？

1 个答案: