0

ボタンのグループがあり、次のフォームに進むにはそのうちの 1 つをクリックする必要があります。

<div class="btn-group" data-toggle="buttons-radio">
                        <button type="button" class="btn" data-bind="click: sportYes">Yes</button>
                        <button type="button" class="btn" data-bind="click: sportBasic">Basic</button>
                        <button type="button" class="btn" data-bind="click: sportNo">No</button>
                    </div>

私はjquery validateを使用しています。validateメソッドを書きたいのですが、テキストフィールドに必須の値を与えるなどの典型的なアプローチを使用できません。

$("#FormThatNeedsToBeValidated").validate({
    rules: {
        textinput1: {
            required: true
        },
        textinput2: {
            required: true
        }}});

構文を知っていたとしても、すべてのボタンが必要なわけではないので、これが役立つとは思いません。active3 つのボタンのいずれかがクリックされたときにレンダリングされる属性を活用する方法はありますか?

4

1 に答える 1

1

A<button>は、このプラグインを使用して検証する資格がありません。

このプラグインは、次の 8 種類のデータ入力要素 (それぞれに一意の属性が必要) でのみ機能し、フォーム要素内に含まれている必要があります。name

<form>

   <!-- Textbox Input - Also including the various HTML5 input types -->
   <input type="text" name="something" />

   <!-- Password Input -->
   <input type="password" name="pw" />

   <!-- Radio Button -->
   <input type="radio" name="foo" />

   <!-- Checkbox -->
   <input type="checkbox" name="bar" />

   <!-- File Upload -->
   <input type="file" name="upload" />

   <!-- Hidden Input - 'ignore: []' must be defined in the options -->
   <input type="hidden" name="hide" />

   <!-- Select Dropdown -->
   <select name="foobar"> ... </select>

   <!-- Text Area Box -->
   <textarea name="barfoo"></textarea>

</form>

ドキュメントの「リファレンス」ページも参照してください: http://jqueryvalidation.org/reference/

目的の効果を得るために、特定のボタンをクリックしてフォームをテストおよび送信できます。メソッドを使用して.valid()、フォームをテスト/チェックしsubmit()、送信します。

HTML :

<button type="button" class="btn" id="sportYes">Yes</button>
<button type="button" class="btn" id="sportBasic">Basic</button>
<button type="button" class="btn" id="sportNo">No</button>

jQuery :

$(document).ready(function() {

    $("#FormThatNeedsToBeValidated").validate({  // <- initialize plugin on form
        // rules & options
    });

    $('#sportYes').on('click', function() {
        // stuff to do when this button is clicked
        if ($("#FormThatNeedsToBeValidated").valid()) { // <- test validity
            // stuff to do on valid form
            $("#FormThatNeedsToBeValidated").submit();  // <- submit the valid form
        }
    });

    $('#sportBasic').on('click', function() {
        // stuff to do when this button is clicked
    });

    $('#sportNo').on('click', function() {
        // stuff to do when this button is clicked
    });

});

デモ: http://jsfiddle.net/PgCr2/

于 2013-10-23T21:13:30.090 に答える