s4ros icon

e.14.2019-js

s4ros | PRO | 06/28/19 10:49:56 AM UTC | 0 ⭐ | 467 👁️ | Never ⏰ | []
HTML |

2.37 KB

|

None

|

0 👍

/

0 👎

<!doctype html>
<html>
 
<head>
  <meta charset="UTF-8">
  <title>...</title>
  <style media="screen">
    div {
      display: block
    }
  </style>
</head>
 
<body>
  <div id="formularz">
    <form name="zgloszenie" action="#">
      <label for="imie">Imię</label><input type="text" name="imie" id="imie">
      <label for="nazwisko">Nazwisko</label><input type="text" name="nazwisko" id="nazwisko">
      <label for="email">E-Mail</label><input type="text" name="email" id="email">
      <label for="usluga">Usługa</label><textarea name="usluga" rows="8" cols="80" id="usluga"></textarea>
      <input type="checkbox" name="regulamin" value="" id="regulamin">Zapoznalem sie z regulaminem
      <input type="button" name="reset" value="Resetuj" onclick="reset_form()">
      <input type="button" name="submit" value="Wyślij" onclick="wyslij()">
    </form>
  </div>
  <div id="uwaga" style="display: none; color: #F00">
    <h2>Musisz zapoznać się z regulaminem!</h2>
  </div>
  <div id="podsumowanie" style="display: none">
 
  </div>
  <script type="text/javascript" language="javascript">
    var imie = document.getElementById('imie')
    var nazwisko = document.getElementById('nazwisko')
    var email = document.getElementById('email')
    var usluga = document.getElementById('usluga')
    var regulamin = document.getElementById('regulamin')
 
    var uwaga = document.getElementById('uwaga')
    uwaga.style.display = 'none'
    var podsumowanie = document.getElementById('podsumowanie')
    podsumowanie.style.display = 'none'
    // funkcja resetująca wartości wszystkich pol
    function reset_form() {
      imie.value = ''
      nazwisko.value = ''
      email.value = ''
      usluga.value = ''
      regulamin.checked=false
      uwaga.style.display = 'none'
      podsumowanie.style.display = 'none'
    }
 
    function wyslij() {
      if (regulamin.checked) {
        uwaga.style.display = 'none'
        podsumowanie.style.display = 'block'
        podsumowanie.innerHTML = `
        <p align="center">`+ imie.value.toUpperCase() + ' ' + nazwisko.value.toUpperCase() +`</p>
        <p align="center">Treść Twojej sprawy: `+ usluga.value +`</P>
        <p align="center">Na podany email zostanie wysłana oferta</p>
        `
 
      } else {
        uwaga.style.display = 'block';
      }
    }
  </script>
</body>
 
</html>

Comments