Question

我的aspx表单上有多个必需的字段控件。

现在我想要的是在按钮点击时显示验证消息，如果没有填写或检查任何内容。

我想在JQuery中的一条消息上使用它。

这是我的JQuery代码： -

$(document).ready(function () {
        $('#btnSave').click(function (e) {
            if (!validateTitle() || !validatePrefix() || !validateTextBoxes()) {
                e.preventDefault();
            }
        });
        function validateTitle() {
            if ($("#ddlTitle").val() > "0") {
                if ($("#ddlTitle").val() == "1104" && $("#txtTitle").val() === "") {
                    alert("Please enter the text in other title");
                    return false;
                }
                return true;
            } else {
                alert('Please select the title');
                return false;
            }
        }
        function validatePrefix() {
            if ($("#ddlPrefix").val() > "0") {
                if ($("#ddlPrefix").val() == "1110" && $("#txtPrefix").val() === "") {
                    alert("Please enter the text in other prefix");
                    return false;
                }
                return true;
            } else {
                alert('Please select the prefix');
                return false;
            }
        }
        function validateTextBoxes() {
            if ($("#txtFirstName").val() === "") {
                alert('First name is required');
                return false;
            }
            if ($("#txtMiddleName").val() === "") {
                alert('Middle name is required');
                return false;
            }
            if ($("#txtLastName").val() === "") {
                alert('Last name is required');
                return false;
            }
            if ($("#txtFatherName").val() === "") {
                alert('Father name is required');
                return false;
            }
            if ($("#txtCurrentCompany").val() === "") {
                alert('Current company is required');
                return false;
            }
            if ($("#txtDateofJoin").val() === "") {
                alert('Date is required');
                return false;
            }
            if ($("#txtCurrentExp").val() === "") {
                alert('Current Experience is required');
                return false;
            }
            return true;
        }
    });

Answer 1

尝试以下代码

$(document).ready(function () {
var Messages;
var counter=0;
    $('#btnSave').click(function (e) {
        validateTitle();
        validatePrefix();
        validateTextBoxes();
            if(counter > 0)
            {
                alert(Messages);
                e.preventDefault();
                counter=0;
            }
    });
    function validateTitle() {
        debugger;
        if ($("#ddlTitle").val() > "0") {
            if ($("#ddlTitle").val() == "1104" && $("#txtTitle").val() === "") {
                Messages +=  "Please enter the text in other title";
                Messages += "\n";
                counter ++;
            }
        } else {
            Messages +=  'Please select the title';
            Messages += "\n";
            counter ++;
        }
    }
    function validatePrefix() {
        debugger;
        if ($("#ddlPrefix").val() > "0") {
            if ($("#ddlPrefix").val() == "1110" && $("#txtPrefix").val() === "") {
                Messages +=  "Please enter the text in other prefix";
                Messages += "\n";
                counter ++;
            }
        } else {
            Messages +=  'Please select the prefix';
            Messages += "\n";
            counter ++;
        }
    }
    function validateTextBoxes() {
        debugger;
        if ($("#txtFirstName").val() === "") {
            Messages +=  'First name is required';
            Messages += "\n";
            counter ++;
        }
        if ($("#txtMiddleName").val() === "") {
            Messages +=  'Middle name is required';
            Messages += "\n";
            counter ++;
        }
        if ($("#txtLastName").val() === "") {
            Messages +=  'Last name is required';
            Messages += "\n";
            counter ++;
        }
        if ($("#txtFatherName").val() === "") {
            Messages +=  'Father name is required';
            Messages += "\n";
            counter ++;
        }
        if ($("#txtCurrentCompany").val() === "") {
            Messages +=  'Current company is required';
            Messages += "\n";
            counter ++;
        }
        if ($("#txtDateofJoin").val() === "") {
            Messages +=  'Date is required';
            Messages += "\n";
            counter ++;
        }
        if ($("#txtCurrentExp").val() === "") {
            Messages +=  'Current Experience is required';
            Messages += "\n";
            counter ++;
        }
    }
});

