I do the form validation, very primitive:

$("#order_form button").click(function(event) { event.preventDefault(); if ($("input[name='name']").val() == "") { $("input[name='name']").addClass("error"); } if ($("input[name='phone']").val() == "") { $("input[name='phone']").addClass("error"); } if ($("input[name='email']").val() != "") { var pattern = /^([a-z0-9_\.-])+@[a-z0-9-]+\.([az]{2,4}\.)?[az]{2,4}$/i; if (!pattern.test($("input[name='email']").val())) { $("input[name='email']").addClass("error"); } } else { $("input[name='email']").addClass("error"); } if ($("select[name='payment_system']").val() == "0") { $(".jq-selectbox__select").addClass("error"); } });

If you press the send button with empty fields, the .error class is added to the fields. How to make removal of a class .errow on the fly, without repeated pressing of the button of sending if the field is filled?

    1 answer 1

    This code will help you:

     $(document).on('input change', '#order_form input', function() { $(this).removeClass('error'); });

    Instead of input, you can refine the selector.