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

اعتبار سنجی هیبت های اینترنت HTML اعتقاد و طراحی اپلیکیشن در مشهد باور میدهد که یوزرها اطلاعات را به صحت و در فرمت صحیح وارد کرده اند. امروزه اعتبار سنجی هیبت های اینترنت عوض شده اند.

اعتبارسنجی هیبت های اینترنت HTML این اعتقاد را به شما میدهد که یوزرها داده های خویش را به صدق و در فرمت صحیح وارد کرده اند. در پیشین، اعتبارسنجی ورودی هیبت های اینترنت مستلزم افزونه های Javascript بود، البته امروزه بیشتر مرورگرها راهکار هایی ارائه داده اند که میتواند از عهده بیشتر اعتبارسنجی ها برآیند.

درین قسمت، ما به شما نماد خوا هیم بخشید که چطور فقط با استعمال از مشخصه های ورودی HTML ساکن، ضوابط اعتبارسنجی را به هیبت های اینترنت خویش اضافه نمایید.

نمای کلی پروژه

برای نشانه دادن مراحل ساخت ضوابط اعتبار سنجی، ما با استعمال از بوت استرپ 4 (Bootstrap 4)، یک هیبت نام نویسی HTML معمولی فراهم کرده ایم.

Layout (ساختار و تنظیمات تارنما)

HTML

طرح ما مشمول یک هیبت بوت استرپ با یک سری مسئله ورودی و یک دکمه submit میشود. برای این نمونه ما از 3 نوع موضوع ورودی متعدد استعمال کرده ایم. این قضیه ها مشمول یک ورودی متن، یک ورودی پسورد و یک ورودی نشانی اینترنتی میگردد.

Create your account

"Useame"

"Password"

"Email"

Create Account

CSS

ما همینطور چندین استایل ابتدایی CSS وارد کرده ایم تا هیبت های اینترنت را به دیده بیننده خوشایندتر کنیم.

html {
background-color:#214c84;
background-blend-mode:overlay;
display:flex;
align-items:center;
justify-content:center;
background-image:url(../../assets/img/image4.jpg);
background-repeat:no-repeat;
background-size:cover;
height:100%;
}

body {
background-color:transparent;
}

.registration-form {
padding:50px 0;
}

.registration-form form {
max-width:800px;
padding:50px 70px;
border-radius:10px;
box-shadow:4px 4px 15px rgba(0, 0, 0, 0.2);
background-color:#fff;
}

.registration-form form h3 {
font-weight:bold;
margin-bottom:30px;
}

.registration-form .item {
border-radius:10px;
margin-bottom:25px;
padding:10px 20px;
}

.registration-form .create-account {
border-radius:30px;
padding:10px 20px;
font-size:18px;
font-weight:bold;
background-color:#3f93ff;
border:none;
color:white;
margin-top:20px;
}

@media (max-width: 576px) {
.registration-form form {
padding:50px 20px;
}
}
گونه های اعتبارسنجی
HTML5 با به کار گیری از مشخصه های ورودی، یک رویکرد عالی و آسوده برای اعتبار خطی ارائه میدهد. مشخصه های متعددی جان دار میباشد، ولی ما صرفا تنی چند از دارای شهرت ترین آنها‌را رسیدگی میکنیم.

Required (ضروری)

این مشخصه این را مشخص و معلوم می نماید که قضیه ورودی نمی تواند خالی باشد و مستلزم این میباشد که استفاده کننده پیش از ارائه هیبت، چیزی را وارد نماید.

"Email"

حداکثر و دستکم ارتفاع

این آیتم حداکثر و دست کم تعداد سمبل هایی که استفاده کننده می‌تواند در موضوع ورودی وارد نماید را معلوم می نماید. این خصوصیت به خصوص در مسئله های پسورد موثر میباشد که پسورد زمان بر خیس در معنای پسورد ایمن خیس میباشد.

"Password"

سر مشق (patte)

سرمشق یک اصطلاح خاص را معین می نماید که برای عبور داده های وارداتی، بایستی تطبیق پیدا نمایند. با به کار گیری از اشکال ورودی که درپی نقل شده میباشد، می قدرت از سر مشق بهره برد: متن، کاوش، url، نشانی اینترنتی و پسورد.

"Useame"

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

فارغ از اینکه نیاز باشد یک خط کد بنویسید، استودیو بوت استرپ یک شیوه سریع و سهل و آسان برای اعتبارسنجی هیبت های اینترنت شما ارائه میدهد. این نرم‌افزار در اختیار گرفتن های غیرقابل جابجایی دارااست که به شما اذن می‌دهد سریعا مجموع قانون ها اعتبارسنجی که شاید به آن نیاز داشته باشید را نصب فرمائید.

 فولدر های ضمیمه