اعتبار سنجی
اعتبارسنجی یکی از رابط های مهم در ورود اطلاعات در فرم ها است، این اعتبار سنجی سمت کلاینت و یا سمت سرور ممکن است اتفاق بیافتد.
مرورگر، خود بطور پیش فرض از این اعتبار سنجی پشتیبانی میکند، ولیکن، نمایش آن توسط ما به سادگی انجام پذیر نیست.
چگونه کار میکند؟
برای نسبت دادن اعتبار سنجی، ما از دو کلاس pseudo میتوانیم استفاده کنیم، کلاس :invalid برای نمایش خطا و کلاس :valid برای نمایش فیلدهای معتبر.
این دو کلاس، فقط برای input، textarea و select وجود دارد، پس نمیتوانید برای موضوعات دیگر استفاده کنید. مگر آنکه در طراحی کنترل خود، جنس اصلی یکی از انواع گفته شده باشد.
همچنین دو کلاس بالا فقط توسط مرورگر صدا زده شده و شما نمیتوانید از سمت سرور، آنها را فراخوانی کنید، مگر با جاوا اسکریپت و نوشتن کدهای طولانی. راهی ساده تر در اختیار شما قرار میدهیم. برای آنکه هم مشکل دیگر کنترل ها برطرف شود و هم بتوانید از سمت سرور مشخص کنید، کدام ورودی باید بررسی شود، علاوه بر آن دو کلاس، ما کلاسهای .invalid و .valid را اضافه کردیم. در هر جا این کلاسها صدا زده شوند، نمایش آن به صورت گفته شده خواهد بود. دقت کنید فقط نمایش، عمل اعتبار سنجی توسط برنامه نویس از سمت سرور یا کلاینت کنترل گردیده و میگردد.
اعتبار سنجی مرورگر
در این مثال، کنترل به دست مرورگر است و نمایش کادرها و پیامها توسط مرورگر کنترل میگردد
LTR
RTL
اعتبار سنجی مرورگر با کلاس validated
در این مثال، کنترل به دست مرورگر است و نمایش کادرها و پیامها توسط کلاس validated طراحی شده کنترل میگردد. ورودی ها یا با کادر وضعیت valid هستند یا invalid.
LTR
RTL
اگر علاقه ندارید فیلدهای valid نمایش داده شود از کلاس .hide-valid و برای عدم نمایش کلاس های invalid از کلاس .hide-invalid استفاده کنید.
LTR
RTL
اعتبار سنجی توسط ویجت نس
اگر علاقه ندارید در ابتدا تمام ورودی ها بررسی شوند و میخواهید کنترل اعتبار سنجی به دست ویجت نس باشد، بایستی اعتبار سنجی را با اضافه کردن خصوصیت novalidated به فرم ساقط کرده و سپس خصوصیت wn-validated را به فرم اضافه کنید.
LTR
RTL
نمایش پیام خطا شخصی
برای نمایش پیام مورد نظر، میتوانید بعد از معرفی ورودی، در یک موضوعی که از کلاس valid-feedback یا invalid-feedback استفاده شده است، برای نمایش پیامهای درست و اشتباه متن یا کد مورد نظر را درج کنید، در حالت پیش فرض این دو کلاس به صورت display: none است و با توجه به موقعیت، آنها به display:block تغییر وضعیت خواهند داد.
LTR
RTL
شما میتوانید با گسترش کلاسهای نمایشی برای feedback انواع مختلفی از نمایش را داشته باشید برای مثال ما نوع tooltip را گسترش دادیم و مابقی میتواند بر عهده خود شما باشد.
اگر میخواهید نمایش پیام مورد نظر به صورت tooltip باشد، میتوانید بعد از معرفی valid-feedback و invalid-feedback از کلاس tooltip استفاده کنید.
LTR
RTL
بررسی خاص
در مواقعی نیاز است، ورودی بر اساس مقادیر خاص مورد سنجش قرار گیرد، مثلا مقدار وارد شده با سرور ارتباط برقرار کرده و صحت سنجی سمت کلاینت مشخص شود. برای ایجاد چنین امکانی یک event طراحی کردیم به نام onvalidation در این event شما میتوانید صحت ورودی را بررسی کنید و نتیجه را اعلام کنید.
LTR
RTL
بررسی توسط جاوا اسکریپت
به طور پیش فرض، زمانیکه قرار است فرم submit شود، عمل بررسی فرم و جلوگیری از submit شدن، انجام میپذیرد.
ولیکن ممکن است شما نخواهید در زمان submit فرم عمل بررسی را انجام دهید.
برای مثال میخواهید اطلاعات فرم را به صورت AJAX ارسال کنید و نیاز دارید قبل از ارسال، این بررسی انجام پذیرد. بدین منظور، کافیست قبل از
ارسال اطلاعات از تابع
LTR
RTL
Clear
اگر تمایل دارید نتیجه اعتبار سنجی قبلی مخفی گردد، از این تابع استفاده کنید.
WN('formName'].Clear();