Блог

Главная - Вопросы по программированию - Форма не будет проверяться

Форма не будет проверяться

#javascript #html #forms #validation

#javascript #HTML #формы #проверка

Вопрос:

Моя форма не будет проверять все мои функции при вызове с помощью кнопки отправки 

 //This is the main function 
function validate_form(form) {
    var complete = false;

    //  Ensure that only one error message is diaplayed at a time
    if (complete) {
        clear_all();
        complete = checkUsernameForLength(form.username.value);

    }
    if (complete) {
        clear_all();
        complete = checkaddress(form.address.value);
    }
    if (complete) {
        clear_all();
        complete = checkaddress(form.address.value);
    }

    if (complete) {
        clear_all();
        complete = checkphone(form.phone.value);
    }
    if (complete) {
        clear_all();
        complete = checkEmail(email.phone.value);
    }

}

//Clear all red areas


function clear_all() {

    document.getElementById('usernamehint').style.visibility = 'hidden';
    document.basicform.username.style.backgroundColor = 'white';
    document.getElementById("countryhint").style.visibility = 'hidden';
    document.basicform.country.style.backgroundColor = 'white';
    document.getElementById("").style.visibility = 'hidden';
    document.basicformm.address.style.backgroundColor = 'white';
    document.getElementById("").style.visibility = 'hidden';
    document.basicform.phone.style.backgroundColor = 'white';
    document.getElementById("").style.visibility = 'hidden';
    document.basicform.email.style.backgroundColor = 'white';

}

// This function checks if the username field
// is at least 6 characters long.
// If so, it attaches class="welldone" to the 
// containing fieldset.


function checkUsernameForLength(whatYouTyped) {
    var fieldset = whatYouTyped.parentNode;
    var txt = whatYouTyped.value;
    if (txt.length > 2) {
        fieldset.className = "welldone";
        return true;
    } else {
        fieldset.className = "";
        return false;
    }
}




// This function checks the email address to be sure
// it follows a certain pattern:
// If so, it assigns class="welldone" to the containing
// fieldset.

function checkEmail(whatYouTyped) {
    var fieldset = whatYouTyped.parentNode;
    var txt = whatYouTyped.value;
    if (/^w ([.-]?w )*@w ([.-]?w )*(.w{2,3}) $/.test(txt)) {
        fieldset.className = "welldone";
    } else {
        fieldset.className = "";
    }
}

// If the address is at least 4 characters long, the containing 
// fieldset is assigned class="kindagood".

function checkaddress(whatYouTyped) {
    var fieldset = whatYouTyped.parentNode;
    var txt = whatYouTyped.value;
    if (txt.length > 3 amp;amp; txt.length < 10) {
        fieldset.className = "welldone";
    } else {
        fieldset.className = "";
    }
}



function checkphone(whatYouTyped) {
    var fieldset = whatYouTyped.parentNode;
    var txt = whatYouTyped.value;
    if (/^(( d{1,3}(-| )?(?d)?(-| )?d{1,5})|((?d{2,6})?))(-| )?(d{3,4})(-| )?(d{4})(( x| ext)d{1,5}){0,1}$/.test(txt)) {
        fieldset.className = "welldone";
    } else {
        fieldset.className = "";
    }
}

// this part is for the form field hints to display
// only on the condition that the text input has focus.
// otherwise, it stays hidden.

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function () {
            oldonload();
            func();
        }
    }
}


function prepareInputsForHints() {
    var inputs = document.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i  ) {
        inputs[i].onfocus = function () {
            this.parentNode.getElementsByTagName("span")[0].style.display = "inline";

        }

        inputs[i].onblur = function () {
            this.parentNode.getElementsByTagName("span")[0].style.display = "none";
        }
    }
}
addLoadEvent(prepareInputsForHints);

Вот моя форма:

    <form action="#" name="basicform"  id="basicform"  onsubmit="return validate_form()" method="post" > 

                                    <fieldset> 
                                        <label for="username">Name:</label> 
                                        <input type="text"id="username" onkeyup="checkUsernameForLength(this);" /> 
                                      <span class="hint" id="usernamehint">This Field Must Not Be Left Blank !</span> 
                                    </fieldset> 

                                     <fieldset> 
                                        <label for="country">Country:</label> 
                                        <input
                                            type="text"
                                            id="country"
                                            onkeyup="checkaddress(this);" /> 
                                        <span class="hint" id="countryhint">This Field Must Not Be Left Blank !</span> 
                                    </fieldset> 


                 <fieldset> 
                    <label for="Subject">Subject:</label> 
                    <input
                        type="text"
                        id="country"
                        onkeyup="checkaddress(this);" /> 
                    <span class="hint">Please Indicate What Your Interest Is !</span> 
                </fieldset> 



                 <fieldset> 
                    <label for="Phone">Phone:</label> 
                    <input
                        type="text"
                        id="Phone"
                        onkeyup="checkphone(this);" /> 
                    <span class="hint">This Feld Must Be Numeric Values Only !</span> 
                </fieldset> 

                <fieldset> 
                    <label for="email">Email Address:</label> 
                    <input
                        type="text"
                        id="email"
                        onkeyup="checkEmail(this);" /> 
                    <span class="hint">You can enter your real address without worry - we don't spam!</span> 
                </fieldset> 


                            amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp; <input value="send" class="gray" type="button" onclick="validate_form(this.form)"/>
                  <br /><br /> <br /><br />   
                </form>

Вот ссылка на это http://jsfiddle.net/j5fMq /

Комментарии:

1. Нам приходится просматривать огромный объем кода без каких-либо конкретных сообщений об ошибках или большого количества информации, вы получите гораздо лучшие ответы, если сможете быть более точными и лучше определить источник проблемы.

2. Этот вопрос звучит знакомо, тот, в котором document.getElementById("") также была проблема.

3. @atlavis, извините, но я не могу найти ошибку, когда я нажимаю отправить, проверка формы останавливается на первом «имени» проверки, оно не перейдет к следующему, даже если оно правильное @Marcel Korpel да, я не могу прокомментировать другой 1

4. Тогда, пожалуйста, перейдите по ссылке на другую, теперь нам придется изобретать велосипед, потому что мы не можем видеть то, что уже было написано.

5. @Marcel Korpel вопрос удален, боюсь, вот ссылка на него db3prd0204.outlook.com/owa /…

Ответ №1:

Проблема в том, что validate_form() начинается с 

 var complete = false;

и затем каждый другой блок в методе начинается с

 if (complete) {...

Поскольку complete начинается со значения false, ни один из этих блоков не будет запущен!

Ответ №2:

Ошибка: Uncaught reference validate_form() not defined

удалите onclick из кнопки. событие onsubmit формы выполнит эту работу за вас.

Ответ №3:

Ваша valide_form функция никогда ничего не сделает, потому что вы устанавливаете complete = false;

Ответ №4:

Когда вы выполняете логическую проверку (проверяете true или false), вы определяете логический объект в javascript, как показано ниже :

var myBoolean=new Boolean();

myBoolean = true;

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

P.s : Также вы можете изначально добавить Alert(); сообщения в javascript, чтобы изучить поток кода, который помогает в устранении неполадок на начальных этапах.

Надеюсь, это решит проблему.

С уважением, Раджив