Answer 2

不是一直使用警报，而是将消息保存到变量中。然后在完成所有测试后提醒该消息。

$(document).ready(function () {
        var message = "";

        $('#btnSave').click(function (e) {
            message = "";
            if (!validateTitle() || !validatePrefix() || !validateTextBoxes()) {
                e.preventDefault();
                alert(message);
            }
        });
        function validateTitle() {
            if ($("#ddlTitle").val() > "0") {
                if ($("#ddlTitle").val() == "1104" && $("#txtTitle").val() === "") {
                    message += "Please enter the text in other title\n";
                    return false;
                }
                return true;
            } else {
                message += 'Please select the title\n';
                return false;
            }
        }

        ....
});

Answer 3

使用以下小提琴[JSFiddle] [1]，这将基本上将所有错误消息推送到数组中并显示结果。如果这对您有用，请更新，因为我不知道标记

Answer 4

你可以做的简单伎俩

只需将字符串变量用于附加消息和计数器。

angular.module('MaxRelax')
    .factory('httpSrv', function httpSrv($http, $q) {

        return {
            getData: getData
        };

        function getData(method, url) {
            var def = $q.defer();
            $http({method:method, url:url})
                .success(function (data, status, headers, config) {
                    console.log("Success");
                    console.log(status);
                    def.resolve(data);
                })
                .error(function (data, status, headers, config) {
                    console.log("Error");
                    getErrorMessage(status);
                    def.reject("Failed to get");

                });

            return def.promise;
        }

        // I WANT HANDLE ERROR STATES HERE AND RETURN FOMRATTED MESSAGE WITH ERROR 
        // DESCRIPTION IN CASE OF THE ERROR STATE (service unavailable, 404, etc..)
        function getErrorMessage(status) {
            console.log(status);
        }
    });

如果检查＆gt;只需更新计数器和impliment检查0显示消息   （警报）

它将使你受益两件事

用户无需每次都点击并获得提醒..不需要 return false.user必须立即知道表单中的错误。
其次，代码是简单/简单的逻辑。

Answer 5

试试这个。

    $(document).ready(function () {
  var Errors = [];
        $('#btnSave').click(function (e) {
            if (!validateTitle() || !validatePrefix() || !validateTextBoxes()) {

                if(Errors.length > 0) {
                    alert(Errors.join("\n"));
                } 
                 e.preventDefault();

            }
        });

        function validateTitle() {
            if ($("#ddlTitle").val() > "0") {
                if ($("#ddlTitle").val() == "1104" && $("#txtTitle").val() === "") {
                    Errors.push("Please enter the text in other title");

                }
                return true;
            } else {
                Errors.push('Please select the title');

            }
        }
        function validatePrefix() {
            if ($("#ddlPrefix").val() > "0") {
                if ($("#ddlPrefix").val() == "1110" && $("#txtPrefix").val() === "") {
                    Errors.push("Please enter the text in other prefix");

                }
                return true;
            } else {
               Errors.push('Please select the prefix');

            }
        }
        function validateTextBoxes() {
            if ($("#txtFirstName").val() === "") {
               Errors.push('First name is required');

            }
            if ($("#txtMiddleName").val() === "") {
                Errors.push('Middle name is required');

            }
            if ($("#txtLastName").val() === "") {
                Errors.push('Last name is required');

            }
            if ($("#txtFatherName").val() === "") {
               Errors.push('Father name is required');

            }
            if ($("#txtCurrentCompany").val() === "") {
                Errors.push('Current company is required');

            }
            if ($("#txtDateofJoin").val() === "") {
                Errors.push('Date is required');

            }
            if ($("#txtCurrentExp").val() === "") {
               Errors.push('Current Experience is required');

            }

            return true;
        }
    });

在每封邮件中添加完美分隔以区分它。

在jquery中的一条消息中显示多个警报

5 个答案: