شما اینجا هستید

فرمهای HTML برای جمع آوری اطلاعات کاربران استفاده میشود.

برای تعریف فرم از عنصر <form> بهره میگیریم.

<form>
.
form elements
.
</form>

فرمهای HTML شامل عناصر فرم است.

عناصر فرم انواع گوناگونی از عناصر ورود اطلاعات مانند چک باکسها، دکمه های رادیویی، دکمه ارسال و غیره هستند.

عنصر <input>

عنصر <input> مهمترین عنصر فرم است. این عنصر دارای انواع مختلفی از ابزارهای ورود اطلاعات هست که به وسیله ویژگی type مشخص میشوند.

انواعی که در این درس فرا خواهیم گرفت:

  • text : ورود اطلاعات متنی را تعریف میکند

  • radio : دکمه رادیویی برای انتخاب فقط یک گزینه از گزینه های موجود را تعریف میکند

  • submit : یک دکمه ارسال برای ارسال فرم ایجاد میکند

ورود متن

<”input type=”text> یک فیلد متنی تک خطی برای وارد کردن متن در آن تعریف میکند.

<html>

<body>

<form>

First name:<br>

<input type="text" name="firstname">

<br>

Last name:<br>

<input type="text" name="lastname">

</form>



<p>Note that the form itself is not visible.</p>



<p>Also note that the default width of a text field is 20 characters.</p>



</body>

</html>

 

ویژگی name یک نام برای فیلد تعریف میکند.

پهنای پیشفرض فیلد متنی 20 کاراکتر هست.

دکمه رادیویی

<”input type=”radio> دکمه رادیویی تعریف میکند.

دکمه رادیویی به کاربر این اجازه را میدهد که یک گزینه را از میان گزینه های موجود انتخاب کند.

<html>

<body>



<form>

<input type="radio" name="gender" value="male" checked>Male

<br>

<input type="radio" name="gender" value="female">Female

</form>



</body>

</html>

 

ویژگی value، مقداری که قرار است به سرور ارسال شود را مشخص میکند و checked گزینه انتخاب شده پیشفرض را مشخص میکند.

دکمه ارسال

<input type=”submit”> یک دکمه برای ارسال فرم به رسیدگی کننده فرم تعریف میکند. رسیدگی کننده فرم معمولا یک صفحه وب سمت سرور برای پردازش داده های وروردی است. رسیدگی کننده فرم در ویژگی action فرم مشخص میگردد.

<html>

<body>

<form action="action_page.php">

First name:<br>

<input type="text" name="firstname" value="Mickey">

<br>

Last name:<br>

<input type="text" name="lastname" value="Mouse">

<br><br>

<input type="submit" value="Submit">

</form>

<p>If you click "Submit", the form-data will be sent to a page called "action_page.php".</p>


</body>

</html>

 

ویژگی action

ویژگی action،واکنشی را برای هنگامی که فرم ارسال میشود تعریف میکند.ارسال فرم به وسیله دکمه ارسال، روشی است که معمولا برای ارسال فرم به سرور استفاده میکنند. معمولا، فرمها به یک صفحه وب بر روی سرویس دهنده وب ارسال میشوند. در مثال بالا، یک برنامه سمت سرور برای پردازش فرم ارسالی مشخص شده بود.

<form action="action_page.php">

اگر ویژگی action نوشته نشود، به صورت پیشفرض برای صفحه فعلی تنظیم میشود.

ویژگی method

ویژگی method، نحوه ارسال فرم با متد HTTP که GET یا POST باشد را مشخص میکند.

نمونه ای از ارسال فرم با متد GET

<form action="action_page.php" method="GET">

نمونه ای از ارسال فرم با متد POST

<form action="action_page.php" method="POST">

چه وقتی از GET استفاده کنیم؟

اگر اطلاعات حساسی در فرم ارسالی وجود ندارد مانند جستجو در سایت از متد GET استفاده کنید. هنگامی که از GET استفاده میکنید اطلاعات فرم در آدرس صفحه قابل مشاهده میشود.

متد GET برای ارسال اطلاعات کم مناسب است. چون در مرورگرها مقدار کاراکتری که در نوار آدرس میتواند وارد شود محدود است.

چه وقتی از POST استفاده کنیم؟

از POST باید در هنگامی که فرم دارای اطلاعات حساس مانند گذرواژه هست استفاده کنیم. متد POST امنیت بیشتری در ارسال اطلاعات دارد چون اطلاعات فرم در آدرس صفحه قابل مشاهده نیست.

ویژگی name

برای اینکه فرم به درستی ارسال شود، هر فیلد باید یک ویژگی name داشته باشد.

مثال زیر فقط فیلد lastname را ارسال میکند:

<html>

<body>

<form action="action_page.php">

First name:<br>

<input type="text" value="Mickey">

<br>

Last name:<br>

<input type="text" name="lastname" value="Mouse">

<br><br>

<input type="submit" value="Submit">

</form>

<p>If you click "Submit", the form-data will be sent to a page called "action_page.php".</p>

<p>The first name will not be submitted, because the input element does not have a name attribute.</p>

</body>

</html>

 

گروه بندی فیلدها با <fieldset>

با عنصر <fieldset> فیلدهای مرتبط را با هم در یک گروه قرار میدهیم.

عنصر ‌‌‌‌‌‌<legend> یک عنوان برای عنصر <fieldset> تعریف میکند.

<html>

<body>


<form action="action_page.php">

<fieldset>

<legend>Personal information:</legend>

First name:<br>

<input type="text" name="firstname" value="Mickey">

<br>

Last name:<br>

<input type="text" name="lastname" value="Mouse">

<br><br>

<input type="submit" value="Submit">

</fieldset>

</form>

</body>

</html>

 

دیدگاه‌ها

افزودن دیدگاه جدید

دیدگاه

  • تگ‌های HTML مجاز: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd> <img>
  • خطوط و پاراگراف‌ها بطور خودکار اعمال می‌شوند.
  • نشانی صفحه‌ها وب و پست الکترونیک بصورت خودکار به پیوند تبدیل می‌شوند.

Plain text

  • تگ‌های HTML مجاز نیستند.
  • نشانی صفحه‌ها وب و پست الکترونیک بصورت خودکار به پیوند تبدیل می‌شوند.
  • خطوط و پاراگراف‌ها بطور خودکار اعمال می‌شوند.
كد امنيتي
این پرسش برای جلوگیری از ارسال اسپمهای اتوماتیک است.