ویژگی‌های form* ورودی HTML

کتابخانه پیشنهادی: <input> این فصل HTML را معرفی می‌کند تفاوت‌های عنصر ویژگی‌ها.

property form

ویژگی input property این property <input> فرم مربوط به عنصر

مقدار این property باید برابر با property id فرم مربوطه باشد.

مثال

فیلدهای ورودی که در خارج از فرم HTML قرار دارند (اما همچنان بخشی از فرم هستند):

<form action="/action_page.php" id="form1">
  <label for="fname">نام خانوادگی:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="ثبت">
</form>
<label for="lname">نام:</label>
<input type="text" id="lname" name="lname" form="form1">

تست کنید

property formaction

ویژگی input formaction URL فایل‌هایی که داده‌ها (داده‌ها) را پردازش می‌کند را هنگام ارسال فرم تعیین می‌کند.

نکته:}این property <form> این property property ویژگی‌ها.

formaction این ویژگی برای نوع‌های ورودی زیر معتبر است: submit و image.

مثال

فرم‌های HTML با دو دکمه ارسال که عملکرد‌های مختلفی دارند:

<form action="/action_page.php">
  <label for="fname">نام خانوادگی:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">نام:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="ثبت">
  <input type="submit" formaction="/action_page2.php" value="با استفاده از مدیر ارسال شود">
</form>

تست کنید

property formenctype

ویژگی input formenctype این property روش کدگذاری داده‌های فرم هنگام ارسال را مشخص می‌کند (تنها برای فرم‌هایی که method="post" دارند مناسب است).

نکته:}این ویژگی جایگزین <form> عنصر property enctype.

formenctype این ویژگی برای نوع‌های ورودی زیر معتبر است: submit و image.

مثال

فرم‌هایی که دو دکمه ارسال دارند. اولی داده‌های فرم را با کدگذاری پیش‌فرض ارسال می‌کند، دومی داده‌های فرم را با کدگذاری "multipart/form-data" ارسال می‌کند:

<form action="/action_page_binary.asp" method="post">
  <label for="fname">نام اول:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="ثبت">
  <input type="submit" formenctype="multipart/form-data"
  value="با استفاده از Multipart/form-data کدگذاری شود">
</form>

تست کنید

property formmethod

ویژگی input formmethod این property روش HTTP را که داده‌های فرم به URL action ارسال می‌شود را تعریف می‌کند.

نکته:}این ویژگی جایگزین <form> عنصر property method.

formmethod این ویژگی برای نوع‌های ورودی زیر معتبر است: submit و image.

داده‌های فرم می‌توانند به عنوان متغیرهای URL (method="get") یا به عنوان تراکنش HTTP post (method="post") ارسال شوند.

موارد توجه در مورد GET:

  • داده‌های فرم به عنوان نام/مقدار به URL اضافه می‌شوند
  • هرگز از GET برای ارسال داده‌های حساس استفاده نکنید! (داده‌های ارسالی فرم در URL قابل مشاهده هستند!)
  • طول URL محدود است (۲۰۴۸ کاراکتر)
  • برای فرم‌هایی که کاربران می‌خواهند نتایج را به عنوان تب بوکمارک اضافه کنند، بسیار مفید است
  • GET برای داده‌های غیرمطمئن استفاده می‌شود، مانند جستجوهای Google

موارد توجه در مورد POST:

  • داده‌های فرم به عنوان متن درخواست HTTP اضافه می‌شوند (داده‌های ارسالی فرم در URL نمایش داده نمی‌شوند)
  • POST بدون محدودیت اندازه است و می‌توان از آن برای ارسال داده‌های زیاد استفاده کرد.
  • فرم‌های ارسالی با استفاده از POST نمی‌توانند به عنوان تب بوکمارک اضافه شوند

توضیح:اگر داده‌های فرم شامل اطلاعات حساس یا شخصی هستند، لطفاً از POST استفاده کنید!

مثال

فرم‌هایی که دو دکمه ارسال دارند. اولی با استفاده از method="get" داده‌های فرم را ارسال می‌کند. دومی با استفاده از method="post" داده‌های فرم را ارسال می‌کند:

<form action="/action_page.php" method="get">
  <label for="fname">نام خانوادگی:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">نام:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="با استفاده از GET ارسال کنید">
  <input type="submit" formmethod="post" value="با استفاده از POST ارسال کنید">
</form>

تست کنید

ویژگی formtarget

ویژگی input ویژگی formtarget ویژگی مشخص می‌کند که نام یا کلیدواژه‌ای که در آنجا پاسخ‌های دریافت شده پس از ارسال فرم نمایش داده می‌شود.

نکته:}این ویژگی جایگزین <form> ویژگی target عنصر.

ویژگی formtarget این ویژگی برای نوع‌های ورودی زیر معتبر است: submit و image.

مثال

فرم‌هایی که دو دکمه ارسال دارند و هدف‌های مختلفی دارند:

<form action="/action_page.php">
  <label for="fname">نام خانوادگی:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">نام:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="ثبت">
  <input type="submit" formtarget="_blank" value="به یک پنجره/برچسب جدید ارسال کنید">
</form>

تست کنید

ویژگی formnovalidate

ویژگی input formnovalidate ویژگی‌ها باید در زمان ارسال، بررسی نشود که آیا عنصر <input> معتبر است یا خیر.

نکته:}این ویژگی جایگزین <form> ویژگی novalidate عنصر.

formnovalidate ویژگی به نوع ورودی زیر اعمال می‌شود: submit.

مثال

فرمی با دو دکمه ارسال (با تأیید و بدون تأیید) دارد:

<form action="/action_page.php">
  <label for="email">ایمیل خود را وارد کنید:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="ثبت">
  <input type="submit" formnovalidate="formnovalidate">
  value="ثبت بدون تأیید">
</form>

تست کنید

ویژگی novalidate

novalidate ویژگی‌است <form> ویژگی‌ها.

اگر تنظیم شده باشد، attribute novalidate مشخص می‌کند که در زمان ارسال همه داده‌های فرم نیازی به تأیید نیست.

مثال

تعیین می‌کند که در زمان ارسال هیچ داده فرم نیازی به تأیید نیست:

<form action="/action_page.php" novalidate>
  <label for="email">ایمیل خود را وارد کنید:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="ثبت">
</form>

تست کنید

عناصر Form و Input HTML

برچسب شرح
<form> برای تعریف ورودی کاربر فرم HTML تعریف کنید.
<input> تعریف کنترل ورودی.

برای دسترسی به لیست کامل تمام برچسب‌های HTML موجود، لطفاً وب‌سایت ما را بازدید کنید دستورالعمل برچسب‌های HTML