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