0

開示は最初に邪魔にならないように、これは宿題です。

編集：さて、プラグインは現在動作していますが、数字やメールアドレスなどの場合のみ、デフォルトの「常に必要」が機能していないようです。これはやや重要です. 要約すると、フォーム要素のクラスを「class="required"」に設定すると、それが有効かどうかに関係なく常に検証されますが、「class="required number」のようなことをすると検証が機能します正しく。

旧テキスト: JQM サイトでフォームを含む JQuery Validate プラグインを使用する必要があります。学校からの指示は、いくつかのフォーム要素のクラスを「必須」または同様のものに変更し、フォームで .validate を呼び出すだけでよいということです。

さて、私はこれを数十回実行しましたが、動作させることができません。コードにこの問題を引き起こしている何かがある可能性があります。コードの関連部分は次のとおりです。

注として、私が実際に JQM を使用したのは、これまでに合計 1 週間程度だったので、ばかげたミスやずさんな点については申し訳ありません。)

フォーム：

<!--Add char form-->
<div data-role="page" id="add-item" data-theme="a" >
    <!--I decided to edit my form from the previous week to be more flexable and generic for use in many different RPGs, and not just Dungeons and Dragons, as it was before.-->

    <div data-role="header">
            <h1>Add New Character</h1>
        </div>
    <div data-role="content">
        <form action="" method="post" data-ajax="false" id="addCharForm">
            <fieldset data-role="controlgroup">
                <label for="dateCreated">Date Created:</label>
            <input type="date" id="dateCreated">
        </fieldset>

        <fieldset data-role="controlgroup">
                <label for="name">Age:</label>
            <input type="text" name="name" id="charAge" value="">
        </fieldset>

        <fieldset data-role="controlgroup">
            <label for="charName">Name:</label>
            <input type="text" id="charName" placeholder="Character Name" class="required">
        </fieldset>

        <fieldset data-role="controlgroup" data-type="horizontal">
            <legend>Choose character gender:</legend>
            <input type="radio" name="gender" id="radioMale" value="Male">
            <label for="radioMale">Male</label>

            <input type="radio" name="gender" id="radioFemale" value="Female">
            <label for="radioFemale">Female</label>
        </fieldset>

        <fieldset data-role="controlgroup">
            <label for="charAttrs">Describe your character's <b>attributes</b> in this field:</label>
            <textarea id="charAttrs"></textarea>
        </fieldset>
        <fieldset data-role="controlgroup">
            <label for="charSkills">Describe your character's <b>skills</b> in this field:</label>
            <textarea id="charSkills"></textarea>
        </fieldset>
        <fieldset data-role="controlgroup">
            <label for="charBio">Character Biography:</label>
            <textarea id="charBio"></textarea>
        </fieldset>
        <fieldset data-role="controlgroup">
            <label for="charRating">Rate Your Character:</label>
            <input type="range" name="charRating" id="charRating" value="100" min="0" max="100">
        </fieldset>

        <input type="submit" value="Submit Character" data-theme="b">
        <input type="button" id="testBtn" value="Test">
    </form>
    </div>
</div>

JS:

$('#add-item').on('pageinit', function(){
console.log("In init");

    var myForm = $('#addCharForm');
        myForm.validate({
        invalidHandler: function(form, validator) {
        },
        submitHandler: function() {
                    var data = myForm.serializeArray();
        //TODO storeData(data);
    }
});
});

どんな助けでも大歓迎です。

4

1 に答える 1

0

次のようにフォームを含めclass="required"て初期化する必要があると思います：<input>

$("#nameOfTheForm").validate();
于 2012-10-11T01:49:19.007 に答える