Регистрация на javascript и ajax?

[GoogleChrome]

Помогите разобраться. Интересует регистрация на сайте на чистом java и ajax без перезагрузки страницы

html

<div><input id="email" name="email" type="email" placeholder="E-mail"></div>
<div><input id="name" name="name" type="text" placeholder="Name"></div>
<div><input id="pass" name="pass" type="password" placeholder="Password"></div>
<button type="submit" class="reg" name="reg">REG</button>
<div id="otvet"></div>

php

if(isset($_POST['reg'])) {
$db->query("INSERT INTO user (email,name, password) VALUES ('$email','$name','$pass')");
}

js

document.querySelector(".reg").click() {
var nameuser = document.getElementsById("nameuser");
var emailuser = document.getElementsById("emailuser");
var passuser = document.getElementsById("passuser");
const request = new XMLHttpRequest();
const url = "reg.php";
}

Как дописать js чтобы регистрация работала и чтобы в div otvet вставлялось что рега прошла или не прошла

Изменено 4 декабря, 2020 пользователем GoogleChrome

[Alexey]

4 часа назад, GoogleChrome сказал:

Помогите разобраться. Интересует регистрация на сайте на чистом java и ajax без перезагрузки страницы

html

<div><input id="email" name="email" type="email" placeholder="E-mail"></div>
<div><input id="name" name="name" type="text" placeholder="Name"></div>
<div><input id="pass" name="pass" type="password" placeholder="Password"></div>
<button type="submit" class="reg" name="reg">REG</button>
<div id="otvet"></div>

php

if(isset($_POST['reg'])) {
$db->query("INSERT INTO user (email,name, password) VALUES ('$email','$name','$pass')");
}

js

document.querySelector(".reg").click() {
var nameuser = document.getElementsById("nameuser");
var emailuser = document.getElementsById("emailuser");
var passuser = document.getElementsById("passuser");
const request = new XMLHttpRequest();
const url = "reg.php";
}

Как дописать js чтобы регистрация работала и чтобы в div otvet вставлялось что рега прошла или не прошла

А почему не на jQuery, могу помочь написать. Там вывод в php тупо текст, лучше исправить на json 

[GoogleChrome]

пилю сайт на чистом js для мега скорости. json ведь без jquey тоже работает.

[6hr3d3r]

Не знаю если актуально, но пох

Для реализации регистрации на сайте без перезагрузки страницы с использованием чистого JavaScript и AJAX, давай рассмотрим следующие шаги:

1. HTML: Убедись, что у тебя есть правильные id для элементов ввода:

<div><input id="email" name="email" type="email" placeholder="Мыло"></div>
<div><input id="name" name="name" type="text" placeholder="Имя"></div>
<div><input id="pass" name="pass" type="password" placeholder="Пароль"></div>
<button type="button" class="reg" name="reg">REG</button>
<div id="otvet"></div>

      2. JavaScript (AJAX): Допиши JavaScript-код для обработки события клика на кнопке "REG" и отправки данных на сервер:

document.querySelector(".reg").addEventListener("click", function() {
  var nameuser = document.getElementById("name").value;
  var emailuser = document.getElementById("email").value;
  var passuser = document.getElementById("pass").value;

  const request = new XMLHttpRequest();
  const url = "reg.php";

  request.open("POST", url, true);
  request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

  request.onreadystatechange = function() {
    if (request.readyState === XMLHttpRequest.DONE) {
      if (request.status === 200) {
        // Обработка успешного ответа от сервера
        document.getElementById("otvet").textContent = "Регистрация прошла успешно!";
      } else {
        // Обработка ошибки
        document.getElementById("otvet").textContent = "Ошибка при регистрации.";
      }
    }
  };

  const data = `name=${nameuser}&email=${emailuser}&pass=${passuser}`;
  request.send(data);
});

      3. PHP: В твоем PHP-скрипте (reg.php) обработай полученные данные и выполните регистрацию:

<?php
if (isset($_POST['name']) && isset($_POST['email']) && isset($_POST['pass'])) {
    $name = $_POST['name'];
    $email = $_POST['email'];
    $pass = $_POST['pass'];

    // Здесь вставь код для подключения к базе данных и выполнения INSERT-запроса
    // $db->query("INSERT INTO user (email,name, password) VALUES ('$email','$name','$pass')");

    // В случае успешной регистрации вернёт статус 200
    http_response_code(200);
} else {
    // Если данные не были переданы, вернёт статус 400
    http_response_code(400);
}
?>

Не забудь, что тебе нужно будет настроить подключение к базе данных и выполнение INSERT-запроса в PHP-скрипте в соответствии с твоими потребностями.

Это общий пример реализации. Также помни о безопасности, например, санитизируй входные данные и защищайся от SQL-инъекций.