این آموزش در تاریخ ۱۴۰۲/۰۶/۲۰ آپدیت شده است.
آموزش صفت Form در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش صفت Form در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
صفت Form در HTML
صفت form صفتی است که میتونه مشخص کنه داده های یک Input در هنگام ارسال بسمت سرور ،متعلق به کدام فرم می باشد.
قبل از اینکه این صفت به وجود بیاد، خب باید حتما از یک Input در درون تگ Form استفاده میکردیم تا میتونستیم داده های Input رو به سمت سرور ارسال کنیم.
حال با وجود این صفت دیگه نیاز نیست که حتما یک Input درون تگ Form باشه، بلکه میتونه خارج از تگ Form باشه و همچنان داده هاش بسمت سرور ارسال بشه.
باید ۲ کارو انجام بدیم :
- تعریف یک آی دی توسط صفت Id درون تگ Form
- قرار دادن نام همون id درون صفت Form موجود در تگ Input مورد نظرمون
Free-Learn
عناصری که توسط این صفت پشتیبانی می شوند
این صفت را میتوان در عناصر/تگ های زیر بکار برد.
| <input> | <fieldset> | <button> |
| <object> | <meter> | <label> |
| <textarea> | <select> | <output> |
Free-Learn
مثال از صفت Form در HTML
در ادامه میتوانید یک مثال از این صفت را مشاهده نمایید.
مثال شماره ۱ :استفاده در تگ Button
|
1 2 3 4 5 |
<body> <button type="submit" form="MyForm">ارسال</button> </body> |
مثال شماره ۲ :استفاده در تگ Fieldset
|
1 2 3 4 5 6 7 8 9 |
<body> <fieldset form="MyForm"> <legend>اطلاعات شخصی</legend> نام : <input type="text" name="Name"><br> فامیلی : <input type="text" name="Family"><br> </fieldset> </body> |
مثال شماره ۳ :استفاده در تگ Input
|
1 2 3 4 5 |
<body> <input type="text" name="myname" form="MyForm"> </body> |
مثال شماره ۴ :استفاده در تگ Label
|
1 2 3 4 5 |
<body> <label for="male" form="MyForm">مرد</label> </body> |
مثال شماره ۵ :استفاده در تگ Meter
|
1 2 3 4 5 |
<body> <meter form="MyForm" min="0" max="100" value="70"></meter> </body> |
مثال شماره ۶ :استفاده در تگ Object
|
1 2 3 4 5 |
<body> <object data="files/mytext.txt" form="MyForm"></object> </body> |
مثال شماره ۷ :استفاده در تگ Output
|
1 2 3 4 5 |
<body> <output name="OutPut" for="number1 number2" form="MyForm"></output> </body> |
مثال شماره ۸ :استفاده در تگ Select
|
1 2 3 4 5 6 7 8 9 |
<body> ماشین شما : <select name="MyCar" form="MyFosrm"> <option value="Peugeot">پژو</option> <option value="Pride">پراید</option> </select> </body> |
مثال شماره ۹ :استفاده در تگ Textarea
|
1 2 3 4 5 6 7 |
<body> <textarea form="MyForm"> Salam Khobi? </textarea> </body> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از صفت form در HTML پشتیبانی میکنند یا خیر.
| نام تگ | Chrome | Firefox | Opera | Safari | Edge |
| button | بله | بله | بله | بله | بله |
| fieldset | بله | بله | بله | بله | بله |
| input | بله | بله | بله | بله | بله |
| label | بله | بله | بله | بله | بله |
| meter | نامشخص | نامشخص | نامشخص | نامشخص | نامشخص |
| object | نامشخص | نامشخص | نامشخص | نامشخص | نامشخص |
| output | نامشخص | نامشخص | نامشخص | نامشخص | نامشخص |
| select | بله | بله | بله | بله | بله |
| textarea | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این صفت در HTML بصورت زیر می باشد.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<form action="#" method="POST" id="MyForm"> .... </form> <button form="MyForm"> <fieldset form="MyForm"> <input form="MyForm"> <label for="Input_ID" form="MyForm"> <meter form="MyForm"> <object form="MyForm"> <select form="MyForm"> <textarea form="MyForm"> |
Free-Learn
جدول مقادیر صفت Form در HTML
در جدول زیر میتوانید، مقادیری را که میتوان در این صفت استفاده کرد مشاهده نمایید.
| مقدار | توضیح |
|---|---|
| Form_ID | برای مشخص کردن شناسه یا ID فرم |
