0

我不太确定我是否了解如何使用 jquery 的验证插件。我尝试验证一个输入字段(将其设置为必需,最小长度为 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

迟到总比不到好。

问题与我放置代码的位置有关。由于我使用了一个工作流工具,它为所有网站提供了一个模板,因此我无法将 javascript 放在模板头部部分。我不得不把它放在桌子的一个 td 内。

如果代码是在实际输入出现之前放置的,那么它将不起作用,将其放置在元素之后确实可以解决问题。

于 2012-12-11T12:39:23.007 回答