Отправка формы НЕ работает, помогите!

[DanDiablo]

Меня теперь другое смущает!

Когда человек, ни чего не заполнив, нажал на кнопку "Отправить", то у него все поля будут красными по js. А когда он все заполнил и тогда уже нажал на кнопку, то все ровно все поля красные! Странно...

Код ajax:

if(formsErrors){
				jQuery.ajax({
	            type: "POST",
	            url: "../mail.php",
	            data: jQuery(this).serialize()
	        }).done(function() {
	            jQuery(this).find("input").each(function() {
                    jQuery(this).removeClass('myFormsError').val("");
                });
	            jQuery(".knopka").html("Спасибо!");
	            jQuery("#result").html("Спасибо за письмо!");
	            jQuery("#imgsForms").show("slow");
	            jQuery("#myForm").trigger("reset");
	            jQuery(".knopka").val("Отправляется").prop("disabled", "true");;
	            });
		}				
        return false;
    });

Код, ответственный за убирание класса и очистку полей:

.done(function() {
	            jQuery(this).find("input").each(function() {
                    jQuery(this).removeClass('myFormsError').val("");
                });

При этом поля то очищаются, а вот класс не убирается!

Вот как так?!

Тогда я решил сделать так, что бы класс ошибки удалялся непосредственно при наборе инпута.

Пошарившись в интернете нашел два решения:

js

document.getElementById("myFormTema").addEventListener("change", function(){
 if(this.value.length < 8){
 this.classList.add('myFormsError');
 }else{
 this.classList.remove('myFormsError');
 }
});

и jQuery

	jQuery("#myFormTema").change(function(){
               if(jQuery(this).val().trim().length < 8){ 
            jQuery(this).addClass('myFormsError');
        }else{
            jQuery(this).removeClass('myFormsError');
        }  
    })

И не один же не работает!

Ладно я, не опытный и криворукий, но тут чужой код, за который спасибо сказали и полюсы ставили люди!

Вообще ни чего не понимаю....

[DanDiablo]

Полный js: (оба выше указанных кода закомментировал, что бы не мешался пока что. На время теста их проверки на фокус поля были закомметированны.)

jQuery(document).ready(function() {

	jQuery(function(){
        jQuery("#myFormTel").mask("89999999999");
        }),
    jQuery("#myForm").submit(function(){
    	
    	var formsErrors = true;

    	if(jQuery("#myFormName").val() === '' || jQuery("#myFormName").val().length < 4){
				jQuery("#myFormName").addClass('myFormsError');
				jQuery(".knopka").html("Ой, исправьте!");
				jQuery("#result").html("Исправьте ошибки:");
				formsErrors = false;
			}else{
				jQuery("#myFormName").removeClass('myFormsError');
				jQuery(".knopka").html("Отправить письмо!");
				jQuery("#result").html("Ждем Ваших писем!");
				}

		if(jQuery("#myFormTema").val() === '' || jQuery("#myFormTema").val().length < 8){
				jQuery("#myFormTema").addClass('myFormsError');
				jQuery(".knopka").html("Ой, исправьте!");
				jQuery("#result").html("Исправьте ошибки:");
				formsErrors = false;
			}else{
				jQuery("#myFormName").removeClass('myFormsError');
				jQuery(".knopka").html("Отправить письмо!");
				jQuery("#result").html("Ждем Ваших писем!");
				}	

		if(jQuery("#myFormEmail").val() === '' || jQuery("#myFormEmail").val().length < 4){
				jQuery("#myFormEmail").addClass('myFormsError');
				jQuery(".knopka").html("Ой, исправьте!");
				jQuery("#result").html("Исправьте ошибки:");
				formsErrors = false;
			}else{
				jQuery("#myFormName").removeClass('myFormsError');
				jQuery(".knopka").html("Отправить письмо!");
				jQuery("#result").html("Ждем Ваших писем!");
				}

		if(jQuery("#myFormMessage").val() === '' || jQuery("#myFormMessage").val().length < 10){
				jQuery("#myFormMessage").addClass('myFormsError');
				jQuery(".knopka").html("Ой, исправьте!");
				jQuery("#result").html("Исправьте ошибки:");
				formsErrors = false;
			}else{
				jQuery("#myFormName").removeClass('myFormsError');
				jQuery(".knopka").html("Отправить письмо!");
				jQuery("#result").html("Ждем Ваших писем!");
				}

		if(formsErrors){
				jQuery.ajax({
	            type: "POST",
	            url: "../mail.php",
	            data: jQuery(this).serialize()
	        }).done(function() {
	            jQuery(this).find("input").each(function() {
                    jQuery(this).removeClass('myFormsError').val("");
                });
	            jQuery(".knopka").html("Спасибо!");
	            jQuery("#result").html("Спасибо за письмо!");
	            jQuery("#imgsForms").show("slow");
	            jQuery("#myForm").trigger("reset");
	            jQuery(".knopka").val("Отправляется").prop("disabled", "true");;
	            });
		}				
        return false;
    });

	   jQuery(document).scroll(function(){
        menusTop();
        scrolsTops();
    });

	jQuery("#tops").click(function (){
        jQuery("body,html").animate({
            scrollTop:0
        }, 1500);
        return false;
    });
	
// 	jQuery("#myFormTema").change(function(){
//                if(jQuery(this).val().trim().length < 8){ 
//             jQuery(this).addClass('myFormsError');
//         }else{
//             jQuery(this).removeClass('myFormsError');
//         }  
//     })


// document.getElementById("myFormTema").addEventListener("change", function(){
//  if(this.value.length < 8){
//  this.classList.add('myFormsError');
//  }else{
//  this.classList.remove('myFormsError');
//  }
// });

    jQuery("#myFormName").blur(function() {
        if(jQuery(this).val() === '' || jQuery(this).val().length < 4){
           jQuery(this).val('Не меньше 4 букв!').addClass('myFormsError');
        }
    });
    
    jQuery("#myFormName").focus(function(){
        if (jQuery(this).val() === 'Не меньше 4 букв!'){
            jQuery(this).val('').removeClass('myFormsError');
        }
    });
    
    jQuery("#myFormName, #myFormTema").keypress(function(eventObject){
        if (eventObject.which >= 33 && eventObject.which <= 128){
            jQuery(this).val('Только русскими!').addClass('myFormsError');
            return false;
        }

        if (eventObject.which >=1025 && eventObject.which <= 1105 && jQuery(this).val() === 'Только русскими!'){ 
        	jQuery(this).val('').removeClass('myFormsError');
        }
    });
    
    jQuery("#myFormEmail").blur(function() {
        if(jQuery(this).val() === '' || jQuery(this).val().length < 4){
            jQuery(this).val('Введите почту!').addClass('myFormsError');
        }
    });
    
    
    jQuery("#myFormEmail").focus(function(){
        if (jQuery(this).val() === 'Введите почту!') {
            jQuery(this).val('').removeClass('myFormsError');
        }
    });
    
    
    jQuery("#myFormTema").blur(function() {
        if(jQuery(this).val() === '' || jQuery(this).val().length < 8){
            jQuery(this).val('Не меньше 8 букв!').addClass('myFormsError');
        }
    });
    
    jQuery("#myFormTema").focus(function(){
        if (jQuery(this).val() === 'Не меньше 8 букв!'){
            jQuery(this).val('').removeClass('myFormsError');
        }
    });
    
    jQuery("#myFormMessage").blur(function() {
            if(jQuery(this).val() === '' || jQuery(this).val().length < 10){
            jQuery(this).val('Не меньше 10 букв!').addClass('myFormsError');
        }
    });
    
    jQuery("#myFormMessage").focus(function(){
        if (jQuery(this).val() === 'Не меньше 10 букв!'){
            jQuery(this).val('').removeClass('myFormsError');
        }
    });
    
});

function scrolsTops() {
    if (jQuery(this).scrollTop() >= 500){
        jQuery("#tops").fadeIn(1000);
    } else{
        jQuery("#tops").fadeOut(1500);
    }
}

function menusTop() {
     scrolls = jQuery(document).scrollTop();

     widhts = jQuery(document).width();

    if (scrolls > 285 && widhts > 767){
        jQuery('#rt-navigation3').css({
            'position':'fixed',
            'top':0,
            'z-index':3
       })
    }
    else{
        jQuery('#rt-navigation3').css({
            'position':'relative'
        })
     }
}

onresize = function () {
    menusTop();
};

Извиняюсь, за ошибки, если какие есть. Пишу поздно ночью уже.

[DanDiablo]

Сообщение от Serge_Bliznykov

в строке 102 явная ошибка (она же сразу отображается на странице).
Вас это не смущает?!

Блин, вот я олень то! Я же отключил в cms отладочный режим и не вижу этой ошибки, только сейчас дошло.

Эта ошибка заключается в том, что когда выполняется скрипт, в нём нет переменной $error

Надо ее создать пустой в самом начале, а потом ей уже будет присвоен массив с ошибками.

Спасибо!

[Stanislav]

Блин, вот я олень то!

самокритика очень хорошая черта человека (главное не переборщить) но еще лучше когда кретикуете код

[DanDiablo]

А по делу есть кому что то сказать?

Вот этот код должен бы добавлять класс ошибки, когда длина набираемого текста меньше восьми.

jQuery("#myFormTema").change(function(){
               if(jQuery(this).val().trim().length < 8){
            jQuery(this).addClass('myFormsError');
            }else{
            jQuery(this).removeClass('myFormsError');
        }
    })

Но этого не происходит почему то. Что не так или так вообще нельзя?

[Andkorol]

Учись дебажить свой код поэтапно, в данном случае проверяй:
1. происходит ли вообще обращение к этой функции при вводе текста?
2. что именно возвращает конструкция jQuery(this).val().trim().length?
Проверяется всё это элементарным выбросом в консоль любого контрольного символа или значения переменной (конструкции).
Примеров проверки длины значения в input на всяких SO море.

[DanDiablo]

Код отработал, но только после ухода из поля. Я считал, что change отслеживает события в реальном времени. Видимо, я не правильно понял change.
Хотя это решение дали человеку с подобным же вопросом, отслеживанием в реальном времени.

[Andkorol]

Сообщение от DanDiablo

Я считал, что change отслеживает события в реальном времени.

Для input при такой постановке задачи может лучше подойти keyup
Change в подобных случаях больше подходит для списков select.

[DanDiablo]

Благодарю!