1

Тема: Створити форму реєстрації

Доброго дня ,шановні програмісти))
З'явилось таке завдання:"необхідно створити реєстраційну форму з перевіркою значень, що вводяться. Далі, якщо введена інформація коректна, перевірити, що в масиві зареєстрованих користувачів відсутня інформація про користувача з даним логіном, і якщо це так – зберегти, тобто. додати новий об'єкт до масиву зареєстрованих користувачів" Я почала робити, а як далі і що далі не розумію,допоможете?Нижче код,допоможіть будь ласонькаа

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        table{
        background:#eeeeee;
        padding:5px;
        border:1px #777777 solid;}
        .vld{ background:#eeeeee;
            border:0px}
        .zorka,.vld{color:red;}
    </style>
    <script>
 
var myForm;
 
function textValid(txt, objMessage)
    {
        if (txt=="")
        {
        objMessage.value = "Поле не заповнене";
        return false;
        }
    objMessage.value = "";
    return true;
    }
 
function loginValid(logi)
    {
        if (logi=="")
        {
        myForm.vLog.value = "Поле не заповнене";
        return false;
        }
        var lg = /^[a-zA-Z1-9]+$/i;
        if (!lg.test(logi))
        {
        myForm.vLog.value = "Неправильний логін";
        return false;
        }
        else
        {
        myForm.vLog.value ="";
        return true;
        }
    }
    
 
function passValid(pass1, pass2)
    {
        if (pass1 == "" )
        {
        myForm.vPass.value = "Поле не заповнене";
        return false;
        }
        if (pass1.length < 6)
        {
        myForm.vPass.value = "Пароль короткий";
        return false;
        }
        if (pass2 == "")
        {
        myForm.vPass.value = "Повторення паролю не заповнено";
        return false;
        }
 
        if (pass1!=pass2)
        {
        myForm.vPass.value = "Паролі не збігаються";
        }
        else
 
        {
        myForm.vPass.value ="";
        return true;
        }
    }
 
 
 
    функція validate(mF)
    {
 
    myForm = mF;
 
    var ima = textValid(myForm.ima.value, myForm.vIma);
    var fam = textValid(myForm.family.value,myForm.vFam);
    var login = loginValid(myForm.login.value);
    var pass = passValid(myForm.pass1.value);
    return ima&&fam&&login&&pass;
    }
    
 
        return false;
    
    </script>
  </head>
  <body>
  
    <table>
    <tr><td colspan="3" align="center"><h3>Реєстраційна форма</h3></td></tr>
    <form name="myForm" onsubmit="return validate(this);">
        <tr><td>Ім'я<span class="zorka">*</span></td><td><input type="text" name="ima" maxlength = "16" ></td ><td><input type="text" class="vld" name="vIma" readonly ></td></tr>
        <tr><td>Фамилия<span class="zorka">*</span></td><td><input type="text" name="family" maxlength = "16" ></td>< td><input type="text" class="vld" name="vFam" readonly ></td></tr>
        <tr><td>Логін<span class="zorka">*</span></td><td><input type="text" name="login" maxlength = "10" ></td>< td><input type="text" class="vld" name="vLog" readonly ></td></tr>
        <tr><td>Пароль<span class="zorka" name="vPass">*</span></td><td><input type="password" name="pass1" maxlength = "10"> </td><td><input type="text" class="vld" name="vPass" readonly ></td></tr>
        <tr><td>Повторіть пароль<span class="zorka">*</span></td><td><input type="password" name="pass2" maxlength = "10"></td> <td></td></tr>
      
        <tr><td></td><td colspan="2"><input type="submit" value="Зареєструватися"> <input type="submit" value="
            Вхід"></td></tr>
        
 
    </form>
    </table>
</body>
</html> 

2

Re: Створити форму реєстрації

Я вже всі методи перепробував і такий але щось від не працює зовсім

function validate(mF) {

myForm = mF;

var ima = textValid(myForm.ima.value, myForm.vIma);
var fam = textValid(myForm.family.value, myForm.vFam);
var login = loginValid(myForm.login.value);
var pass = passValid(myForm.pass1.value);
var people = JSON.parse(window.localStorage.getItem("people") || "[]");
if (ima && fam && login && pass) {
    var i = myForm.ima.value,
       var f = myForm.family.value;
    var index = people.findIndex(a => a.i == i && a.f == f);
    if (index == -1) {
        alert("о новенький!");
        people.push({
            i,f
        });
        window.localStorage.setItem("people", JSON.stringify(people))
    } else {
        alert(`Привіт ${i} ${f}`);
    }

}
return ima && fam && login && pass;
}

3

Re: Створити форму реєстрації

Де саме має зберігатися масив користувачів? У браузері, до перезавантаження сторінки?

4

Re: Створити форму реєстрації

Напевно так,тому що потрібно зробити на js,і не звертатися до сервера (і використовувати php
)

5

Re: Створити форму реєстрації

Ви дівчина чи хлопець? (напевно дівчина :D)
чому у вас

функція validate(mF)

замість

function validate(mF)

ви точно самі код писали?
на якому етапі ви почали не розуміти що далі робити?

6

Re: Створити форму реєстрації

Google Translate часто плутає роди. І перекладає ключові слова. А от "Фамилия" чомусь не переклав :)

