HTML формасы кантип иштейт жана аны жөнөтүү үчүн эмне…

HTML-форма — интерактивдүү элемент веб-баракчада колдонуучудан маалымат чогултуу үчүн. Ал <form> тегине камтылган башкаруу элементтеринен (кичирээк талаалар, жөнөтүү баскычтары, белгилер, которгучтар жана башка) турат.

Форманы жөнөтүүдө, маалыматтар <form> тегинин ичинде жайгашкан бардык башкаруу элементтеринен чогултулуп, белгиленген сервердик дарекке жөнөтүлөт.

<form> тегинин негизги атрибуттары:

action: Маалыматтар жөнөтүлө турган URL дарек.
method: Маалыматтарды жөнөтүү үчүн колдонулган HTTP ыкмасы (GET же POST).
- GET: Маалыматтар URLге параметрлер катары кошулат. Адрес тилкесинде көрүнөт. Маалымат сурау үчүн ылайыктуу. Чектелген узундук.
- POST: Маалыматтар HTTP сурау денесинде жөнөтүлөт. Адрес тилкесинде көрүнбөйт. Ыйгаруу үчүн ылайыктуу, конфиденциалдуу маалыматтар же чоң көлөмдөгү маалыматтар үчүн.

Форманы жөнөтүү үчүн зарыл компоненттер:

<form> теги: Форманын элементтерин камтыган кутуча.
Баскычтар жана өрөөндөр: Кирүү талаалары (<input>), тексттик аймактар (<textarea>), түшүрүлгөн тизмелер (<select>) жана башка, ар биринин name атрибуту (маалыматтарды идентификациялоо үчүн) жана value (жөнөтүлүүчү мааниси).
Жөнөтүү баскычы: <button type="submit"> же <input type="submit">. Маалыматтарды жөнөтүү процесин баштайт.
action жана method атрибуттары: Маалыматтар кайда жана кандайча жөнөтүлөрүн аныктайт.
Сервердик тиркеме: Жөнөтүлгөн маалыматтарды кабыл алып, иштетиши керек. Node.js тиркеме Express сыяктуу фреймворкторду колдонуп, форма маалыматын талдай алат (req.body POST үчүн) же URL параметрлерин (req.query GET үчүн).

Жөнөкөй форма мисалы:

<form action="/submit-data" method="post">
  <label for="name">Аты:</label><br>
  <input type="text" id="name" name="name"><br>
  <label for="email">Электрондук почта:</label><br>
  <input type="email" id="email" name="email"><br><br>
  <button type="submit">Жөнөтүү</button>
</form>

Node.js менен иштетүү мисалы (Express менен):

const express = require('express');
const app = express();
const port = 3000;

// `req.body` талдоо үчүн (POST суроолор)
app.use(express.urlencoded({ extended: true }));

app.post('/submit-data', (req, res) => {
  const formData = req.body; // Форманын маалыматтары `req.body`да
  console.log('Алып келген форма маалыматы:', formData);
  res.send('Маалыматтар кабыл алынды!');
});

app.listen(port, () => {
  console.log(`Сервер портто ${port} иштеп жатат`);
});

HTML формасы кантип иштейт жана аны жөнөтүү үчүн эмне керек?