تگ form در html

h2

تگ فرم در html

طراحی سایت بدون فرم یک ارتباط یک طرفه با کاربر است که فقط  کاربر از اطلاعات استفاده  میکند.

فرمها ی html برای جمع آوری اطلاعات از کاربران استفاده میشوند. در واقع یک جور تعامل و بده بستان اطلاعات با کاربران ایجاد میشود.  اطلاعات از طریق کاربران در فرم، با زدن دکمه ارسال بسته بندی میشوندو به سمت سرور ارسال میشود.داده ها توسط سرور دریافت و به یک وب اپلیکیشن مناسب تحویل داده میشود. که شاید این وب اپلیکیشن با php نوشته شده باشد. تا اون وب اپلیکیشن اطلاعات را پردازش و نتیجه را به ما تحویل دهد.

در این آموزش ما فقط به ایجاد ظاهر فرم میپردازیم .

از تگ  باز و بسته <form> برای ایجاد فرم استفاده میشود.

مرورگر فرم را به دید یک کنترل که قراره است  اطلاعاتی از کاربر بگیرد نگاه میکند. کنترلهای مختلفی وجود دارد که در ادامه به توضیح آنها میپردازیم:

<form action="Script URL" method="GET|POST">
    form elements like input, textarea etc.
</form>

ویژگی action

از ویژگیهای ضروری فرم action میباشد که  مشخص کننده آدرس صفحه ای است که اطلاعات فرم باید به آن ارسال شود. آدرس صفحه مورد نظر باید به عنوان مقدار این ویژگی قرار گیرد.

 

ویژگی method

دومین ویژگی مهم method میباشد که نحوه ارسال اطلاعات به سرور یا همان صفحه ای که توسط action مشخص میشود،  را مشخص میکند وسه مقدار میگیرد که postو get که رایجتر هستند.

get

اطلاعات به آدرس مورد نظر  به صورت عمومی و در url ارسال  میشود.

 

نکات

  • این روش ناامن است. چون نام و مقدار کنترل به این صورت name=value&name=value در آدرس صفحه به صورت عمومی نمایان هستند.
  • ولی برای جابه جایی اطلاعات ساده مانند عددی و رشته ای موردی ندارد.
  • url محدودیت تعداد کاراکتر دارد ونمیتواند داده هایی با حجم بالا ارسال کند.
  • داده هایی مثل عکس که باینری هستند حجم بالایی دارند، بنابراین از این طریق ارسال نمیشوند.

post

اطلاعات از طریق هدر http ارسال میشوند.

نکات

  • اطلاعات در آدرس صفحه نمایش داده نمیشوند.
  • محدودیتی در حجم اطلاعات نیست.
  • رو امن  برای ارسال اطلاعاتی که حساس و مهم مثل پسورد ها  هستند.

 

name

ویژگی name  یک نام برای فرم مشخص میکند.

تگ کنترل <input>

برای گرفتن ورودی از کاربر، به کنترلی که بشود با کاربر تعامل داشت نیاز است، مانند فیلدهای متنی، چک باکس، دکمه ارسال و… . برای این کار از ویژگیهای تگ input استفاده میشود. این تگ در فرم نوشته میشود.

 

مقدار ویژگی
  نوع ورودی را مشخص میکند. type
. یک نام انتخاب میشود. این نام زمانی که داده به سمت سرور  ارسال میشود کاربرد دارد name
.حداکثر تعداد کاراکتری که کاربر میتواند وارد کند maxlength
متنی که کاربر میبیند value
TextBox : برای گرفتن متن از کاربر
 <input type=”text” name=”username” /><br />
<input type=”password” name=”password” />
Radio: انتخاب یک مورد از چند مورد
Male
Female
 <input type=”radio” name=”gender” value=”male” /> Male <br />
<input type=”radio” name=”gender” value=”female” /> Female <br />
CheckBox: انتخاب یک یا چند مورد از چند مورد

 c++

 c#

 <input type=”checkbox” name=”gender” value=”1″ /> Male <br />
<input type=”checkbox” name=”gender” value=”2″ /> Female <br />
Submits: دکمه ارسال اطلاعات
 <input type=”submit” value=”Submit” />
مثال ساده از فرم

Male

Female

C++
C#
python
php

درباره نویسنده

مهارت ها: html,css C#, sql,python

نوشته های مرتبط

نظری بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *