آموزش تگ form در html

تقریبا در هر سایت یا وبلاگی و به طور کل در هر صفحه وبی عناصری تعاملی وجود دارد که کاربر می تواند نسبت به آنها عکس العمل داشته باشد، به طور مثال بر روی دکمه ای کلیک کند یا از بین گزینه های مربوط به نظرسنجی یک مورد را انتخاب نماید، شکل برجسته این عناصر تعاملی فیلد ها و فرم هایی هستند که کاربران با تکمیل اطلاعات آنها و با کلیک بر روی دکمه ارسال، مقادیری را به سرور و پایگاه داده سایت یا وبلاگ مورد نظر ارسال می کنند، از آنجایی که این نوع امکانات در صفحات وب، وابسته به تگ form و عناصر زیرمجموعه آن است، لذا فراگیری دقیق این مبحث می تواند در آینده نزدیک دید شما را نسبت به تکنولوژی وب عمیق تر و چه بسا یک قدم به سمت برنامه نویسی حرفه ای نزدیک تر کند.
تگ form در html

همان طور که پیش تر گفتیم، تگ فرم با هدف ایجاد قابلیت های تعاملی (دکمه، فیلدهای متنی، امکان آپلود فایل و…) برای صفحات html تعریف شده است، در واقع کنسرسیوم جهانی وب یا w3c این نکته را مد نظر داشته که صفحات وب باید از قابلیت ارتباط دو سویه برخوردار باشند، یعنی همان طور که به فرض مدیران یک سایت می توانند مطالبی در آن منتشر کنند، کاربران نیز باید بتوانند در محتوای آن مشارکت داشته یا از قابلیت های آن به صورت سفارشی استفاده نمایند، به این ترتیب و به تدریج عناصر و ویژگی های تعاملی که شباهت های زیادی با هم داشتند در قالب یک تگ با عنوان فرم (form) و زیرمجموعه های آن معرفی شد.

یک فرم ساده به صورت زیر در html تعریف می شود.

<form> </form>

تگ form به تنهایی کاربردی ندارد و تنها معرف ایجاد یک امکان تعاملی ار نوع فرم است، لذا این تگ را با موارد زیر تکمیل می کنیم.
خاصیت action در form

از آنجایی که اطلاعات یک فرم html پس از تکمیل شدن باید به یک فایل در سرور ارسال شود، خاصیت action برای تعیین آدرس فایل مقصد مورد استفاده قرار می گیرد، به طور مثال اطلاعات فرم زیر (در صورت ارسال) به یک فایل با نام get.php فرستاده خواهد شد.

<form action=”user/comment/get.php”> </form>

مقادیر خاصیت action می تواند به صورت آدرس کامل (با //:http) یا به صورت آدرس دایرکتوری (مانند مثال بالا) در نظر گرفته شود.
خاصیت method در form

در کنار action که مقصد اطلاعات یک فرم را معیین می کند، خاصیت method شیوه ارسال را مشخص می کند، این شیوه می تواند به یکی از دو شکل post یا get (حالت پیش فرض) باشد، در متد post، اطلاعات دور از چشم ما و به صورت پنهانی، در پس زمینه به سرور ارسال می شوند اما در متد get، اطلاعات در نوار آدرس مرورگر قابل مشاهده هستند و به صورت پارامترهایی به همراه مقادیر به سرور ارسال می شوند، متد post برای ارسال مقادیر طولانی، اطلاعات حساس کاربری، آپلود فایل و… کاربرد دارد و متد get بیشتر برای ارسال اطلاعات کوتاه و با حساسیت کمتر به کار می رود.

<form action=”user/comment/get.php” method=”get”> </form>

نکته:

متد get و post هر دو از شیوه های استاندارد HTTP برای نقل و انتقال اطلاعات هستند و در برخی زبان های برنامه نویسی مانند Ajax یا فریم ورک های مربوط به آن (مانند jQuery) ممکن است کارکردی مشابه داشته باشند، لذا تفاوت های عنوان شده در آموزش، حالت معمول و کدنویسی html را مد نظر دارد.

در مقاله بعدی تگ های زیرمجموعه form را آموزش می دهیم.

آموزش کامل HTML

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