7

Re: Створити форму реєстрації

Так,я дівчина,і звісно переклала через Google Translate, просто у мене було написано на рос.мові,я вирішила скоріше перекласти ,і ось так вийшло,а не розуміти почала,перевірки я зробила,а ось як саме як розробити масив користувачів і т.д,допоможіть будь-ласонька,не кидайте у біді)

8 Востаннє редагувалося mamkin haker (29.10.2021 10:02:28)

Re: Створити форму реєстрації

https://javascript.info/array - хороший та зрозумілий сайт по вивченню JS, якщо не зрозумієте то повертайтесь знову
(посилання уже на масиви, якщо не подобається англійська, спробуйте змінити мову сайту на іноземну (російська/німецька)

9

Re: Створити форму реєстрації

Я вже там була,я 3 дні не можу розуміти як це можна реалізувати,пробувала і ось так ,але як це зробити правильно і саме реалізувати для мого коду не розумію...

 users = ["Тимур","Микола"];
     
    result ="";
   if(nam){
    for(var i = 0; i<=users.length; i++){
  if ( nam==users[i]) {result = users[i];
    alert("користувач вже зареєстрований ");break;}
  else
users=nam[i];

alert("Реєстрація користувача");break;}
   }

10

Re: Створити форму реєстрації

створіть 5 масивів
1 на логін 2 напароль 3 на імя 4 на прізвище 5 на повторення пароля
і далі виясніть чи знаходиться логів в масиві з логінами, немає? додавайте до кожного масиву свій елемент, є? виводьте на екран що такий користувач уже є

11

Re: Створити форму реєстрації

Я в кожній функції писала цей фрагмент коду,але воно видає повідомленя відразу,навіть якщо дані введені невірно,а потрібно якщо дані введені коректно то тоді "шукати" по массиву користувача і якщо його не знайдено ,виводити повідомлення наприклад "користувача не знайдено йде реєстрація",якщо знайдено то "користувач зареєстрований",якщо ж хоч в одному пункті є помилка,то там в мене збоку виводиться повідомлення неправильно введено,і т.д

12

Re: Створити форму реєстрації

просто у мене було написано на рос.мові

а де ви те завдання отримали?

Подякували: koala1

13

Re: Створити форму реєстрації

Завдання отримала від викладача

14

Re: Створити форму реєстрації

noname122 написав:

Завдання отримала від викладача

Тоді тут все просто. Йдете в деканат, чи що там у вас, і кажете, що такий то викладач роздає завдання іноземною мовою, котрої я не зобов'язана знати. І поки він вам не дасть завдання нормальною (а не перекладеною в гугл транслейті) українською, доти ніякого завдання робити не варто.
Будь-які відмови аргументовані "ну ви жє понімаєте всьо" просто ігноруйте та вимагайте свого. Ці рускі (а це те саме, що підараси), повинні бути ПІД НАМИ, а не над нами, і це вони мають робити те, що ми їм кажемо, а не вони нам.

Подякували: koala, mamkin haker, flatliner3

15

Re: Створити форму реєстрації

Та я розумію,але "на носі" сессія,і якось не дуже доречно,сваритися,краще допоможіть,я вже переклала на українську,допоможіть,хлопці будь ласонька(

16

Re: Створити форму реєстрації

noname122 написав:

Та я розумію,але "на носі" сессія,і якось не дуже доречно,сваритися,краще допоможіть,я вже переклала на українську,допоможіть,хлопці будь ласонька(

▼Прихований текст

Хай помрете, та за вами останеться рух.

Той ваш код якийсь геть не цей во, пізніше гляну.

17

Re: Створити форму реєстрації

Дякую,буду вас чекати,якщо допоможете віддячу вам)

18

Re: Створити форму реєстрації

Якщо хтось раніше допоможе,тому віддячу)

19

Re: Створити форму реєстрації

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <style>
      body {
        background-image: url('https://img.pravda.com/images/doc/e/2/e24a63f-1.jpg');
      }
      table {
        margin: 20px auto;
        background: #eeeeee;
        padding: 5px;
        border: 1px #777777 solid;
      }
      .vld {
        background: #eeeeee;
        border: 0px;
      }
      .zorka,
      .vld {
        color: red;
      }
    </style>
    <script>
      const allUsers = [];

      function textValid(txt, objMessage) {
        if (txt == '') {
          objMessage.value = 'Поле не заповнене';
          return false;
        }
        objMessage.value = '';
        return true;
      }

      function loginValid(login, objMessage) {
        if (login == '') {
          objMessage.value = 'Поле не заповнене';
          return false;
        }
        var lg = /^[a-zA-Z1-9]+$/i;
        if (!lg.test(login)) {
          objMessage.value = 'Неправильний логін';
          return false;
        } else {
          objMessage.value = '';
          return true;
        }
      }

      function passValid(pass1, pass2, objMessage) {
        if (pass1 == '') {
          objMessage.value = 'Поле не заповнене';
          return false;
        }
        if (pass1.length < 6) {
          objMessage.value = 'Пароль короткий';
          return false;
        }
        if (pass2 == '') {
          objMessage.value = 'Повторення паролю не заповнено';
          return false;
        }

        if (pass1 != pass2) {
          objMessage.value = 'Паролі не збігаються';
        } else {
          objMessage.value = '';
          return true;
        }
      }

      function submitForm(event, myForm) {
        event.preventDefault();
        event.stopPropagation();
        var name = textValid(myForm.elements.ima.value, myForm.elements.vIma);
        var lastName = textValid(
          myForm.elements.family.value,
          myForm.elements.vFam
        );
        var login = loginValid(
          myForm.elements.login.value,
          myForm.elements.vLog
        );
        var password = passValid(
          myForm.elements.pass1.value,
          myForm.elements.pass2.value,
          myForm.elements.vPass
        );
        if (name && lastName && login && password) {
          const user = allUsers.find(user => user.login === login);
          if (user) {
            return alert('Користувач з таким логіном вже зареєстрований');
          } else {
            allUsers.push({ name, lastName, login, password });
            return alert(
              'Користувач з логіном ' + login + ' був успішно зареєстрований.'
            );
          }
        }
      }
    </script>
  </head>
  <body>
    <table>
      <tr>
        <td colspan="3" align="center">
          <h3>Реєстраційна форма</h3>
        </td>
      </tr>
      <form name="myForm" onsubmit="return submitForm(event, this)">
        <tr>
          <td>Ім'я<span class="zorka">*</span></td>
          <td><input type="text" name="ima" maxlength="16" /></td>
          <td><input type="text" class="vld" name="vIma" readonly /></td>
        </tr>
        <tr>
          <td>Прізвище<span class="zorka">*</span></td>
          <td><input type="text" name="family" maxlength="16" /></td>
          <td><input type="text" class="vld" name="vFam" readonly /></td>
        </tr>
        <tr>
          <td>Логін<span class="zorka">*</span></td>
          <td><input type="text" name="login" maxlength="10" /></td>
          <td><input type="text" class="vld" name="vLog" readonly /></td>
        </tr>
        <tr>
          <td>Пароль<span class="zorka" name="vPass">*</span></td>
          <td><input type="password" name="pass1" maxlength="10" /></td>
          <td><input type="text" class="vld" name="vPass" readonly /></td>
        </tr>
        <tr>
          <td>Повторіть пароль<span class="zorka">*</span></td>
          <td><input type="password" name="pass2" maxlength="10" /></td>
          <td></td>
        </tr>
        <tr>
          <td></td>
          <td colspan="2">
            <input type="submit" value="Зареєструватися" />
            <input
              type="submit"
              value="
            Вхід"
            />
          </td>
        </tr>
      </form>
    </table>
  </body>
</html>
Подякували: mamkin haker, noname122, flatliner3

20

Re: Створити форму реєстрації

FakiNyan Героям Слава!

Подякували: FakiNyan1