Проверка формы с помощью инструкций If Else и document.getElementByID

Я новичок на сайте, но на прошлой неделе я провел трал в интернете для ответа на этот вопрос, и я не могу найти его.Проверка формы с помощью инструкций If Else и document.getElementByID

Что мне нужно, это 2 из 3 полей в форме, чтобы подтвердить, нажав кнопку отправки, и вместо перехода на следующую страницу, перед тем, как разрешить это, необходимо выполнить проверку.

Это то, что у меня есть,

HTML:

function validateForm(input) { 
 
    var isValid = true; 
 
    if (!document.getElementById("Name").value.trim().length) { 
 
    isValid = false; 
 
    alert("Please enter your First Name"); 
 
    } else if (!document.getElementById("Comment1").value.trim().length) { 
 
    isvalid = false; 
 
    alert("Please enter your phone number"); 
 
    } else { 
 
    return false; 
 
    } 
 
    if (isValid) { 
 
    document.getElementById('ICContainer').style.display; 
 
    loadInstantChat(); 
 
    } 
 
}

input[type=submit] { 
 
    position: relative; 
 
    top: 20px; 
 
    width: 322px; 
 
    background-color: #EF423E; 
 
    border-radius: 5px; 
 
    border: none; 
 
    color: white; 
 
    padding: 4px; 
 
    font-family: 'arial'; 
 
    font-size: 11pt; 
 
    text-decoration: double; 
 
    margin: 4px 2px; 
 
    cursor: pointer; 
 
} 
 

 
input[type=text], 
 
[type=number], 
 
[type=email] { 
 
    width: 323px; 
 
    padding: 4px 4px; 
 
    margin: 8px 0; 
 
    box-sizing: border-box; 
 
    border: solid #EF423E 2px; 
 
    border-radius: 5px; 
 
    color: #4E4E56; 
 
    background-color: #f9f9f9; 
 
    font-family: 'arial'; 
 
    font-size: 11pt; 
 
}

<body onload="handleRebootOrRefresh();"> 
 
    <form name="input" action="#" onsubmit="return validateForm(input)" method="post"> 
 
    Your first name:* <input id="Name" type="text" name="inputName"> Your phone number:* <input id="Comment1" type="text" name="inputNumber"> Claim Reference: <input id="Comment2" type="text" name="inputClaim"> 
 
    <input type="submit" value="Chat Now" onclick="validateForm(input)"> 
 
    </form> 
 

 
    <div id="ICContainer" style="position: absolute; left: 0px; top: 0px; width: 350px; height: 550px; display: none"></div> 
 
</body>

Там много других JavaScript работает в этом коде, что я не хочу трогать, но я нужно знать, как получить верхние 2 поля для проверки, и если он успешно проверяет, он переходит на следующую страницу (то есть document.getElementByID('ICContainer').style.display; loadInstantChat();

Чтобы это стало ясно, это экземпляр мгновенного чата LogMeIn Rescue, а их линия поддержки - «Ничего не трогайте, даже если мы буквально дадим вам пошаговое руководство».

источник

2017-02-20 Anonymous

Вы можете использовать возвращаемое значение функции для предотвращения отправки формы

<form name="myForm" onsubmit="return validateMyForm();">

и функции, как

<script type="text/javascript"> 
function validateMyForm() 
{ 
    if(check if your conditions are not satisfying) 
    { 
    alert("validation failed false"); 
    returnToPreviousPage(); 
    return false; 
    } 

    alert("validations passed"); 
    return true; 
} 
</script>

источник

2017-02-20 15:48:24 jdmdevdotnet

Спасибо. Но я попытался это сделать. Я могу заставить валидацию работать, но я не могу заставить ее работать после проверки, она вызывает document.getElementById ('ICContainer'). Style.display; loadInstantChat(); –

'Я могу заставить валидацию работать, но я не могу заставить ее работать после проверки правильности? – jdmdevdotnet

Итак, две формы, которые я требовал подтвердить, имя и номер телефона приходят с предупреждением о том, что ящики необходимы. Если поля правильно заполнены, предупреждение не появляется, но не открывает следующий документ/запускает следующий скрипт. –

Я думаю, что вам нужно удалить некоторые атрибуты из вашей формы индуктора:

action="#" onsubmit="return validateForm(input)" method="post"

Вы можете создать новую функцию (handleForm), которая вызывает validateForm, и если eve rythings, это нормально отправить запрос AJAX на ваш сервер.

<input type="submit" value="Chat Now" onclick="handleForm(input)"> 

[...] 
function handleForm(input) { 
    var isValid = validateForm(input); 
    if (isValid) { 
    //perform your ajax request here 
    } 
} 

function validateForm(input) { ...

источник

2017-02-20 15:53:43 Kornflexx

Проверка формы с помощью инструкций If Else и document.getElementByID

ответ

Смежные вопросы