当输入字段为空时,jQuery验证不起作用

时间:2017-02-08 04:59:43

标签: javascript jquery validation

我认为这并不复杂,但我不能自己做。我非常感谢你的帮助。

我打算提交一份经过验证的表格。好像我的验证工作不正常。因为当输入字段为空时,它不会显示错误消息。而且,当点击提交按钮时,它没有显示错误消息。仅当输入字段为空时才会发生此事件。

这是我的HTML:

<form name="department" id="department">
    <div class="form-group">
        <label for="example-text-input">Department Name</label>
        <span id="errfnCustomer"></span>
        <input class="form-control" type="text" placeholder="Enter Department Name" id="textDepartmentName" name="textDepartmentName1">
    </div>
    <div class="form-group">
        <label for="example-text-input">Registation Number</label>
        <span id="errfnCustomer2"></span>
        <input class="form-control" type="text" placeholder="Enter Department Registation Number" id="textRegistationNumber" name="textRegistationNumber">
    </div>
    <div class="form-group">
        <label for="example-text-input">Web Site</label>
        <input class="form-control" type="text" placeholder="Web Site" id="textWebsite" name="textWebsite1">
    </div>
    <div class="form-actions">
        <div class="form-group">
            <input type="button" value="Register" class="btn pull-right" id="btnsubmit" style="background-color:#1e90ff; width: 100px; color: white; font-weight: bold" />
        </div>
    </div>
</div>

和jQuery:

$('#department').validate({
    rules: {
        textDepartmentName1: {
            required: true,
            minlength: 3,
        },
        textRegistationNumber: {
            required: true,
            minlength: 3
        },
        textWebsite1: {
            required: true,
            minlength: 3
        }

    },
    submitHandler: $("#btnsubmit").click(function (form) {
        var submitData = {
            DepartmentId: saveStat,
            DepartmentName: $('#textDepartmentName').val().trim(),
            RegistationNumber: $('#textRegistationNumber').val(),
            Website: $('#textWebsite').val(),
            Email: $('#textEmail').val(),
            Telephone01: $('#textTelephone01').val(),
            Telephone02: $('#textTelephone02').val(),
            Fax: $('#textFax').val(),
            BranchId: $('#cmbGetBranch').val()
        }

        if (saveStat == 0) {
            $.ajax({
                dataType: 'json',
                contentType: 'application/json; charset=utf-8',
                cache: false,
                async: false,
                type: 'POST',
                data: "{submitData:" + JSON.stringify(submitData) + "}",
                url: "/Department/AddDepartment",
                success: function (saveDepartment) {
                    if (saveDepartment.saveDepartment.DepartmentId != 0) {
                        refresh();
                        alert(saveDepartment.saveDepartment.DepartmentName + " Saved succesfully...!!!");
                    } else {
                        alert('warning' + " Department saving unsucsessful...!!!");

                    }
                },
                error: function (xhr, errorThrown) {
                    alert('Error...!!! Internal - 01');
                }

            });
        } else {
            $.ajax({
                dataType: 'json',
                contentType: 'application/json; charset=utf-8',
                cache: false,
                async: false,
                type: 'POST',
                data: "{submitData:" + JSON.stringify(submitData) + "}",
                url: "/Department/UpdateDepartment",
                success: function (updateDepartment) {
                    if (updateDepartment.updateDepartment.DepartmentId != "") {
                        alert(updateDepartment.updateDepartment.DepartmentName + " updated succesfully...!!!");
                        refresh();
                    } else {
                        alert("Department update error...!!!");
                    }
                },
                error: function (xhr, errorThrown) {
                    alert('Error...!!!');
                }
            });
        }
        grid();
    })
});

1 个答案:

答案 0 :(得分:1)

首先让注册按钮类型提交:

 <input type="submit" value="Register" class="btn pull-right" id="btnsubmit" style="background-color:#1e90ff; width: 100px; color: white; font-weight: bold" />

并使提交处理程序像这样:

submitHandler:function (form) {

}

在此处查看更多信息(Jquery validation)。