آموزش HTML - ویژگی های فرم

فرم‌های HTML برای جمع‌آوری ورودی کاربر، مانند متن، چک باکس، دکمه‌های رادیویی و موارد دیگر استفاده می‌شوند. چندین ویژگی وجود دارد که می توانید از آنها برای سفارشی کردن نحوه عملکرد و ظاهر فرم خود استفاده کنید.

در اینجا برخی از ویژگی های فرم HTML رایج مورد استفاده قرار می گیرند:

action: این ویژگی مشخص می کند که هنگام ارسال فرم، داده های فرم باید به کجا ارسال شوند. می توانید از یک URL نسبی یا مطلق استفاده کنید یا آن را خالی بگذارید تا فرم را به صفحه جاری ارسال شود.

مثال: <form action="/submit-form.php">

method: این ویژگی متد HTTP را مشخص می کند که در هنگام ارسال فرم مورد استفاده قرار گیرد. دو روش رایج GET و POST هستند.

مثال: <form method="post">

در HTTP (پروتکل انتقال ابرمتن)، دو روش اصلی برای ارسال داده ها به سرور وجود دارد: GET و POST. این روش ها نحوه ارسال و بازیابی داده ها به سرور را هنگام ارسال فرم توسط کاربر تعیین می کنند.

1. روش GET: روش GET برای درخواست داده از یک سرور استفاده می شود. هنگامی که کاربر فرمی را با روش GET ارسال می کند، داده های فرم به عنوان پارامترهای پرس و جو به URL اضافه می شود که با علامت سوال از هم جدا می شوند. سپس سرور درخواست را پردازش می کند و داده های درخواستی را به عنوان پاسخ برمی گرداند.

در اینجا نمونه ای از فرمی است که از متد GET استفاده می کند:

<form action="example.php" method="get">
  <label for="name">نام:</label>
  <input type="text" id="name" name="name"><br>
  <label for="email">پست الکترونیک:</label>
  <input type="email" id="email" name="email"><br>
  <input type="submit" value="Submit">
</form>

هنگامی که کاربر این فرم را ارسال می کند، داده ها با فرمت زیر به اسکریپت example.php ارسال می شود:

example.php?name=example&email=info@example.com

پارامترهای پرس و جو در URL قابل مشاهده هستند، که نشانک گذاری و اشتراک گذاری پیوند را آسان می کند.

2. روش POST: روش POST برای ارسال داده ها به سرور استفاده می شود. هنگامی که کاربر فرمی را با روش POST ارسال می کند، داده های فرم در متن درخواست HTTP ارسال می شود که در URL قابل مشاهده نیست. سپس سرور درخواست را پردازش می کند و پاسخی را برمی گرداند.

در اینجا نمونه ای از فرمی است که از روش POST استفاده می کند:

<form action="example.php" method="post">
  <label for="name">نام:</label>
  <input type="text" id="name" name="name"><br>
  <label for="email">پست الکترونیک:</label>
  <input type="email" id="email" name="email"><br>
  <input type="submit" value="Submit">
</form>

هنگامی که کاربر این فرم را ارسال می کند، داده ها به اسکریپت example.php در متن درخواست HTTP ارسال می شود و نه در URL.

انتخاب بین GET و POST بستگی به هدف و نوع داده ارسالی دارد. به طور کلی، درخواست های GET برای بازیابی داده ها استفاده می شود، در حالی که درخواست های POST برای ارسال داده ها استفاده می شود. درخواست‌های POST امن‌تر هستند زیرا داده‌ها در URL قابل مشاهده نیستند. با این حال، درخواست‌های GET را می‌توان نشانه‌گذاری کرد و به راحتی به اشتراک گذاشت و آن‌ها را برای درخواست‌های جستجو و اهداف دیگر مفید می‌سازد.

name: این ویژگی به فرم یک نام می دهد که می توان برای ارجاع به آن در جاوا اسکریپت یا CSS استفاده کرد.

مثال: <form name="my-form">

enctype: این ویژگی نوع رمزگذاری مورد استفاده برای ارسال داده های فرم را مشخص می کند. پیش فرض "application/x-www-form-urlencoded" است، اما می توانید از "multipart/form-data" نیز برای آپلود فایل استفاده کنید.

مثال: <form enctype="multipart/form-data">

autocomplete: این ویژگی مشخص می کند که آیا مرورگر باید فیلدهای فرم را به صورت خودکار تکمیل کند. می توانید آن را روی "روشن" یا "خاموش" تنظیم کنید.

مثال: <form autocomplete="off">

target: این ویژگی مشخص می کند که پاسخ فرم باید در کجا نمایش داده شود. می توانید از "_blank" برای باز کردن پاسخ در یک پنجره یا برگه جدید استفاده کنید.

مثال: <form target="_blank">

novalidate: این ویژگی مشخص می کند که داده های فرم نباید توسط مرورگر تأیید شوند. این می تواند برای آزمایش یا زمانی که می خواهید خودتان اعتبارسنجی را مدیریت کنید مفید باشد.

مثال: <form novalidate>