فرم در HTML – المان <form>

در HTML و صفحات وب از فرم ها برای ورود داده توسط کاربر و ارسال اطلاعات استفاده می‌شود. فرم های وب معمولا شامل مجموعه‌ای از المان ها نظیر لیبل ها، جعبه های متنی، دکمه های رادیویی، جعبه های بررسی، دکمه ارسال و … است. شما می‌توانید از المان <form> برای ایجاد فرم های اچ‌تی‌ام‌ال استفاده کنید.

المان <form> در HTML المانی است که اجزای مختلف یک فرم نظیر لیبل ها، جعبه های متنی، دکمه ارسال فرم و … را دربرمی‌گیرد. معمولا داده های فرم به منظور پردازش، ذخیره سازی و … برای سرور وب ارسال می‌شود.

مثالی ساده از یک فرم وب

به عنوان یک مثال ساده، کد زیر مربوط به فرمی شامل دو المان <input> با نوع text (جعبه متنی) همراه با دو لیبل متناظر با آن‌ها (برای درج عنوان جعبه‌ها) و یک المان <input> با نوع submit (دکمه ارسال) می‌باشد:

<form action="/action.php" method="post">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br>
  <label for="lname">Last name:</label>
  <input type="text" id="lname" name="lname"><br>
  <input type="submit" value="Submit">
</form>

معمولا این کد مشابه با تصویر زیر توسط مرورگر وب رندر می‌شود:

با جزئیات المان های داخل فرم در بخش‌های آتی این مجموعه آموزشی به صورت مجزا آشنا می‌شوید.

خصوصیت های متداول برای المان <form>

برای المان <form> می‌توانید از خصوصیت های مختلفی شامل موارد زیر استفاده کنید:

• خصوصیت accept-charset: این خصوصیت، فهرستی از کاراکتر انکدینگ های قابل قبول برای ارسال فرم را مشخص می‌کند.
• خصوصیت action: مقدار این خصوصیت، نشانی یا URL ای را مشخص می‌کند که داده های فرم برای آن ارسال می‌شود. معمولا این نشانی وظیفه پردازش و ذخیره سازی داده های فرم روی سرور را برعهده دارد.
• خصوصیت autocomplete: این خصوصیت با مقدار on یا off مشخص می‌کند آیا به صورت پیشفرض مقدار المان های فرم می‌توانند توسط مرورگر وب به شکل خودکار تکمیل شوند یا خیر؟
• خصوصیت enctype: این خصوصیت در صورتی که خصوصیت method برابر با post باشد نحوه یا نوع کدگذاری داده های فرم برای ارسال را مشخص می‌کند. خصوصیت enctype می‌تواند یکی از مقادیر application/x-www-form-urlencoded (مقدار پیشفرض), multipart/form-data (ضروری برای آپلود فایل از طریق فرم) یا text/plain (برای ارسال به صورت متن ساده بدون انکدینگ) را داشته باشد.
• خصوصیت method: این خصوصیت، متد HTTP برای ارسال داده های فرم را مشخص می‌کند. مقدار خصوصیت method می‌تواند به صورت post, get یا dialog مشخص شود.
• خصوصیت name: این خصوصیت، نام فرم را مشخص می‌کند.
• خصوصیت novalidate: این خصوصیت مشخص می‌کند نباید فرم هنگام ارسال اعتبارسنجی شود. خصوصیت novalidate یک خصوصیت بولی در HTML است و می‌تواند بدون مقدار یا با مقدار novalidate در تگ شروع المان <form> درج شود.
• خصوصیت rel: این خصوصیت، ارتباط بین سند جاری و منبع لینک شده را مشخص می‌کند و می‌تواند دارای مقادیر external, help, license, next, nofollow, noopener, noreferrer, opener, prev و search باشد.
• خصوصیت target: این خصوصیت مشخص می‌کند پس از ارسال فرم، پاسخ دریافتی کجا نمایش داده شود. خصوصیت target می‌تواند یکی از مقادیر _blank, _self, _parent یا _top را داشته باشد.

با جزئیات این خصوصیت ها و مقادیر آن‌ها در بخش‌های آتی این مجموعه آموزشی به صورت مجزا آشنا می‌شوید.

بازگشت به فهرست مجموعه آموزشی HTML