2016-03-21 3 views
0

Я не могу заставить эту «myfunction1» работать. Может быть, я установил неправильную или тупую ошибку. Мне нужно, чтобы он работал так, если в двух текстовых вводах ничего нет, вы получаете всплывающее предупреждение о том, чтобы исправить форму. Если в ящике уже есть вход, мне нужно, чтобы оно было завершено или спасибо. Я уверен, что это легко исправить, но если кто-то может мне помочь, я был бы признателен. Уже 4 часа искали и все еще застряли. Благодаря!Сломанная функция нуждается в помощи/совете

<!DOCTYPE HTML> 
<html> 
<head> 
<link rel="stylesheet" href="styles.css"> 


</script> 
    </head> 
    <body> 
    <form id="myForm"> 
    First name: <input type="text" id="field1" name="fname"><br><br> 
    Last name: <input type="text" id="field2" name="lname"><br><br> 
    <input type="button" onclick="myFunction()" value="Reset form"> 
    <input type="button" onclick="myFunction1()" value="Submit form"> 
</form> 

<script> 
    function myFunction() { 
    document.getElementById("myForm").reset(); 
    } 
    function myFunction1() { 
    var x = document.getElementById("field1").value; 
    if (x == null || x == "") { 
    alert("Please Fill In Form Correctly"); 
    } else { 
    alert("Thank You for Submitting"); 
    } 
} 
    </script> 



    </body> 
    </html> 
+0

после вопроса обновления Это работает отлично право? – Balaji

+0

Когда вы застряли в javascript, помните, что почти у каждого браузера есть интерактивная консоль, где печатаются ошибки. –

ответ

0
<!DOCTYPE HTML> 
<html> 
<head> 
    <link rel="stylesheet" href="styles.css"> 
    <script> 
    function myFunction() { 
    document.getElementById("myForm").reset(); 
    } 
    function myFunction1() { 
    var x = document.getElementById("field1").value; 
    if(x){ 
     if (x == "") 
     { 
      alert("Please Fill In Form Correctly"); 
     } else { 
      alert("Thank You for Submitting"); 
     } 
    } 



} 
    </script> 
</head> 
    <body> 
    <form id="myForm"> 
     First name: <input type="text" name="fname" id="field1"><br><br> 
     Last name: <input type="text" name="lname" id="field2"><br><br> 
     <input type="button" onclick="myFunction()" value="Reset form"> 
     <input type="button" onclick="myFunction1()" value="Submit form"> 
    </form> 


    </body> 
    </html> 
0

Я не могу показаться, чтобы получить это "myfunction1" работать.

Несколько вопросов в коде

  1. Вы должны использовать document.getElementById, а не только getElementById

  2. Id, который вы передаете методу не существует в разметке. На самом деле ни одно из полей ввода разметки не имеет идентификатора.

Попробуйте

function myFunction1() 
{ 
    var field1 = document.getElementById("field1").value.trim(); 
    var field2 = document.getElementById("field2").value.trim(); 
    if (field1.length == 0 || field2.length == 0) 
    { 
     alert("Please Fill In Form Correctly"); 
    } 
    else 
    { 
     alert("Thank You for Submitting"); 
    } 
} 
+0

OP, похоже, редактировал вопрос. –

+0

Я исправил это! Я чувствую себя действительно глупо, сижу за компьютером уже 5 часов, работая над другим кодом html, просто попадая в javascript. Все еще немного запутался в том, как я могу заставить его посмотреть как поле1, так и поле2 и проверить независимо, если только один из них не имеет ввода. Буду ли я просто продолжать с другим, если и т. Д. ... или это их более простой способ. Большое спасибо! –

+0

@AndrewRibicki попробуйте код, который я опубликовал – gurvinder372

0

попробуйте следующий код. введите id для каждого элемента формы, так как вы используете geteletmentbyid.

<script> 
 
    function myFunction() { 
 
    document.getElementById("myForm").reset(); 
 
    } 
 
    function myFunction1() 
 
\t { 
 
    var x = document.getElementById("fname").value; 
 
\t 
 
    if (x == null || x == "") 
 
\t { 
 
    alert("Please Fill In Form Correctly"); 
 
    } else { 
 
    alert("Thank You for Submitting"); 
 
    } 
 
} 
 
    </script>
<!DOCTYPE HTML> 
 
<html> 
 
<head> 
 
<link rel="stylesheet" href="styles.css"/> 
 

 

 

 
    </head> 
 
    <body> 
 
    <form id="myForm"> 
 
    First name: <input id="fname" type="text" name="fname"><br><br> 
 
    Last name: <input id="lname" type="text" name="lname"><br><br> 
 
    <input type="button" onclick="myFunction()" value="Reset form"> 
 
    <input type="button" onclick="myFunction1()" value="Submit form"> 
 
</form> 
 
    
 
<!-- copy the javascript party here---> 
 
    
 
    
 
</body> 
 
    </html>

0

Это не может быть ответом на ваш актуальной проблемой. Но вот рабочий jsFiddle, которые могут помочь вам получить дальше: https://jsfiddle.net/y8135trb/4/

<body> 
    <form id="myForm"> 
    First name: 
    <input type="text" id="field1" name="fname"> 
    <br> 
    <br> Last name: 
    <input type="text" id="field2" name="lname"> 
    <br> 
    <br> 
    <input type="button" onclick="myFunction()" value="Reset form"> 
    <input type="button" onclick="myFunction1()" value="Submit form"> 
    </form> 

    <script> 
    function myFunction() { 
     document.getElementById("myForm").reset(); 
    } 

    function myFunction1() { 
     var x = document.getElementById("field1").value; 

     if (typeof x == 'undefined' || x == null || x == "") { 
     alert("Please Fill In Form Correctly"); 
     } else { 
     alert("Thank You for Submitting"); 
     } 
    } 
    </script> 
</body>