При отправки формы страница перезагружается

Question

У меня есть форма которую нужно отправиться на json server, форма отправляется но страница перезагружается, а мне не нужно что б страница перезагружалась. preventDefault() не работает.
JS код:`

window.addEventListener("DOMContentLoaded", () => {
const form = document.querySelector("form");

function request(e) {
e.preventDefault();

let formData = new FormData(form);
formData.append("id", Math.random());

let object = {};
formData.forEach((value, key) => {
  object[key] = value;
});

let json = JSON.stringify(object);
console.log(json);
const server = new XMLHttpRequest();
server.open("POST", "http://localhost:3000/people");
server.setRequestHeader("Content-type", "application/json; charset=utf=8");
server.send(json);

server.addEventListener("load", function () {
  if (server.status == 200) {
    let data = JSON.parse(server.response);
    console.log(data);
  } else {
    console.error("Bed news");
  }
  });
}
 form.addEventListener("submit", (e) => request(e));
});`

HTML код:

<form>
 <input type="text" name="name">
 <input type="text" name="age">
 <button>Submit</button>
</form>

Answer 1

У меня ваш код работает корректно. Проверял на такой локальной конфигурации:

const express = require("express");
const chalk = require("chalk");
const dotenv = require("dotenv");
const path = require("path");
const bodyParser = require("body-parser");

const success = chalk.bgGreen;
dotenv.config();

const app = express();

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

app.set("views", path.join(__dirname, "views"));
app.set("view engine", "pug");

app.get("/", (req, res) => res.render("home"));
app.listen(process.env.PORT, () =>
  console.log(success(`Example app listening on port ${process.env.PORT}!`))
);

app.post("/people", (req, res) => {
  console.log(req.body);
  req.body["success"] = "ok";
  res.send(req.body);
});

Запрос сервер получает и браузер не перезагружается. Однако скопировав ваш код, я заметил в самом конце знак ` (обратной кавычки), если её оставить весь код JS крашится. Может проблема в этом?

БЛОГ НА HUSL

При отправки формы страница перезагружается

Ответы (1 шт):