Проверка формы jQuery для других полей

0

Я использую следующий код jQuery для проверки моих полей формы. Но этот код предназначен только для двух полей, и у меня есть еще много полей для посещения моего сайта. Есть ли способ упростить это для большего количества полей?

// Input validation
var wz_form1 = $('#wz_form1');
var wz_width = $('#wz_width');
var wz_height = $('#wz_height');

wz_width.blur(vld_wz_width);
wz_height.blur(vld_wz_height);

wz_form1.submit(function() {
    if(vld_wz_width() & vld_wz_height() ) {
        return true;
    }else{
        return false;   
    }
});

function vld_wz_width() {
    if(wz_width.val().length < 1) {
        wz_width.addClass('red_border');
        return false;
    } else{
        wz_width.removeClass('red_border');
        return true;

    }
}

function vld_wz_height() {
    if(wz_height.val().length < 1) {
        wz_height.addClass('red_border');
        return false;
    } else{
        wz_height.removeClass('red_border');
        return true;

    }
}

Мое последнее обновление:

var wz_form = $('#wz_form1');
$(wz_form).submit(function() {

    function wz_validation() {
        var txtboxes=$('input[validate="true"]');
        for(var i=0;i<txtboxes.length;i++) {

            if($(txtboxes[i]).val()=="") {
                $(txtboxes[i]).addClass('red_border');
                return false;
            }
            else{
                $(txtboxes[i]).removeClass('red_border');
                return true;
            }
        }
    }

    if(wz_validation()) {
        return true;    
    }
    else{
        return false;   
    }

});
  • 0
    какой тип проверки требуется?
  • 0
    Поля не должны быть пустыми, или это не то, что вы имеете в виду?
Теги:
validation

3 ответа

1
Лучший ответ

если вы используете type = text, вы можете использовать следующий код

$(btnSubmit).click(function()
{
var txtboxes=$('input[type="text"]');
for(var i=0;i<txtboxes.length;i++)
{
if($(txtboxes[i]).val()=="")
$(txtboxes[i]).addClass('red_border');
else
$(txtboxes[i]).removeClass('red_border');
}
});
Поделиться
  • 0
    И как я могу исключить некоторые поля тогда? Работаете с классом?
  • 0
    добавьте пользовательский атрибут в поля, которые вы хотите проверить, например, '<input type = "text" validate = "true" />' и измените 'var txtboxes = $ (' input [type = "text"] ');' to 'var txtboxes = $ (' input [validate = "true"] '); " ... он проверит все входные данные, которые имеют атрибут validate со значением true.
Показать ещё 10 комментариев
0

Если в ваших полях есть идентификаторы, содержащие общую строку, такую как _width, вы можете использовать ON() как _width ниже, чтобы присоединить проверки:

$("input[id~='_width']").on("blur", vld_wz_width);
$("input[id~='_height'").on("blur", vld_wz_height);
Поделиться
0

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

// Input validation
var wz_form1 = $('#wz_form1');
var wz_width = $('#wz_width');
var wz_height = $('#wz_height');
var wz_field1 = $('#wz_field1'); //Add new fields
var wz_field2 = $('#wz_field2');
//..... add all the required fields


wz_width.blur(vld_wz_width);
wz_height.blur(vld_wz_height);

wz_form1.submit(function() {
    if(vld_wz_width() & vld_wz_height() & vld_wz_field1 & vld_wz_field2 /* & so on ...*/ ) {
        return true;
    }else{
        return false;   
    }
});

function vld_wz_width() {
    if(wz_width.val().length < 1) {
        wz_width.addClass('red_border');
        return false;
    } else{
        wz_width.removeClass('red_border');
        return true;

    }
}

function vld_wz_height() {
    if(wz_height.val().length < 1) {
        wz_height.addClass('red_border');
        return false;
     } else{
        wz_height.removeClass('red_border');
        return true;

    }
}

 function vld_wz_fields() {
    if(wz_field1.val().length < 1) {
        wz_field1.addClass('red_border');
        return false;
     } else{
        wz_field1.removeClass('red_border');
        return true;

    }
}

 function vld_wz_fields() {
    if(wz_field2.val().length < 1) {
        wz_field2.addClass('red_border');
        return false;
     } else{
        wz_field2.removeClass('red_border');
        return true;

    }
}

//and so on ...

и если вы знакомы с html5, вы можете только добавить required свойство на полях формы, это будет делать автоматическую проверку формы

Поделиться
  • 0
    Да, поэтому я делаю это нормально, но я ищу решение, где я мог бы сделать это проще. Где мне не нужно добавлять функцию для каждого поля, но я думаю, что это невозможно, не так ли?
  • 0
    попробуйте добавить required свойство.
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню