جلسه پانزدهم

فـُرم

سلام

تغییرات:
- در همین جلسه، تغییراتی داده شده. (سه‌شنبه 20 اردیبهشت)
- در جلسه 7، تغییراتی داده شد. (پنجشنبه 25 فروردین)

اینبار به مقوله‌ای می‌پردازیم که هم کاربردی است و هم محلی برای تمرین دروس قبلی.

اگر به خاطر داشته باشید، گفته شد که قسمتی از برنامه نویسی، با داده‌هایی سر و کار دارد که از کاربران، دریافت می‌شود. دریافت اطلاعات، راههای مختلفی دارد که مهمترین و معروفترین آنها، استفاده از فرم است.

روزانه، فرمهای مختلفی را پر می‌کنیم. فرم ثبت نام در یک اداره، فرم باز کردن حساب در بانک، فرم ثبت نام در قرعه‌کشی، و ... . حتما در اینترنت هم با امثال این فرمها، روبرو شده‌اید. مثلا فرم عضویت در یک پایگاه، فرم ثبت یک ایمیل در یاهو، فرم ارسال نامه، یا مثلا فرم نظرخواهی همین وبلاگ. آیا تا به حال، به طرز کار این فرمها فکر کرده‌اید؟ برای شما که یک برنامه‌نویس هستید، توجه به ساختمان و ماهیت فرم - و اشیاء دیگر - لازم است.

«پایگاههای وب، از فرمها برای منظورهای مختلفی استفاده می‌کنند. از قبیل: ثبت نام کردن کاربران، و یا ورود آنها به فضاهای خاص وب (Login)، دریافت نظرات و فرمهای نظرسنجی، و یا خرید و فروش آنلاین.»
 

ساختمان فرم

هر فرمی، عملیات خود را - که دریافت و ارسال داده باشد - در سه بخش، انجام می‌دهد.

  • اسکلت و ظاهر: این بخش - که تشکلیل شده از تعدادی جعبه متن (فیلد) و دکمه - توسط اچ‌تی‌ام‌ال ساخته می‌شود. البته با نرم‌افزارهایی - که قبلا نام بردیم - این کار، سریعتر و دقیقتر انجام می‌شود. این قسمت، مکان نوشتن اطلاعات، توسط کاربر است.
  • خطایاب: این بخش، تخصص جاوا اسکریپت است. یک حد میانی بین اچ‌تی‌ام‌ال و زبان سِروری. در این قسمت، اطلاعات وارد شده توسط کاربر، کنترل می‌شود. مثلا تمامی فیلدهایی که باید نوشته شود، پر شده یا نه؟ و  آیا ترکیب ایمیلی که وارد شده، درست است؟ در صورت وجود خطا، با اخطار به کاربر، مانع از ارسال مطالب به صورت ناقص یا نادرست می‌شود.
  • ارسال و ذخیره اطلاعات: این قسمت، به عهده یک زبان سروری مانند asp و php است، و از حیطه مسؤولیت جاوا، خارج است.

با توجه به این تقسیم بندی، وظیفه جاوا، مشخص شده و دقیقا می‌دانیم که از او چه می‌خواهیم.

داخل پرانتز:
با توجه به مطالبی که گفته شد، بدیهی است که از بعضی از فرم‌ها نمی‌شود در وبلاگ استفاده کرد؛ یا حتی در سایتهایی که فضایشان را به صورت رایگان، تهیه کرده‌اند؛ چون اینگونه فضاها، اجازه نوشتن و اجرای زبان سروری را نمی‌دهند.
 

اجزای فرم

فرمها، بسته به نیاز ما، می‌توانند ساده یا پیچیده باشند. کمترین حد فرم، یک جعبه متن و یک دکمه ارسال (Submit) است؛ همانند فرم ثبت نامی که در همین وبلاگ، قرار داده‌ام.

نام:

 

دکمه Reset که یک دکمه اختیاری است، برای پاک کردن فرم است. این ساده‌ترین شکل فرم است.
 

اسکلت فرم (کد HTML)

<form method="post" action="test.htm" name="Form1"  onSubmit="return funForm()"><!--  شروع فرم -->
نام:
<input type="text" value="" name="Name"><!--  جعبه متن -->
<input type="submit" value="Submit" name="B1"><!--  دکمه ارسال -->
<input type="reset" value="Reset" name="B2"><!--  دکمه پاک کردن -->
</form><!--  پایان فرم -->

method = نوع ارسال اطلاعات را معین می‌کند، که دو نوع است: post, get. این دو روش با تفاوتهایی، عملیات ارسال را انجام ‌می‌دهند. روش پُست، عمومی‌تر است و  از لحاظ امنیتی، برتری دارد. اگر متد را ننویسید، از پُست، استفاده می‌شود.
action = محلی را نشان می‌دهد که اطلاعات، برای پردازش، به آنجا ارسال خواهد شد؛ یعنی آدرس یک صفحه است، که در اینجا برای مثال، test.htm را انتخاب کرده‌ام.
name = نام فرم.
onSubmit = یک رویداد است. تابعی را که در جاوا اسکریپت، نوشته‌اید را صدا می‌کند.

فراموش نکنید که برای هر جزء، نامی بگذارید. تا اینجای کار، اسکلت و ظاهر فرم، ساخته شده است.
 

خطایابی (کد جاوا)

 • از این به بعد، به بخش خطایابی می‌پردازیم. اول باید در نظر بگیریم که خطا از نظر ما چیست.
