کانال بله, جهت پشتیبانی و اطلاع رسانی کانال بله, جهت پشتیبانی و اطلاع رسانی
عضویت

آموزش اعتبار سنجی فرم های جاوا اسکریپت

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

(داده های ورودی) فرم های HTML را می توان با استفاده از جاوا اسکریپت اعتبار سنجی (validate) کرد.
چنانچه یکی از فیلدهای فرم تهی بود، تابع validateForm() پیغام "First name must be filled out" را نشان داده، در پی آن مقدار false را برمی گرداند و بدین ترتیب از ارسال فرم مورد نظر جلوگیری می کند:

مثال (جاوا اسکریپت):

<script>
                        function validateForm() {
                            var x = document.forms["myForm"]["fname"].value;
                            if (x == null || x == "") {
                                alert("Name must be filled out");
                                return false;
                            }
                        }
    </script>

تابع مزبور را می توان به هنگام ارسال فرم صدا زد:

مثال (فرم HTML):

1

اعتبار سنجی فرم های HTML

مرورگر می تواند فرم های HTML را به صورت خودکار اعتبار سنجی کند:
در صورتی که یکی از فیلدهای فرم (fname) خالی باشد، خصیصه ی (attribute) required مانع از ارسال فرم به سرور می شود:

مثالی از فرم HTML:

<form action="demo_form.asp" method="post">
                    <input type="text" name="fname" required>
                    <input type="submit" value="Submit">
</form>
توجه:

قابلیت اعتبار سنجی فرم های HTML در Internet Explorer 9 و ویرایش های قدیمی تر آن پشتیبانی نمی شود.

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

Data validation فرایندی است که طی آن ورودی های کامپیوتر از نظر سالم، صحیح، مفید و کارامد بودن بررسی و اعتبار سنجی می شوند.

مواردی که اعتبار سنجی می شوند، عبارتند از:

آیا کاربر تمامی فیلدهای الزامی را پر کرده است؟
آیا کاربر تاریخ معتبر را وارد کرده است؟
آیا کاربر در یک فیلد عددی، فقط کاراکترهای عددی را وارد کرده است؟
آیا کاربر آدرس ایمیل را با فرمت صحیح وارد کرده است؟
اغلب هدف از اعتبار سنجی داده ها کسب اطمینان از وارد شدن اطلاعات و داده های صحیح به برنامه ی کامپیوتری است.
اعتبار سنجی می تواند توسط متدهای مختلف تعریف شده و به گونه های مختلف نصب و آماده ی اجرا شود.
server side validation (اعتبار سنجی سمت سرور): پس از اینکه ورودی به سرور فرستاده می شود، ورودی ها توسط رایانه ای که برنامه ی تحت وب روی آن نصب است ((web server اعتبار سنجی می گردند.
Client side validation (اعتبار سنجی سمت سرویس گیرنده): پیش از اینکه ورودی به web server ارسال گردد، توسط مرورگر وب انجام می شود (ورودی ها پیش از ارسال به web server توسط مرورگر اعتبار سنجی می گردد).
قابلیت نوین Constraint validation (اعتبار سنجی محدودیت ها) در HTML5
HTML5 یک مفهوم جدید در زمینه ی اعتبار سنجی ارائه کرد به نام constraint validation.
Constraint validation مبتنی است بر:
Constraint validation HTML Input Attributes (اعتبار سنجی محدودیت خاصیت های input، html)
Constraint validation CSS Pseudo Selectors (اعتبار سنجی محدودیت انتخاب گرهای CSS Pseudo)
Constraint validation DOM Properties and Methods (اعتبار سنجی محدودیت خواص و متدهای DOM)
اعتبار سنجی محدودیت خاصیت های input، HTML

شرح
خصیصه (attribute)
به وسیله ی این خصیصه می توان المان ورودی (input element) را غیر فعال کنید.(در صورتی که مقدار اين خصیصه روی disabled تنظيم شده باشد، آن کنترل غير فعال بوده و کاربر دیگر اجازه ی استفاده از آن را نخواهد داشت ).
disabled
بیشترین مقداری که یک المان ورودی می تواند دریافت کند را تعیین می کند. مقدار maximum برای تگ <lt;input& را مشخص می کند (ویژه ی number و date).
max
بیشترین مقداری که یک المان ورودی (کنترل) می تواند بگیرد را تعریف می کند. مقدار minimum برای المان lt;input>& را مشخص می کند (ویژه ی number و date).
min
الگویی برای اعتبار سنجی یک فیلد ورودی مشخص می کند.
pattern
مشخص می کند که پر کردن فیلد input قبل از ارسال فرم باید انجام شود. مشخص می کند که فیلد ورودی باید حتما قبل از اینکه فرم ارسال گردد، پر شود.
required
اين خصیصه نوع کنترل را تعيين می کند.
type

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

عنوان جدول
شرح
Selector (انتخاب گر)
المان های ورودی (کنترل) که خصیصه ی " disabled " برای آن ها تعریف شده باشد را گزینش می کند.
:disabled
المان های ورودی (کنترل هایی که ورودی دریافت می کنند) که دارای مقادیر نامعتبر یا غیر مجاز هستند را انتخاب می کند.
:invalid
کنترل هایی را که پر کردن آن پیش از ارسال فرم ضروری نیست را گزینش می کند.
المان های ورودی که خصیصه ی "required" برای آن ها تعریف نشده است را انتخاب می کند.
:optional
المان های ورودی که خصیصه ی "required" برای آن ها تعریف شده باشد را گزینش می کند. در واقع المان هایی ورودی که باید پیش از ارسال فرم پر شده باشند را انتخاب می کند.
:required
المان های ورودی که مقادیر معتبر دریافت کرده اند را گزینش می کند.
:valid

کلیه حقوق مادی و معنوی این مقاله متعلق به آموزشگاه تحلیل داده بوده و هر گونه استفاده غیر قانونی از آن پیگرد قانونی دارد.

1394/07/27 8544 2081
رمز عبور : tahlildadeh.com یا www.tahlildadeh.com
نظرات شما

نظرات خود را ثبت کنید...