如何正确触发表单的默认验证?

时间:2019-05-04 17:13:34

标签: javascript jquery jquery-validate

在尝试使用jQuery Validate插件和按钮PUT提交click请求之前,我试图触发默认的HTML验证。

功能:

// PUT amend project function
$(document).on('click', '#amendProj', function () {

    // fetch clicked button placeholder value
    var fired_button = $(this).attr('placeholder');

    // validate form programmatically, if validation fails trigger default error messages
    $("#collapse" + fired_button).validate();
    var result = $("#collapse" + fired_button).valid();

    if (result == true) {

        // show loading spinner
        document.getElementById("spinner").hidden = false;

        //collect form data
        var params = {

            projectId: fired_button,
            projectManager: $("#selectionMan" + fired_button + " option:selected").text(),
            projectOwner: $("#selectionOwn" + fired_button + " option:selected").text(),
            predictedLaunch: document.querySelector('#preDate' + fired_button).value,
            actualLaunch: document.querySelector('#actDate' + fired_button).value,
            predictedCompletion: document.querySelector('#precomDate' + fired_button).value,

        }

        // Create XHR Object and send
        var xhr = new XMLHttpRequest();
        xhr.open('PUT', 'http://link/api/Projects/' + fired_button, true)
        xhr.setRequestHeader("Content-type", "application/json");
        xhr.send(JSON.stringify(params));

        // Handle errors
        xhr.onload = function () {

            if (this.status == 204) {

                // hide loading spinner
                document.getElementById("spinner").hidden = true;
                alert("Changes saved successfully!");
                console.log(this.status + ' Changes submitted successfully!');

            }

            else {

                // hide loading spinner
                document.getElementById("spinner").hidden = true;
                alert("Your submission failed. Please try again");
            }
        }

    }
    else
    {
         return false;
    }

});

按钮:

<input type="submit" id="amendProj" placeholder="45" class="btn btn-dark" value="Save Changes">

我遇到的问题是,验证result始终返回true,无论我将输入字段保留为空白还是填充都无关紧要。我所有的HTML输入字段都具有required,我想在进一步执行代码并提出PUT请求之前触发默认的验证消息。如果有专家可以帮忙,我将不胜感激。我是新手,可能会缺少一些东西...

0 个答案:

没有答案