كار با فرم ها - بخش اول

فرم چيست؟

فرمها تنها عنصري هستند که بيننده سايت ميتواند اطلاعاتي را بطور مستقيم وارد کرده که اين اطلاعات بعد از تجزيه و تحليل يا در فايلي ذخيره شده يا فرستاده ميشود. شما ميتوانيد داخل يک   صفحه يا يک وب سايت چندين فرم داشته باشيد بطور مثال براي چند نوع نظرسنجي از بينندگان که هر کدام از اين فرمها را با استفاده از خصوصيت   name=” “ در تگ <form>  بايد نامگذاري کنيد تا اطلاعات مربوط به هر فرم با نام همان فرم پردازش شود. فرمها داراي اجزاي متفاوتي با وظيفه مشخص ميباشند که بايد قبل از تگ پايان دهنده </form>  آنها را بکار برد.   بعضي از اين اجزا عبارتند از: کادرهاي متني text fields ، قسمت انتخابات چند گزينه اي checkboxes وتک گزينه اي   radio buttons ، ليستهاي پايين کشيدني drop-down lists و دکمه هاي تأييد submit وپاک کننده reset .

فرمها توسط برنامه هايي نظير ASP, CGI و با افزودن خصوصيات action=” “, method=” “, enctype=” “ در تگ <form> اطلاعات وارده را پردازش کرده و به وب سرور ميفهماند که به چه روش و در کجا اطلاعات ذخيره يا فرستاده شود. وب سرور به کامپيوتري که محتواي سايت شما بر روي آن قرار دارد گفته ميشود.

دکمه (button)

کليه اجزاي ساخته شده در يک فرم بدون بودن دکمه تأييد بي فايده هستند، چون بعد از فشردن اين دکمه است که اطلاعات وارده در فرم پردازش ميشوند. پس ابتدا به ساختن اين دکمه ميپردازيم. براي ساختن دکمه ها در يک فرم به دو روش ميتوانيم عمل کنيم:

روش اول: با استفاده از تگ <button></button> که داراي دو خصوصيت name=” “ براي نامگذاري و type=” “ براي مشخص کردن نوع دکمه که submit و يا reset  ميباشد . در بين تگ آغازکننده و پايان دهنده هر چي نوشته شود در ظاهر دکمه نمايان ميشود

<button name="button 01" type="submit"> OK </button>

   OK   

روش دوم: با استفاده از تگ <input> که مانند روش اول دو خصوصيت    name=” “ که بايد کلمه button  در جلوي آن بيايد و type=” “ که ميتواند هم submit باشد و يا reset .

<input name="button" type="submit">

فرقي که اين دو روش با هم دارند در اينست که شما در روش اول هر نوشته اي را بخواهيد در روي دکمه هنگام نمايش صفحه در مرورگر نشان داده ميشود اما در روش دوم شما دخالتي در اين کار نداريد و به صورت پيش فرض کلمه submit , reset  نمايان ميشود. البته ميتوانيد بجاي دکمه هاي ساخته شده توسط مرورگراز عکس هم استفاده کنيد يعني شکل يک دکمه را طراحي کنيد و در فرم قرار دهيد که خصوصيت type=” “  را برابر با کلمه image قرار ميدهيد و با خصوصيت src=” “  آن را آدرس دهي ميکنيد:

<input name="button" type="image" src="images/button01.gif" >

لازم بذکر است که در اين تکنيک فقط از حالت submit دکمه بايد استفاده کرد.

text field, text area

 خب بعد از ساختن دکمه ها ميپردازيم به بقيه اجزاي يک فرم. از اين به بعد ما با تگ

 وخصوصياتش زياد کار داريم . ما براي وارد کردن متن در فرم بسته به نيازمان از دو مدل کادرمتني ميتوانيم استفاده کنيم، يکي براي وارد کردن يک خط متن کوتاه که چند کلمه بيشتر نباشد و کادر ما هم به صورت خطي ميباشد و ديگري براي يک متن بلند است و کادر ما داراي چندين رديف ميباشد.

در مدل اول ازاين تگ استفاده ميکنيم:

<input name="textfield 01" type="text”>

دقت کنيد که کلمه text بايد در جلوي خصوصيت type=” “ بيايد تا مرورگر بفهمد چه اجزائي از يک فرم را نمايش ميدهد. توسط خصوصيت size=” “  که با عدد مقدار دهي ميکنيد اندازه نمايش اين کادر خطي در مرورگر را کنترل ميکنيد و توسطmaxlength=” “  حداکثر تعداد حروفي را که بيننده مجاز هست تا وارد کند را کنترل ميکنيد.

Textfield :

 اگر قرار باشد که بيننده داخل اين کادر خطي ،  کلمه رمز را وارد کند پس بجاي خصوصيت   type=”text”  بايد از type=”password” استفاده کنيد تا هر متني که وارد شود بصورت ستاره در مرورگر نمايش داده شود.

Password :

 اما مدل ديگري هست که متنهاي بلند داخل آن نوشته خواهد شد که بايد از تگ<textarea></textarea>استفاده کنيد که جدا از خصوصيت name=” “از خصوصيات cols=” “ , rows=” “براي کنترل رديفها و ستونهاي کادر بکار ميبريد.

this is a textarea example.