تگ input در form
یکی از مهمترین تگهای فرم تگ input میباشد این تگ انواع مختلفی دارد که با شناسه type نو آن مشخص میشود در مثال زیر نحوه استفاده از آن را در قالب مثال نشان داده ایم
<form action="user/ action_page.php " method="get">
<input type="button" />
<input type="checkbox" />
<input type="hidden" />
<input type="password" />
<input type="submit" />
<input type="text" />
</form>
در این مثال فیلد متنی (text)، فیلد کلمه عبور (password)، دکمه معمولی (button)، دکمه ارسال (submit) و ... را ایجاد کرده ایم.
Input Type Text
برای گرفتن اطلاعات متنی از کاربر از این تگ استفاده میشود.اگر از شناسه type در این تگ استفاده نشود به طور پیش فرض نوع text برای آن در نظر گرفته میشود.
<form action="/action_page.php">
First name:
<input type="text" name="firstname">
Last name:
<input type="text" name="lastname">
<input type="submit">
</form>
خروجی کد بالا به صورت زیر خواهد بود:
Input Type Password
برای گرفتن پسورد از کاربر استفاده میشود. با نوشتن داخل باکسی که نوع پسورد است کاراکترهای وارد شده به صورت دایره ای یا ستاره دیده میشوند ظاهر میشوند.
<form action="">
User name:
<input type="text" name="userid">
User password:
<input type="password" name="psw">
</form>
خروجی کد بالا به صورت زیر خواهد بود:
Input Type Submit
نوع submit برای ایجاد دکمه ارسال اطلاعات فرم کاربرد دارد.
مثال:
<form>
نام:
<input type="text" name="firstname" value="فاطمه">
نام خانوادگی:
<input type="text" name="lastname" value="مختاری">
<input type="submit" value="ارسال">
</form>
شناسه value :در مورد کادرهای متنی، متنی را که به صورت پیش فرض در کادر متنی نمایش داده می شود معین می کند. در input از توع submit مقدار value یا متن پیش فرض آن کلمه submit میباشد.
خروجی مثال بالا:
با کلیک بر روی دکمه ارسال اطلاعات شما ارسال خواهد شد.
Input Type Reset
این input دکمه ای ایجاد میکند که با کلیک بر روی آن اطلاعات فیلدها به حالت پیش فرض برمی گردد.
<form>
First name:
<input type="text" name="firstname" value="فاطمه">
Last name:
<input type="text" name="lastname" value="مختاری">
<input type="submit" value="Submit">
<input type="reset">
</form>
خروجی:
در این مثال اگر مقادیر فیلدها را تغیر دهید با کلیک بروی دکمه reset اطلاعات به حالت اول برمیگردد.
Input Type Radio
برای ساختن دکمه های رادیویی از تگ input و نوع radio استفاده میشود.این نوع دکمه ها را حتما در فرم های نظر سنجی که کاربر فقط یک گزینه را از بین گزینه های موجود میتواند انتخاب کند را دیده اید. برای ایجاد این دکمه ها به صورت زیر عمل میکنیم.
<form>
<input type="radio" name="gender" value="male" checked> Male
<input type="radio" name="gender" value="female"> Female
<input type="submit">
</form>
خروجی:
شناسه checked باعث می شود تا در هنگام باز شدن صفحه موردنظر به صورت انتخاب شده نمایش داده شود .
Input Type Checkbox
با استفاده از این تگ به کاربر اجازه میدهیم که از بین گزینه ها بیش از یک مورد را انتخاب کند.
<form>
<input type="checkbox" name="vehicle1" value="Bike"> I have a bike
<input type="checkbox" name="vehicle2" value="Car"> I have a car
</form>
خروجی:
Input Type Button
برای ایجاد دکمه ها به کار میرود.
<input type="button" onclick="alert('Hello World!')" value="Click Me!">
خروجی:
در این مقاله با تعدادی از مهمترین تگ هایی که در ساخت فرم بکار میروند آشنا شدیم در مقاله های بعد ادامه تگها را معرفی خواهیم کرد
کامنت جدید ...