فرم‌ها

از ویکی‌کد
پرش به ناوبری پرش به جستجو
Main Page Tutorial
JavaScript-menu.png
موارد آموزشی
فرم‌ها در جاوا اسکریپت
۱فرم‌ها
۲ارزشیابی
اشیاء در جاوا اسکریپت
تابع در جاوا اسکریپت
HTML DOM در جاوا اسکریپت
Browser BOM در جاوا اسکریپت
AJAX در جاوا اسکریپت
JSON در جاوا اسکریپت
جی‌کوئری در برابر جاوا اسکریپت
مثال‌های جاوا اسکریپت
مرجع جاوا اسکریپت

اعتبار سنجی فرم‌ها در جاوا اسکریپت

اعتبار سنجی فرم‌های HTML را می‌توان با جاوا اسکریپت انجام داد.[۱]

اگر یک فیلد فرم (fname) خالی باشد، این تابع یک پیغام را به صورت هشدار نمایش می‌دهد و مقدار false را برای جلوگیری از ثبت فرم، برمی‌گرداند:

مثال JavaScript

1 function validateForm() {
2   var x = document.forms["myForm"]["fname"].value;
3   if (x == "") {
4     alert("Name must be filled out");
5     return false;
6   }
7 }

تابع می‌تواند زمانی فراخوانی شود که فرم ثبت شده باشد:

مثال فرم HTML

1 <form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post">
2 Name: <input type="text" name="fname">
3 <input type="submit" value="Submit">
4 </form>


مشاهدهٔ نتیجه


جاوا اسکریپت می‌تواند داده های عددی ورودی را اعتبار سنجی کند

جاوا اسکریپت اغلب برای اعتبار سنجی ورودی‌های عددی استفاده می‌شود:

لطفاً عددی بین ۱ و ۱۰ وارد کنید:

مشاهدهٔ نتیجه


اعتبار سنجی خودکار فرم های HTML

اعتبار سنجی فرم‌های HTML می‌تواند به صورت خودکارتوسط مرورگر صورت بپذیرد:

اگر یک فیلد فرم (fname) خالی باشد، ویژگی required از ثبت این فرم جلوگیری می‌کند:

مثال فرم HTML

1 <form action="/action_page.php" method="post">
2   <input type="text" name="fname" required>
3   <input type="submit" value="Submit">
4 </form>


مشاهدهٔ نتیجه


اعتبار سنجی خودکار فرم‌های HTML در مرورگر اینترنت اکسپلورر نسخه ۹ یا نسخه‌های جدیدتر پشتیبانی نمی‌شود.

اعتبار سنجی داده ها

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

اعتبار سنجی‌های معمول عبارتند از:

  • آیا کاربر تمامی فیلدهای اجباری را پر کرده‌است؟
  • آیا کاربر تاریخ و زمان معتبری را وارد کرده‌است؟
  • آیا کاربر در فیلد عددی، مقدار متنی وارد کرده‌است؟

بیشتر موارد، هدف اعتبار سنجی داده‌ها، اطمینان از صحیح بودن داده‌های ورودی کاربر است.

اعتبار سنجی را می‌توان با استفاده از متدهای متفاوتی انجام داد و می‌توان در راه‌های گوناگونی ازآن استفاده کرد.

اعتبار سنجی سمت سرور بعد از ارسال داده به سمت سرور، توسط وب سرور اجرا می‌گردد.

اعتبار سنجی سمت کاربر (به انگلیسی: Client) توسط مرورگر وب و قبل از ارسال داده به وب سرور صورت می‌گیرد.

نوع Constraint یا اعتبار سنجی محدودیتی در HTML

در HTML5 نوع جدیدی از مفهوم اعتبار سنجی در HTML به نام اعتبارسنجی محدودیتی (به انگلیسی: constraint) ارائه شد.

نوع اعتبار سنجی constraint بر اساس موارد زیر است:

  • اعتبار سنجی محدودیتی برای ویژگی‌های ورود داده در HTML
  • اعتبار سنجی محدودیتی انتخابگرها در CSS
  • اعتبار سنجی محدودیتی ویژگی ها و متدهای DOM

اعتبار سنجی محدودیتی در ویژگی های ورود داده در HTML

ویژگی (به انگلیسی: attribute) توضیحات
disabled مشخص می‌کند که آن کنترل HTML می‌بایست غیرفعال باشد
Max طول بیشترین مقداری که آن کنترل ورودی در HTML می‌تواند داشته باشد را تعیین می‌کند
min حداقل طول مقداری که آن کنترل ورودی در HTML می‌تواند داشته باشد را تعیین می‌کند
pattern الگوی داده ورودی برای آن کنترل را تعیین می‌کند
required کنترل مورد نظر را به یک کنترل اجباری تبدیل می‌کند
type نوع یک عنصر ورودی را تعیین می‌کند
برای مشاهده لیست کامل این ویژگی‌ها، مقاله ما تحت عنوان ویژگی‌های ورودی در HTML را مطالعه بفرمایید.

اعتبار سنجی های محدودیتی برای انتخابگرهای CSS

انتخابگر توضیحات
:disabled تمام عناصر ورودی را که ویژگی disabled آنها، مشخص شده‌است را انتخاب می‌کند
:invalid عناصری ورودی را که مقدار نامعتبر را انتخاب می‌کند
:optional عناصر ورودی غیر اجباری را انتخاب می‌کند
:required عناصر ورودی را که ویژگی required آنها مشخص شده‌است را انتخاب می‌کند
:valid عناصر ورودی را که مقادیر معتبر دارند را انتخاب می‌کنند
برای مشاهده لیست کامل این ویژگی‌ها، مقاله ما تحت عنوان انتخابگرهای CSS را مطالعه نمائید.


منابع آموزشی