繁体   English   中英

有关jquery .valid()失败的表单无效吗?

[英]What is invalid about my form with jquery .valid() failing?

我有一个简单的表单,我验证它,但然后我检查它是否有效,它始终无效。 如何查看我的表单无效? 如果我用文本框的html替换剃刀代码,它似乎工作。 我在下面发布了渲染的剃刀代码。

这是我的表格 -

 @using (Html.BeginForm("Search", "Home", FormMethod.Post, new { id = "MyForm", name = "MyForm" }))
    {
        <div class="form-group">
            @Html.TextBoxFor(model => model.SearchQuery, new { @class = "form-control", name = "FullAddress", id = "FullAddress" })
            @Html.ValidationMessageFor(model => model.SearchQuery, "", new { @class = "text-danger" })

        </div>
        <button type="submit" class="btn btn-default">Search</button>
    }

这是我的剧本。 每次我点击提交按钮并显示此行时,它会显示一个警告框

if (!$('#MyForm').valid()) {
            alert('Invalid Form!');



$(document).ready(function () {
    if ($('#MyForm').exists()) {

        // Enable jQuery Validation for the form
        //$("#MyForm").validate({ onkeyup: false, onfocusout: false });
        $("#MyForm").validate();



    var errors = validator.errors(); //get the error elements, the actual labels
    var errors1 = validator.invalidElements();

        // Add validation rules to the FullAddress field
        $("#FullAddress").rules("add", {
            fulladdress: true,
            required: true,
            messages: {
                fulladdress: "Google cannot locate this address."
            }
        });

        // This function will be executed when the form is submitted
        function FormSubmit() {
            $.submitForm = true;
            if (!$('#MyForm').valid()) {
                alert('Invalid Form!');

                return false;
            } else {
                if ($("#FullAddress").data("IsChecking") == true) {
                    $("#FullAddress").data("SubmitForm", true);
                    return false;
                }

                alert('Form Valid!  Submit!');
                // return true;   // Uncomment to submit the form.
                return false;     // Supress the form submission for test purpose.

            }
        }

        // Attach the FormSubmit function to the Submit button
        if ($('#Submit').exists()) {
            $("#Submit").click(FormSubmit);
        }

        // Execute the ForumSubmit function when the form is submitted
        $('#MyForm').submit(FormSubmit);
    }
});

// Create a jQuery exists method
jQuery.fn.exists = function () { return jQuery(this).length > 0; }


function LocationValidator(value, element, paras) {
  ///do stuff here
}

$.validator.addMethod("location", LocationValidator);

$.validator.unobtrusive.adapters.addBool("location");

$.validator.setDefaults({
    onkeyup: false,
    onfocusout: false
});

我的表单的无效部分来自searchquery文本框。 如果我将html更改为下面的行,则表单传递为有效。

<input type="text" id="SearchQuery" name="SearchQuery"  class="form-control"/>

这是渲染的剃刀代码看起来像我的表单验证检查失败

<input class="form-control" data-val="true" data-val-location="The location cannot be determined" data-val-required="The Location field is required." id="SearchQuery" name="SearchQuery" type="text" value="" />

您可以使用validate()返回的validate()器对象的errorList属性:

var validator = $("#MyForm").validate(),
    errors = validator.errorList;

该属性是一个对象数组,其中每个对象都包含错误消息和HTML元素。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM