Initial jQuery form validation before using $.ajax() call with data populated using serializeArray() -
i'm trying initial validation before using $.ajax() call (where additional validation performed) save on calls server. i'm using following :
$('.form_submit').submit(function() { var frm = $(this); var url = frm.attr('action'); var data = $(this).serializearray(); var proceed = true; $.each(data, function(index, value) { var name = data[index].name; if ($('#' + name).hasclass('required') && value == '') { $('.label_' + name).append('please provide value'); proceed = false; } }); if (proceed) { $.ajax({
but value of 'proceed' variable doesn't seem taken under consideration , validation goes straight ajax.
any appreciated.
i've figured out how achieve , add support other fields (such radio buttons, textareas etc.) - here's i've come with:
$('.form_submit').submit(function() { $('.warn').remove(); var frm = $(this); var url = frm.attr('action'); var data = $(this).serializearray(); var radios = frm.find('input:radio'); var checks = frm.find('input:checkbox'); var proceed = true; $.each(radios, function(index, value) { var elem = frm.find('input[name='+radios[index].name+']'); if (elem.hasclass('required') && $("input:radio[name="+radios[index].name+"]:checked").length == 0) { var val = elem.attr('title'); if ($('.label_' + radios[index].name).find('.warn').length == 0) { $('.label_' + radios[index].name).append('<span class="warn">'+val+'</span>'); } proceed = false; } }); $.each(checks, function(index, value) { var elem = frm.find('input[name='+checks[index].name+']'); if (elem.hasclass('required') && $("input[name="+checks[index].name+"]:checked").length == 0) { var val = elem.attr('title'); $('.label_' + checks[index].name).append('<span class="warn">'+val+'</span>'); proceed = false; } }); $.each(data, function(index, value) { var elem = frm.find('[name='+data[index].name+']'); var elem_type = elem.prop('nodename'); if (elem.hasclass('required') && elem.val() === '') { var val = elem.attr('title'); $('.label_' + data[index].name).append('<span class="warn">'+val+'</span>'); proceed = false; } }); if (proceed == true) { $.ajax({ // here start server side validation
i've assigned validation message 'title' attribute of 'input' field - can have different 1 each tag. radio buttons - add 'title' first button.
Comments
Post a Comment