jQuery Validate Plugin:如何验证下拉列表

时间:2012-11-26 23:04:27

标签: jquery html jquery-validate

我正在尝试使用jQuery Validate插件来验证下拉列表。它正确地验证了我的表格的其余部分。但它不适用于下拉列表。

这是我的jQuery:

$('#campaignForm').validate({
    rules: {
         campaign_name: {
             required: true
         },
         html_url: {
             required: {
                 depends: function(element) {
                     return $('#html_url').val() == 'none';
                 }
              }
         }
    },
    messages: {
        campaign_name: 'Please enter a campaign name',
        html_url: 'Please select a template'
    }
});

这是我的HTML:

<select name="html_url" id="html_url">
<option value="none">Select One...</option>
...
</select>

我做错了什么?我的变量名称是否以某种方式发生碰撞。广告系列名称规则运作正常。

3 个答案:

答案 0 :(得分:9)

如果您只想制作select元素required,则不会使用depends:,因为它不依赖于其他元素。在您的使用中,depends属性只是切换required规则。这里的问题不是required规则......它不需要切换。问题是当所有选项都包含required时,value规则将无效,因为始终会满足required

只需使用value=""作为默认选项,然后像设置其他元素一样设置规则。

<option value="">Select One...</option>

jsFiddle DEMO

<强> HTML:

<form id="campaignForm">   
    <select name="html_url" id="html_url">  
        <option value="">Select One...</option>
        <option value="one">ONE</option>
        <option value="two">TWO</option>
    </select>
    <input type="submit" />
</form>​

<强> jQuery的:

$(document).ready(function() {
    $('#campaignForm').validate({
        rules: {
            html_url: {
                required: true
            }
        },
        messages: {
            html_url: {
                required: 'Please select a template'
            }
        }
    });
});​

答案 1 :(得分:4)

如果出于某种原因你不能像Spark所说的那样将值设置为空白,你可以添加自己的JQuery验证函数,而不是默认的默认预设。

$.validator.addMethod("aFunction",
    function(value, element) {
        if (value == "none")
            return false;
        else
            return true;
    },
    "Please select a value");

$('#campaignForm').validate({
    rules: {
         campaign_name: {
             required: true
         },
         html_url: {
             aFunction: true
         }
    },
    messages: {
        campaign_name: 'Please enter a campaign name',
        html_url: 'Please select a template'
    }
});

答案 2 :(得分:-1)

questions = open(name='question_form.xml', mode='r').read() #passing qual questions
answers = open(name='answerkey.xml', mode='r').read() #passing answerkey