JavaScript - 不验证空白字段

时间:2015-07-06 23:53:50

标签: javascript jquery

我有以下JavaScript函数,它不应该允许将空白字段发送到我的后端代码,但无论如何它都在执行它。即使我的一个或两个字段为空,此代码也会发送2个空白值。 (如果它们都被填写,它的工作正常。)它也没有显示我的错误消息。谁能帮我?这是我的JavaScript。

function submitForm() {
    var allValid = true;
    var name = $("#name").val();
    var comment = $("#comment").val();
    if (name == null || name.length == 0) {
        allValid = false;
        $("#nameReq").css("visibility", "block");
    } else {
        $("#nameReq").css("visibility", "hidden");
    }
    if (comment == null || comment.length == 0) {
        allValid = false;
        $("#commentReq").css("display", "block");
    } else {
        $("#commentReq").css("display", "hidden");
    }

    if (allValid) {
        clearForm();

        $.ajax({
            type : "post",
            url : "writeComment",
            data : "name=" + name + "&comment=" + comment,
            success : function(response) {
            },
            error : function(error) {
            }
        });

        document.getElementById('submit').disabled = true;
    }
}

function clearForm() {
    $("commentForm").reset();
}

这是我的表格。

<form:form id="commentForm" method="post">
    <table>
        <tr>
            <td>Name:<span style="display: none" id="nameReq">
                <font style="font-weight: bold; color: red; visibility: hidden;">
                <c:out value='Name required' /></font></span><br />
                <input type="text" id="name" maxlength="30" /></td>
        </tr>
        <tr>
            <td>Comment:<span style="display: none" id="commentReq">
                    <font style="font-weight: bold; color: red; visibility: hidden;">
                <c:out value='Comment required' /></font></span><br />
                <textarea id="comment" rows="20" cols="125" /></textarea></td>
        </tr>
        <tr>
            <td><input id="submit" type="submit" value="Submit comment" onClick="submitForm()" /></td>
            <td>&nbsp;</td>
        </tr>
    </table>
</form:form>

2 个答案:

答案 0 :(得分:1)

您的表单将在onclick函数中的操作中提交,因为输入按钮类型为submit。如果您只想使用AJAX通话提交,请将输入更改为type="button"

即使您想在没有ajax调用的情况下提交,仍然可以使用type="button"并使用$('#commentForm').submit();提交表单

答案 1 :(得分:1)

您的textarea都是自我终止的,并且有一个结束标记。当我试图运行它时,将它混淆到按钮的onClick没有运行。