4

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>

私は何を間違っていますか？私の変数名はどういうわけか衝突していますか？キャンペーン名のルールは正常に機能します。

4

3 に答える 3

10

selectelementを作成したいだけの場合は、別の elementに「依存」しないため、required使用しません。あなたの使用法では、プロパティは単にルールを切り替えています。ここでの問題はルールではありません...トグルする必要はありません。問題は、常に満たされるため、すべてのオプションがすでに を含んでいる場合、ルールが機能しないことです。depends:dependsrequiredrequiredrequiredvaluerequired

デフォルトのオプションを使用するvalue=""だけで、他の要素と同じようにルールを設定できます。

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

jsFiddle デモ

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'
            }
        }
    });
});​
于 2012-11-27T00:30:31.180 に答える