0

jqueryのバリデーションプラグインの使い方が理解できたかどうかよくわかりません。1 つの入力フィールドの検証を試みました (必須に設定し、最小長を 1 に設定しました)。次に、入力フィールドに値を入力せずにフォームを送信しようとしましたが、送信できませんでした。

私のjQueryコードは次のようになります。

$(document).ready(function() {
    // ... other non relevant code ...

    $("#organisationsantrag").validate({
        rules: {
            ouKostenstelle: {
                required: true,
                minlength: 1
            }
        },
        messages: {
            ouKostenstelle: {
                required: "Nothing entered",
                minlength: "Too short"
            }
        }
    })
})

これは、HTML の一部がどのように見えるかです (生成されているため、あまりきれいには見えません)。

<table>
    <tr>
        <td>
            <FORM NAME="formAbschicken" METHOD="POST" ACTION='http://target' ID="organisationsantrag">
                <table BORDER="0">
                    <tr>
                        <td COLSPAN="2"><HR width="100%"></td>
                    </tr>
                    <tr>
                        <td>Antragsteller</td>
                        <td><INPUT TYPE="TEXT" NAME="cnAntragsteller" ID="cnAntragsteller"  VALUE=""></td>
                    </tr>
                    <tr>
                        <td COLSPAN="2"><HR width="100%" class="trennlinie"></td>
                    </tr>
                    <tr>
                        <td><P CLASS="ouName">Name der OE</P></td>    
                        <td><INPUT TYPE="TEXT" NAME="ouName" CLASS="ouName" ID="ouName" READONLY="READONLY"  VALUE=""></td>    
                    </tr>
                    <tr>
                        <td><P CLASS="ouNummer">Betrieb</P></td>    
                        <td><INPUT TYPE="TEXT" NAME="ouNummer" CLASS="ouNummer" ID="ouNummer" READONLY="READONLY"  VALUE=""></td>    
                    </tr>
                    <tr>
                        <td><P CLASS="ouKostenstelle">Kostenstelle</P></td>
                        <td><INPUT TYPE="TEXT" NAME="ouKostenstelle" CLASS="ouKostenstelle" ID="ouKostenstelle"  VALUE=""></td>    
                    </tr>
                    <tr>
                        <td COLSPAN="2"><HR width="100%" class="trennlinie"></td>
                    </tr>
                    <tr>
                        <td><P CLASS="jbdAntragsteller">Bezeichnung der Funktion</P></td>
                        <td><INPUT TYPE="TEXT" NAME="jbdAntragsteller" CLASS="jbdAntragsteller" ID="jbdAntragsteller" READONLY="READONLY"  VALUE=""></td>    
                    </tr>
                    <tr>
                        <td><P CLASS="jbAntragsteller">Planstellen-Nr.</P></td>    
                        <td><INPUT TYPE="TEXT" NAME="jbAntragsteller" CLASS="jbAntragsteller" ID="jbAntragsteller" READONLY="READONLY"  VALUE=""></td>    
                    </tr>
                    <tr>
                        <td><P CLASS="ccAntragsteller">Kostenstelle</P></td>
                        <td><INPUT TYPE="TEXT" NAME="ccAntragsteller" CLASS="ccAntragsteller" ID="ccAntragsteller" READONLY="READONLY"  VALUE=""></td>    
                    </tr>
                    <tr>
                        <td><P CLASS="pnAntragsteller">Personalnummer</P></td>
                        <td><INPUT TYPE="TEXT" NAME="pnAntragsteller" CLASS="pnAntragsteller" ID="pnAntragsteller" READONLY="READONLY"  VALUE=""></td>
                    </tr>
                    <tr>
                        <td><P CLASS="cnLeiter">Übergeordneter Leiter</P></td>
                        <td><INPUT TYPE="TEXT" NAME="cnLeiter" CLASS="cnLeiter" ID="cnLeiter" READONLY="READONLY"  VALUE=""></td>
                    </tr>
                    <tr>
                        <td COLSPAN="2"><HR width="100%"></td>
                    </tr>
                    <tr>
                        <td>Visiert durch</td>
                        <td><INPUT TYPE="TEXT" NAME="cnVisum" ID="cnVisum" READONLY="READONLY"  VALUE="Current User"></td>
                    </tr>
                    <tr>
                        <td><P CLASS="directors">Managing Director</P></td>    
                        <td><select name="directors" size="0" CLASS="directors" ID="directors" ></select></td>    
                    </tr>
                    <tr></tr>    
                    <tr>
                        <td></td>    
                        <td><INPUT  TYPE="SUBMIT" NAME="Submit" VALUE="Submit"></td>    
                    </tr>
                </table>
            </FORM>
        </td>
    </tr>
</table>

エラーは発生しません。そのため、検証メソッドの構文を取得できなかったと思います。

更新:理由はわかりませんが、jquery の他の部分にいくつかの変更を加えた後、機能しています。また、スクリプトタグの先頭にフォーム検証部分を配置しました。

4

2 に答える 2

1 
$('[type="submit"]').live('click', function(e) {
    if (!$(this).parents('form').valid()) {
        return false;
    }
});
于 2012-05-23T07:57:41.070 に答える
0

遅いよりはましです。

問題は、コードを配置した位置に関連していました。すべてのサイトに 1 つのテンプレートを持つ Workflow-Tool を使用したため、テンプレートの head セクションに JavaScript を配置できませんでした。テーブルの td 内に配置する必要がありました。

実際の入力が表示される前にコードが配置された場合、要素がトリックを実行した後に配置すると機能しません。

于 2012-12-11T12:39:23.007 に答える