- مثلا در یک فرم ارسال ایمیل، نباید آدرس ایمیل غلط باشد.
- یا مثلا متنی که نوشته می‌شود، نباید بیشتر یا کمتر از فلان حد باشد.
- یا موردی که باید نوشته و مشخص شود، خالی مانده.

 پس باید طوری برنامه نویسی کنیم که مانع انجام این اشتباههات بشویم.

 • در فرم ساده ما، خطا، زمانی است که اسمی نوشته نشود، و فرم خالی ارسال شود. پس باید با کمک جاوا بنویسیم که اگر فیلد نام، خالی بود، مانع ارسال فرم شده و پیام بدهد.

<script>
function funForm()
{
        if (Form1.Name.value == '')
        {
            alert ('نام خود را بنویسید!');
            Form1.Name.focus();
            return false;
        }
}
</script>
 

ارسال و ذخیره اطلاعات

 بعد از دریافت صحیح اطلاعات، باید آن را به جایی که قرار است ذخیره شود، بفرستیم. در اینترنت، به چند صورت می‌شود اطلاعات را ذخیره نمود.

  • ذخیره در کوکی: اطلاعات کوتاه و ضروری را در آن ذخیره می‌کنند. به امید خدا در جلسات آتی، به آن خواهیم پرداخت.
  • ذخیره در پرونده‌های معمولی: مثلا در پرونده متنی (Text). نسبت به کوکی، قادر به ذخیره اطلاعات بیشتری است؛ اما به لحاظ اینکه برای ساخت، تغییر و حذف یک پرونده یا پوشه، احتیاج به مجوز از طرف سیستم شماست، و این کار، به خاطر جلوگیری از نفوذ ویروس و خرابکاران (هکر)، به سختی انجام می‌پذیرد، مقرون به صرفه نیست.
  • ذخیره در بانک اطلاعاتی: بهترین روش ذخیره اطلاعات است؛ هم از لحاظ ذخیره حجم بالای اطلاعات، هم ترتیب و نظم، هم خواندن راحت و سریع آنها. اساس کار بانک اطاعات، استفاده از جدول است؛ جدولی که تشکیل شده از ستون و سطرهای مختلف؛ مانند جداولی که در بسیاری از جاها، دیده‌اید.

استفاده از بانک اطلاعاتی، مناسبترین روش است که معمولا اطلاعات فرمها، به آن ارسال می‌شود؛ اما

  • بانکها، زبان ما - جاوا اسکریپت - را نمی‌فهمند، و زبان خاص خودشان را دارند؛ یعنی زبانهای سروری که قبلا گفته شد.
  • وبلاگها و پایگهایی که رایگان تهیه شده‌اند، اجازه اجرا این گونه زبانها را نمی‌دهند.

 • به امید خدا بعد از پایان درس جاوا اسکریپت، اگر دوستان علاقمندی باشند، به بحث درباره یکی از زبانهای سروری (asp, php) خواهیم پراخت؛ حداقل تا جایی که بتوانید خودتان یک بانک را ساخته و اطلاعاتان را در آن ذخیره کنید.

 • ظاهرا بحث فرم - تا آنجا که به جاوا مربوط می‌شده - در اینجا به پایان رسیده است. این جلسه، هدیه‌ای به دوستان عزیزی که تقاضای درس عملی و کاربردی را داشته‌اند. در پایان، شما را با عناصر دیگری که ممکن است در فرم، استفاده شوند، آشنا می‌کنم.
 

واژه‌نامه

Get - Post = تفاوت بین این دو، در چگونگی ارسال اطلاعات از فرم، به اسکریپت پردازشگر است.

  • اگر از روش گت، استفاده کنید، مقدار اطلاعاتی که می‌توانید ارسال کنید، محدود است.
  • با استفاده از روش get، اطلاعات به دست آمده از فرم، به عنوان بخشی از یک URL، انتقال می‌یابد؛ اما در روش post، اطلاعات، در حقیقت به صورت نامرئی، منتقل می‌شود. اگر برای مثال، در روش گت، کاربر، یک رمز عبور را در فیلد پسورد، بنویسد، و فرد دیگری نیز در حال مشاهده صفحه نمایش کاربر باشد، به راحتی می‌تواند از رمز عبور کاربر، آگاه شود. به عبارت دیگر، این روش، در سطح امنیتی پایین‌تری از روش پست می‌باشد.
  • صفحه‌ای که حاوی فرمی با مشخصه گت است، می‌تواند نشانه گذاری (Bookmark) شود؛ در حالی که در روش پست، این کار، ممکن نیست.


عناصر فرم

 • همیشه پاسخها، به صورت تشریحی نیست. گاهی اوقات، تستی بوده و جوابهای از پیش تعریف شده دارد. مثل سوال از جنسیت کاربر، یا شهر محل سکونت. در این موارد، باید از عناصر دیگه فرم استفاده نمود؛ مانند چک باکس، یا دکمه رادیویی.

گروه

دکمه

 کد این دو دکمه، با هم تفاوت دارد

دکمه ارسال

دکمه پاک کردن


 Checkbox - چک باکس


 دکمه رادیویی

    ComboBox-JumpMenu - فهرست آبشاری


 ListBox - لیست باکس

 ListBox-Multiple - لیست باکس چند انتخابی


Button-Image - دکمه عکسی


 File - دریافت فایل


 Text - متن


 Password - پسورد


Hidden - متن مخفی


 TextArea - متن زیاد


به امید دیدار
خدانگهدار

نظرات 0 + ارسال نظر
برای نمایش آواتار خود در این وبلاگ در سایت Gravatar.com ثبت نام کنید. (راهنما)
ایمیل شما بعد از ثبت نمایش داده نخواهد شد