Сократить условие Jquery

Question

У меня есть вопрос о том, как я могу сократить утверждение Jquery if. В моей форме есть несколько полей, которые я проверяю, заполнены ли они. Я знаю, что есть несколько плагинов, чтобы сделать это для меня, но я не хочу изучать это сам (с некоторой помощью других; -))

Я получил этот чек

//---- First define hasError
var hasError = false;
//---- Get the value from the inputfield
var firstname = $('#firstname').val();
//---- Do the check
if(firstname == ''){
 $("#error_firstname").show();
 hasError = true;
}else{
 $("#error_firstname").hide();
}

Я думал, что смогу написать это так:

(firstname == '') ? $(".firstname").show(): $(".firstname").hide();

И это работает, но я не могу вставить hasError = true , поэтому я не могу спросить об этом в конце

if(hasError != false) {
 //---- if error, don't refresh page and show errors
 return false;
}else{
 //---- Save values to DB and show succes message
}

У кого-нибудь есть идея?

Tnx заранее

Grtzz

Wim

Answer 1

Для начала, реорганизовать его в функцию, чтобы вы могли использовать его для всех полей.

Пример:

function check(fieldname) {
    var value = $('#' + fieldname).val();
    var error = $('#error_' + fieldname);
    if (value == '') {
        error.show();
        $.hasError = true;
    } else {
        error.hide();
    }
}

, чтобы вы могли использовать его следующим образом:

check('firstname');
check('lastname');
// etc..

Конечно, вы можете еще раз выполнить рефакторинг, сохранив все имена в массиве или просто получив $(':input') и вызвав check() в цикле. Вы продолжаете заниматься рефакторингом;) В конечном итоге вы можете посмотреть, как это делают существующие плагины проверки формы. Например, jQuery Validator .

Весь смысл: не дублируйте код. Рефакторинг это.

Answer 2

Хорошо, я бы порекомендовал вам использовать плагин JQuery Validation , но я возьму его на вооружение, чтобы вы выучили его "сложным" способом. : P

Пусть сообщения об ошибках принимают один и тот же класс, например "Ошибка"

<span class="error" id="err_firstname">...</span>
<span class="error" id="err_lastname">...</span>
<span class="error" id="err_email">...</span>

Если у любого из span.error:visible есть хотя бы один предмет, то hasError = true

 $("span.error:visible").each(function (i) {
    hasError = true;
    return;
  });

Проверка флага hasError также может быть сокращена:

if(hasError) {

 //---- if error, don't refresh page and show errors

 return false;
}
else {

 //---- Save values to DB and show succes message

}

Answer 3

Вы можете установить обратный вызов для методов jQuery show() и hide():

(firstname == '') ? $(".firstname").show(function(){ hasError = true; }): $(".firstname").hide();