MVC BeginForm 激活了淡入淡出圆动画，即使存在数据注释错误

问：

我有这个 Razor 代码。

    @Using Html.BeginForm("SaveBranch", "Branch", Model, FormMethod.Post, New With {.id = "myForm", .class = "form-horizontal", .role = "form", .onsubmit = "DisplayProgressMessage('#btnSave', 'Saving...');"})
    @Html.AntiForgeryToken()
    @<text>
        <form class="form-horizontal">
            <fieldset>
                <div class="col-md-6">
                    <div class="form-group">
                        <div class="row">
                            @Html.LabelFor(Function(m) m.BranchName, New With {.class = "col-md-2 control-label"})
                            <div class="col-md-10">
                                @Html.HiddenFor(Function(m) m.BranchID)
                                @Html.TextBoxFor(Function(m) m.BranchName, New With {.class = "form-control", .maxlength = 50})
                                @Html.ValidationMessageFor(Function(m) m.BranchName, "", New With {.class = "text-danger"})
                            </div>
                        </div>
                    </div>
<div class="row">
                        <button type="submit" id="btnSave" class="btn btn-primary pull-left"><i class="glyphicon glyphicon-save" style="margin-right: 4px;"></i> Save!</button>
                        <a href="@Url.Action("SearchMedexBranch", New With {.Server = Model.Server})" , class="btn btn-success pull-left" id="btnSearch"><i class="glyphicon glyphicon-search"></i> Back To Search</a>
                            <hr>
                        </div>
                </fieldset>
            </form>      
        </text> 
    End Using

<script>
    function DisplayProgressMessage(ctl, msg) {
        // Check if there are Data Annotation errors before starting the animation
        if (document.querySelectorAll(".field-validation-error").length > 0) {
            console.log("Field Error count :", document.querySelectorAll(".field-validation-error"));
            return false; // Prevent form submission when there are errors
        }
        $(ctl).prop("disabled", true).text(msg);
        $(".alert").removeClass("hidden");
        $("body").loadingModal({
            position: "auto",
            text: "Processing...",
            color: "#fff",
            opacity: "0.7",
            backgroundColor: "rgb(0,0,0)",
            animation: "fadingCircle"
        });
        console.log("Returning True...");
        return true;
    }

    // Add event listener to the form submission
    document.getElementById("myForm").addEventListener("submit", function (event) {
        // Call the DisplayProgressMessage function before submitting the form
        const formIsValid = DisplayProgressMessage(document.querySelector("button[type=submit]"), "Processing...");

        // If the function returns false, prevent the form submission
        if (!formIsValid) {
            // Re-enable the submit button and hide loading animation
            document.querySelector("button[type=submit]").removeAttribute("disabled");
            $(".alert").addClass("hidden");
            $("body").loadingModal("hide");
            event.preventDefault();
        }
    });
</script>

它调用 Fading Circle Animation，而 Form 保存在控制器中。 如果没有数据注释错误，它就可以正常工作。

如果存在像空字段这样的数据注释错误，则不会调用 POST（w/c 很好），但会调用 Fading Circle Animation，从而无法更改字段，因为 java 脚本也会禁用该字段和 Save 按钮。

如上图所示，存在数据注释错误“请提供分支代码！我不希望调用衰落的圆圈。 如果它们被禁用，我将无法继续编辑该字段。 我只希望在没有错误的情况下出现淡入淡出圈。

我希望你能帮助我。:)