сохранить значения формы по нажатию после сбоя проверки JavaScript

Question

Это часть задания.Все, что должно работать, уже работает, но есть кое-что, что беспокоит меня.Пока единственная цель кода - проверить нашу способность проверять данные.В любом случае, прямо сейчас функция validate () присоединена к кнопке отправки:

<input type="submit" value="Find Love" onclick="validate()">

При сбое любой проверки все текстовые поля, выпадающие списки и т. Д. Очищаются, но я хочу, чтобы они сохранили своизначения и просто сосредоточиться на первом неправильном значении (сохранение их значений является более важным для меня в данный момент).Фактическое Требует ли это некоторой модификации функции onclick или другой функции вместе?Пожалуйста помоги.Если вам нужно увидеть javascript, я также могу опубликовать его.

function validate()
{
var blnValid = true;

if(isBlank("txtFName"))
{
    blnValid = false;
    alert("First name cannot be blank!")
    document.getElementById("txtFName").focus();
}

if(blnValid)
{   
    if(isBlank("txtLName"))
    {
        blnValid = false;
        alert("Last name cannot be blank!")
        document.getElementById("txtLName").focus();
    }
}
if(blnValid)
{
    if(isBlank("txtAge"))
    {
        blnValid = false;
        alert("Age cannot be blank!")
        document.getElementById("txtAge").focus();
    }
}
if(blnValid)
{
    var strInput = document.getElementById("txtAge").value;
    if(!isInt(strInput))
    {
        blnValid = false;
        alert("You must enter a valid number in the age field.")
        document.getElementById("txtAge").select();
    }
}
if(blnValid)
{
    if(document.getElementById("selUserGender").selectedIndex <= 0)
    {
        alert("Please select your gender");
        blnValid = false;
    }
}
if(blnValid)
{
    if(document.getElementById("selFindGender").selectedIndex <= 0)
    {
        alert("Please select your gender");
        blnValid = false;
    }
}
if(blnValid)
{
    blnChecked = false;
    arRadio = document.forms[0].rdbAgeRange;
    for (var i = 0; i < arRadio.length; i++)
    {
        if(arRadio[i].checked)
        {
            blnChecked = true;
            break;
        }
    }
    if (!blnChecked)
    {
        alert("You must select an age group.");
        blnValid = false;
    }
}
if(blnValid)
{
    if(!document.getElementById("chkSkeeball").checked
        && !document.getElementById("chkAir").checked
        && !document.getElementById("chkCliff").checked
        && !document.getElementById("chkHamster").checked)
    {
        blnValid = false;
        alert("You must select a hobby.")
    }   
}

return blnValid;
}


function isInt(strValue)
{
var validNums = "0123456789";
var blnIsNumber = true;
var tempChar;

for (var i = 0; i < validNums.length; i++)
{
    tempChar = strValue.substr(i, 1);
    if (validNums.indexOf(tempChar) == -1)
    {
        return false;

    }
}
return true;
}

function isBlank(elementID)
{
if(document.getElementById(elementID).value.length == 0)
{
    return true;
}

return false;
}

Answer 1

Ваша проблема на самом деле ваш HTML. Ничто в вашем Javascript не сможет очистить элементы, но поскольку вы используете onClick, форма все равно отправляется. Я предполагаю, что он, вероятно, просто отправляет обратно на страницу и очищает все. Вместо onClick используйте onSubmit в элементе формы:

<form method="post" action="url_of_action" onSubmit="return validate()">

Если оно недействительно, оно не позволит отправить форму.

Answer 2

Отсутствующие точки с запятой:

if(isBlank("txtFName"))
{
    blnValid = false;
    alert("First name cannot be blank!") //here
    document.getElementById("txtFName").focus();
}

if(blnValid)
{   
    if(isBlank("txtLName"))
    {
        blnValid = false;
        alert("Last name cannot be blank!") //and here
        document.getElementById("txtLName").focus();
    }
}
if(blnValid)
{
    if(isBlank("txtAge"))
    {
        blnValid = false;
        alert("Age cannot be blank!") //and here
        document.getElementById("txtAge").focus();
    }
}