Пользовательское сообщение проверки jQuery перед перечислением ошибок

Question

Я хочу добавить собственное сообщение, прежде чем перечислять мои ошибки для страницы входа:

"К сожалению, вы забыли ввести следующее:" + "Имя пользователя", "Пароль" (если оба не введены)

или

"К сожалению, вы забыли ввести следующее:" + "Имя пользователя" (если просто не введено имя пользователя)

$(document).ready(function(){
$("#loginForm").validate({

    errorLabelContainer: $('#RegisterErrors'),
    messages: {
      username: "Username",
      password: "Password"
              }
     });
      });     

С этим в моем HTML

<div id="RegisterErrors">

---

Я думаю, мой вопрос больше "как вы разделяете ошибки запятыми?" Я хочу сохранить ошибки в одной строке и разделить их запятыми, а не в виде списка с маркерами? Можете ли вы использовать атрибут обертки?

Вывод на HTML: Ошибка 1, Ошибка 2 (если оба отсутствуют) Ошибка 1 (если отсутствует только 1) Ошибка 2 (если отсутствует только 2)

Answer 1

Ваш вопрос не очень конкретный, но для недавнего проекта я сделал что-то вроде этого:

function validate_form(form){
    valid = true;
    error = "";
    with(form){

        error = validateName(first_name);
        if(error!=""){
            $("#fn_error").html(error);
            valid=false;
        }else{
            // clear error
            $("#fn_error").html("");
        }

        error = validateName(last_name);
        if(error!=""){
            //last_name.focus();
            $("#ln_error").html(error);
            valid=false;
        }else{
            // clear error
            $("#ln_error").html("");
        }

        error = validateEmail(email);
        if (error!=""){
            $("#email_error").html(error);
            //email.focus();
            valid=false;
        }else{
            // clear error
            $("#email_error").html("");
        }
    }
    return valid;
}

function trim(s){
  return s.replace(/^\s+|\s+$/, '');
}

function validateEmail(fld){
    var error="";
    var tfld = trim(fld.value);                        // value of field with whitespace trimmed off
    var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
    var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;

    if (fld.value == "") {
        fld.style.background = '#FFCCCC';
        //error = "You didn't enter an email address.\n";
        error = "This field is required.";
    } else if (!emailFilter.test(tfld)) {              //test email for illegal characters
        fld.style.background = '#FFCCCC';
        error = "Invalid Email address.";
    } else if (fld.value.match(illegalChars)) {
        fld.style.background = '#FFCCCC';
        error = "Email contains illegal characters.\n";
    } else {
        fld.style.background = 'White';
    }
    return error;
}

// field_name should be "first name" or "last name"
function validateName(fld){
    var error="";
    var tfld = trim(fld.value);                        // value of field with whitespace trimmed off

    if (fld.value == "") {
        fld.style.background = '#FFCCCC';
        error = "This field is required.";
    }else {
        fld.style.background = 'White';
    }
    return error;
}

Вместо того, чтобы устанавливать и очищать ошибку, вы можете создать строку ошибки, если ошибка существует. А затем установите и очистите только одну ошибку в зависимости от того, существует ли ошибка. Следуй за мной?

UPDATE Чтобы разделить ошибки запятыми, вы должны построить строку ошибки, как указано выше:

error = "oops you forgot to fill in ";
bad_fields = [];
if (form[name] == ""){
  bad_fields.push("name");
}
if (form[email] == ""){
  bad_fields.push("email");
}
error_string = error + bad_fields.join(",");
$("#error_div").html("<span class='error'>"+error_string+"</span>");

Это в основном псевдокод, но вы поняли.