Input از نوع text
عنصر <input type="text"> یک فیلد تک خطی ورودی را تعریف میکند :
<form >
<First name: <br
<input type = "text " name = "firstname " > <br >
<Last name: <br
<"input type = "text " name = "lastname >
<form / >
از این فیلد برای ورود داده های متنی همچون نام و نام خانوادگی استفاده میشود.
Input از نوع Password
عنصر <input type="password"> یک فیلد ورودی گذر واژه را تعریف میکند.
کارکتر هایی که در فیلد گذر واژه تایپ میشوند دارای پوشش هستند یعنی به صورت بولت نشان داده میشوند :
<form >
< User name: <br
<input type = "text " name = "username " > <br >
< User password: <br
<"input type = "password " name = "psw >
<form/ >
Input از نوع Submit
عنصر <input type="submit"> یک دکمه را برای سابمیت کردن داده های فرم به یک اکشن (معمولا صفحه ای در سرور) تعریف میکند.
اکشن معمولا اسکریپتی در صفحه ای از سرور است که داده های ارسالی را مدیریت میکند.
نام اکشن در صفت action از فرم قرار میگیرد :
<" form action = "/action_page.php >
< First name: <br
<input type = "text " name = "firstname " value = "Mickey " > <br >
< Last name: <br
<input type = "text " name = "lastname " value = "Mouse " > <br > <br >
<" input type = "submit " value = "Submit >
<form / >
در تصویر زیر خروجی کد بالا را مشاهده میکنید :
بعد پر کردن فیلد های نام و نام خانوادگی، با کلیک روی دکمه ی submit داده های وارد شده در فیلد ها به صفحه ای به نام "action_page.php" ارسال میشود. داده ها توسط این صفحه پردازش شده (ممکن است در پایگاه داده ثبت شوند) و نتیجه به سمت کاربر ارسال میشود.
اگر مقدار صفت value را برای دکمه ی submit مشخص نکنید از مقدار پیشفرض برای آن استفاده میشود :
<" form action = "/action_page.php >
< First name: <br
<input type = "text " name = "firstname " value = "Mickey " > <br >
< Last name: <br
<input type = "text " name = "lastname " value = "Mouse " > <br > <br >
<" input type = "submit >
<form/ >
خروجی کد بالا به شکل زیر است :
Input از نوع Reset
عنصر <input type="reset"> یک دکمه ی reset را تعریف کرده که تمام مقادیر فرم را به مقادیر پیشفرض آنها بر میگرداند :
<" form action = "/action_page.php >
< First name: <br
<input type = "text " name = "firstname " value = "Mickey " > <br >
< Last name: <br
<input type = "text " name = "lastname " value = "Mouse " > <br > <br >
<" input type = "submit " value = "Submit >
<" input type = "reset >
<form/ >
در مثال بالا برای ورودی های firstname و lastname مقادیر پیشفرضی در نظر گرفته شده است. اگر این مقادیر را تغییر داده و روی دکمه ی reset کلیک کنیم، ورودی ها به مقادیر پیشفرض برخواهند گشت.
منبع:learnsource