خصوصیت های فرم(form) در input
در این مقاله، به توضیح خصوصیت های form در عنصر <input> در HTML می پردازیم.
خصوصیت form در input
خصوصیت form، فرمی را که عنصر <input> به آن تعلق دارد را مشخص می کند. مقدار این خصوصیت، باید با مقدار خصوصیتِ id از عنصرِ <form> ای که به آن تعلق دارد، برابر باشد.
مثال شماره 1
یک فیلد input در بیرون از فرم HTML قرار دارد(اما با این وجود، بخشی از form محسوب می شود:
<form action="/action_page.php" id="form1">
<label for="fname">نام:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
</form>
<label for="lname">نام خانوادگی:</label>
<input type="text" id="lname" name="lname" form="form1">
امتحان کنیدخصوصیت formaction
خصوصیت formaction ، وقتی فرم ارسال(submit) شد، آدرس URL فایلی که قرار است مقدار input را پردازش کند، مشخص می کند.
نکته: این خصوصیت، بر روی خصوصیت action از عنصر <form> رونویسی(override) می شود.
خصوصیت formaction با نوع input های زیر کار می کند:
- submit
- image
مثال شماره 2
<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="Submit">
<input type="ارسال" formaction="/action_page2.php" value="ارسال بعنوان ادمین">
</form>
امتحان کنیدخصوصیت formenctype در input
خصوصیت formenctype در input مشخص می کند که چگونه داده های فرم باید به هنگام ارسال(submit) رمزنگاری شوند. این خصوصیت تنها برای فرم هایی استفاده می شود که از متد post استفاده می کنند(method="post").
نکته: این خصوصیت، بر روی خصوصیت enctype از عنصر <form> رونویسی(override) می شود.
خصوصیت formenctype در نوع های input زیر کار می کند:
- submit
- image
مثال شماره 3
یک فرم با دو دکمه ی ارسال(submit). دکمه ی اول داده های فرم را با رمزگذاری پیش فرض ارسال می کند اما دکمه ی دوم، به صورت 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="Submit">
<input type="submit" formenctype="multipart/form-data" value="Submit as Multipart/form-data">
</form>
امتحان کنید
خصوصیت formmethod
خصوصیت formmethod در input، متد HTTP را برای ارسال داده های فرم به URL از action، تعریف می کند.
نکته: این خصوصیت بر روی خصوصیت method از عنصر <form> رونویسی(override) می شود.
خصوصیت formmethod با نوع های input زیر کار می کند:
- submit
- image
داده های فرم می توانند به صورت متغیرهای URL (method="get") ارسال شوند یا می توانند به صورت متد HTTP post انجام شوند(method="post").
نکاتی در مورد متد get:
- این متد، داده های فرم را در URL به صورت جفت های value/name اضافه می کند.
- این متد برای ارسال هایی از فرم که یک کاربر می خواهد نتیجه را نشانه گذاری(bookmark) کند مفید است.
- برای اینکه بخواهیم داده ها را در URL قرار دهیم، محدودیت وجود دارد(مقدار آن بین مرورگرها متفاوت است)؛ اما ما نمی توانیم مطمئن باشیم که تمام داده ها به درستی انتقال می یابند.
- هرگز از متد get برای ارسال اطلاعات حساس استفاده نکنید(مثلا از این متد برای ارسال پسورد یا دیگر داده هایی که در نوار آدرس مرورگر قابل مشاهده هستند استفاده نکنید).
نکاتی در مورد متد post
- این متد، داده های فرم را به صورت تراکنش HTTP post ارسال می کند.
- ارسالی های فرم با متد post نمی توانند نشانه گذاری(bookmark) شوند.
- متد post قوی تر است و از متد get امن تر است و این متد محدودیت اندازه ندارد.
مثال شماره 4
یک فرم به همراه دو دکمه ی ارسال(submit). اولین دکمه، داده های فرم را با متد get ارسال می کند و دومین دکمه، داده های فرم را با متد 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="Submit using GET">
<input type="submit" formmethod="post" value="Submit using POST">
</form>
امتحان کنیدخصوصیت formtarget
خصوصیت formtarget یک نام یا یک کلمه ی کلیدی را مشخص می کند که نشان می دهد که پاسخی که پس از ارسال(submit) داده های فرم دریافت شده است، در کجا نمایش داده شود.
نکته: این خصوصیت بر روی خصوصیت target که در عنصر <form> جای دارد، رونویسی(override) می شود.
خصوصیت formtarget با نوع های input زیر کار می کند:
- submit
- image
مثال شماره 5
یک فرم به همراه دو دکمه ی ارسال(submit) با پنجره های target متفاوت:
<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
خصوصیت formnovalidate مشخص می کند که یک عنصر <input> نباید وقتی که خواست ارسال شود، اعتبار سنجی شود.
نکته: این خصوصیت بر روی خصوصیت novalidate از عنصر <form> رونویسی(override) می شود.
خصوصیت formnovalidate در نوع های input زیر کار می کند:
- submit
مثال شماره 6
<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> می باشد. وقتی که این خصوصیت در تگ <form> حاضر باشد، مشخص می کند که تمام داده های فرم، نباید وقتی که ارسال(submit) می شوند، اعتبارسنجی شوند.
مثال شماره 2
خصوصیت novalidate مشخص می کند که داده های فرم نباید به هنگام ارسال(submit)، اعتبارسنجی شوند:
<form action="/action_page.php" novalidate>
<label for="email">ایمیل خود را وارد کنید:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="ارسال">
</form>
امتحان کنید