** کینگ کد : بزرگترین مرجع دانلود سورس کد های برنامه نویسی اندروید، ویندوز و جدید ترین اسکریپت های روز دنیا **
-----------------------------------------------
** سورس فروشگاه اینترنتی مارکیت فارسی برای اندروید - سورس فروشگاه اینترنتی موکتز فارسی برای اندروید **
-----------------------------------------------
** اسکریپت چیست؟ و چگونه از آن استفاده کنیم؟ (آموزش کامل نصب اسکریپت) **
-----------------------------------------------
** (160 جلسه) آموزش کامل و 0 تا 100 برنامه نویسی PHP **
-----------------------------------------------
** دانلود فیلم آموزشی فتوشاپ فارسی **
-----------------------------------------------
» بروزترین سایت ایرانی محصولات کدکنیون ( سایت /https://codemilo.ir )
» Cicool – Page, Form, Rest API and CRUD Generator
» KingArchitect | Property Portfolio & Real Estate React Template – No JQuery
» Sheltos – Real Estate React Next Js with Redux Toolkit , React Hooks & API Routes Template
» Acres – Real Estate React Template
» Mingrand – Real Estate React Template
» ChawkBazar – Elementor Lifestyle and Fashion Ecommerce Theme
» Streamit 3.0 | Video Streaming WordPress Theme + RTL
» MagicAI – OpenAI Content, Text, Image, Chat, Code Generator as SaaS
» PHP Form Generator – Codeigniter 4 Form Master, Form Header Detail, User Management, Multi-language
» بروزترین سایت ایرانی محصولات کدکنیون ( سایت /https://codemilo.ir )
» Cicool – Page, Form, Rest API and CRUD Generator
» KingArchitect | Property Portfolio & Real Estate React Template – No JQuery
» Sheltos – Real Estate React Next Js with Redux Toolkit , React Hooks & API Routes Template
» Acres – Real Estate React Template
» Mingrand – Real Estate React Template
» ChawkBazar – Elementor Lifestyle and Fashion Ecommerce Theme
» Streamit 3.0 | Video Streaming WordPress Theme + RTL
» MagicAI – OpenAI Content, Text, Image, Chat, Code Generator as SaaS
» PHP Form Generator – Codeigniter 4 Form Master, Form Header Detail, User Management, Multi-language
حتما تابحال صفحات مربوط به پر کردن فرم در سایت ها را دیده اید . در اکثر مباحث آموزش html ، مواردی را معرفی کردیم که با آنها می توانستید اطلاعاتی را به کاربر نمایش بدهید اما فرم ها برای دریافت اطلاعات از کاربر و ذخیره این اطلاعات به کار می روند .
در یک فرم باید شخص کاربر برخی موارد را پر کرده و برخی را نیز انتخاب کند و سپس با فشار دادن یک دکمه ، اطلاعات به سرور (server) حاوی سایت ارسال خواهد شد .
شروع یک فرم را با تگ شروع <form> و پایان فرم را با تگ پایانی <form/> اعلام می کنیم . محتویات فرم در بین این دو تگ قرار خواهند گرفت .
اطلاعات دریافتی از کاربر باید توسط صفحه ای دیگر مورد پردازش قرار گیرد . درون تگ شروع <form> باید مشخصه action را برابر آدرس صفحه ای قرار بدهیم که می خواهد بر روی اطلاعات دریافت شده از کاربر پردازش انجام دهد . معمولا صفحه پردازش با استفاده از php نوشته می شود . php زبانی است که برای نوشتن صفحات اینترنتی دینامیک به کار می رود (برخلاف html که برای نوشتن صفحات اینترنتی استاتیک به کار می رود ) .
صفحه ای که اطلاعات را پردازش می کند ، می تواند اطلاعات را بر روی یک پایگاه داده ذخیره کند یا آنها را در صفحه ای از سایت نمایش بدهد یا به ایمیل ارسال کند و یا اینکه موارد دلخواه دیگری را انجام بدهد .
با استفاده از تگ <input> می توانیم شیوه های مختلفی از انواع دریافت اطلاعات از کاربر را به کار ببریم . برای این منظور باید تگ <input> را درون زوج تگ <form> و <form/> بنویسیم . درون تگ <input> باید مشخصه type را تعیین کنیم تا مشخص شود که نوع دریافت اطلاعات از کاربر به چه صورت می باشد . انواع دریافت اطلاعات از کاربر با استفاده از تگ <input> را در زیر شرح می دهیم :
فرض کنید بخواهیم یک جعبه متن را طراحی کنیم که در آن کاربر متن دلخواه خود را نوشته و سپس این متن به سرور (server) حاوی سایت ارسال شود . برای این منظور باید درون تگ <input> ، مشخصه type را برابر text قرار بدهیم . به مثال زیر توجه کنید :
1 2 3 4 5 6 7 8 9 10 11 12 |
<html> <head> </head> <body> <form method="post" action="script.php"> <input type="text"> </form> </body> </html> |
نتیجه :
نکته : کاربر ابتدا باید درون جعبه متن ، متن دلخواه خود را نوشته و سپس کلید enter را فشار بدهد تا متن نوشته شده توسط صفحه script.php مورد پردازش قرار بگیرد . البته روش بهتر این است که یک دکمه برای ارسال متن ، طراحی شود زیرا معمولا یک فرم شامل چندین بخش برای پر کردن و انتخاب می باشد و بنابراین ابتدا کاربر باید تمامی بخش ها را پر کرده و انتخاب کند و در انتها نیز دکمه ای برای ارسال اطلاعات در نظر گرفته شده باشد . بنابراین قبل از اینکه شیوه های دیگر دریافت اطلاعات برای فرم را توضیح بدهیم ، ابتدا نحوه ساخت دکمه ارسال اطلاعات (دکمه submit) را شرح خواهیم داد .
برای طراحی دکمه ارسال اطلاعات (دکمه submit) ، باید در انتهای فرم و قبل از تگ پایانی <form/> ، عبارت زیر را بنویسیم :
1 |
<input type="submit" value="submit message"> |
عبارتی که برای مشخصه value تعیین می کنیم ، بر روی دکمه ارسال اطلاعات (دکمه submit) نمایش داده می شود .
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<html> <head> </head> <body> <form method="post" action="script.php"> <input type="text"> <input type="submit" value="submit message"> </form> </body> </html> |
حتما تاکنون دکمه های رادیویی را در فرم های اینترنتی دیده اید . این دکمه ها به صورت دایره های توخالی می باشند که اگر بر روی آنها کلیک کنید به صورت توپر در می آیند . توپر شدن یک دکمه رادیویی نشان دهنده انتخاب عبارت نوشته شده برای آن دکمه رادیویی می باشد . برای ساخت دکمه های رادیویی ، باید درون تگ <input> ، مشخصه type را برابر radio قرار بدهیم . به مثال زیر توجه کنید :
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<html> <head> </head> <body> <form method="post" action="script.php"> yes<input type="radio" value="yes"><br /> no<input type="radio" value="no"> </form> </body> </html> |
مشاهده می کنید که دو گزینه yes و no به کاربر نمایش داده شده است که کاربر باید یکی از آنها را انتخاب کند .
نکته : در مثال قبل ، ممکن است کاربر به اشتباه ، ابتدا گزینه غلط را انتخاب کند و پس از متوجه شدن اشتباه بودن انتخاب خود ، گزینه صحیح را انتخاب کند ، در این زمان هر دو دکمه رادیویی به صورت توپر نمایش داده می شوند و دیگر کاربر نمی تواند گزینه غلط را به صورت توخالی در آورد . برای پیشگیری از وقوع این مشکل باید برای هر دو دکمه رادیویی یک نام را انتخاب کنیم ، یعنی اینکه برای تگ <input> ، مشخصه name را برای هر دو دکمه رادیویی به صورت یک نام واحد انتخاب کنیم . به مثال زیر توجه کنید :
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<html> <head> </head> <body> <form method="post" action="script.php"> yes<input name="yes_or_no" type="radio" value="yes"><br /> no<input name="yes_or_no" type="radio" value="no"> </form> </body> </html> |
جعبه انتخاب ، جعبه ای می باشد که در جلوی یک عبارت (گزینه) قرار می گیرد و چنانچه بخواهیم آن گزینه را انتخاب کنیم باید درون آن جعبه کلیک کنیم ، آنگاه درون جعبه یک علامت ((تیک)) نمایش داده خواهد شد . چنانچه برای بار دوم درون جعبه کلیک کنیم ، آنگاه علامت ((تیک)) برداشته می شود .
برای ساخت یک جعبه انتخاب ، باید درون تگ <input> ، مشخصه type را برابر checkbox قرار دهیم . به مثال زیر توجه کنید :
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<html> <head> </head> <body> <form method="post" action="script.php"> yes<input type="checkbox"><br> no<input type="checkbox"> </form> </body> </html> |
جعبه کلمه عبور (پسورد) در واقع یک جعبه متن است که اطلاعاتی که کاربر در آن می نویسد به صورت آرایه ای از علامت * نمایش داده می شود و برای وارد کردن اطلاعات محرمانه و کلمه های عبور (کلمه رمز) مناسب می باشد . نمایش اطلاعات با علامت * ، باعث می شود تا افرادی که در کنار کاربر هستند ، نتوانند اطلاعات وارد شده توسط وی در جعبه کلمه عبور را ببینند .
برای ساخت یک جعبه کلمه عبور باید درون تگ <input> ، مشخصه type را برابر password قرار دهیم . به مثال زیر توجه کنید :
1 2 3 4 5 6 7 8 9 10 11 12 |
<html> <head> </head> <body> <form method="post" action="script.php"> <input type="password"> </form> </body> </html> |
چنانچه در جعبه نمایش داده شده ، کلماتی را بنویسید ، به جای حروف آن کلمات ، علامت * نمایش داده می شود .