اعتبارسنجی فرم در ASP.NET Core – جلسه ۳۸

در این جلسه از آموزش ASP.NET Core / 5.0 به مبحث اعتبار سنجی فرم در ASP.NET Core و یا همان (Form Validation) خواهیم پرداخت. همچنین دو خصوصیت StringLength و Required و هلپر ValidationMessageFor را بررسی مینماییم. جهت اعتبار سنجی یک فرم، میبایست تغییراتی در Controller، Model و نما، بسته به روش ایجاد آن اعمال نماییم.

خصوصیت StringLength و Required

قبل از اعمال Form Validation، ما میبایست برای فیلدهای مورد نظر خود شرایطی تعیین نماییم تا اعتبار سنجی بر اساس شرایط تعریف شده صورت بگیرد. یکی از شرایط میتواند الزامی بودن یک فیلد باشد. الزامی بودن به این معنا میباشد که فرم مورد نظر تنها در حالتی سابمیت میشود که فیلد الزامی حتما دارای مقدار باشد. برای اعمال این شرط، میبایست در Model و یا ViewModel خود در قسمت فوقانی فیلد مورد نظر، از خصوصیت Required استفاده نماییم.

همچنین، ما میتوانیم برای فیلدهای نوع رشته‌ایی یک میزان حداکثر و حداقل تعریف نماییم. با این عمل کاربر در فیلد مورد نظر میبایست عبارتی با طول مناسب وارد نماید. در غیر این صورت وضعیت اعتبارسنجی فرم محیا نمیباشد و میتوان از سابمیت داده‌ها جلوگیری نمود. برای اعمال این محدودیت میتوانیم از خصوصیت StringLength استفاده نماییم.

توجه اشته باشید برای استفاده از این خصوصیت‌ها میبایست فضای نام System.ComponentModel.DataAnnotations به کلاس مدل اضافه گردد.

    public class CreateCostViewModel
    {
        public decimal Amount { get; set; }
        public DateTime Date { get; set; }
        [Required(ErrorMessage ="Comment is mandatory")]
        [StringLength(50,MinimumLength =5)]
        public string Comment { get; set; }
        public string Category { get; set; }
        public List<SelectListItem> Categories { get; set; }
        public List<string> SelectedCategories { get; set; }
        public int PaymentMethod { set; get; }
        public List<PaymentMethod> PaymentMethods { get; set; }
        public bool MakeFormClear { get; set; }
    }

همانگونه که در قطعه کد فوق مشاهده مینمایید، فیلد Comment یک فیلد الزامی میباشد که طول آن میبایست حداقل 5 کاراکتر و حداکثر 50 کاراکتر باشد. همچنین برای شخصی سازی پیغام خطای اعتبارسنجی میتوانیم از ErrorMessage استفاده نماییم.

اعتبارسنجی فرم در ASP.NET Core

پس از اعمال شروط لازم اعتبارسنجی بروی Model و یا ViewModel مربوطه میبایست تغییراتی در Controller مورد نظر اعمال نماییم. توجه داشته باشید برای اعتبارسنجی هر اکشن‌متد، به جز قسمت HttpGet میبایست حاوی یک قسمت برای پردازش اطلاعات باشد که میتواند HttpPost باشد.

سپس در قسمت HttpPost(میتواند افعال دیگری مانند HttpPut و HttpPatchنیز باشد) با بررسی ModelState.IsValid میتوان به معتبر بودن و یا نبودن فرم و داده‌های ارسالی پی برد. این متد در صورت معتبر بودن فرم، مقدار True و در صورت نامعتبر بودن فرم، مقدار False را برمیگرداند.

        [HttpPost]
        public IActionResult Edit(Cost Model)
        {
            if (ModelState.IsValid)
            {
                //Post Process
            }
            return View(Model);
        }

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

نمایش خطای اعتبارسنجی با هلپر ValidationMessageFor

در صورتی که نما با استفاده از EditorForModel ساخته شده باشد، پیغام‌های خطای اعتبارسنجی در نما بدون اضافه نمودن هیچ کدی ظاهر میگردد. ولی اگر فرم با استفاده از Html Helperهای دیگری مانند TextBoxFor، DropDownListFor و … ایجاد شده باشد میبایست برای نمایش خطاهای اعتبارسنجی از هلپر ValidationMessageFor استفاده نماییم.

این Html Helper هم مانند هلپرهای دیگر برای اتصال به مدل از Lambda Expression استفاده مینماید. همچنین با استفاده از Html Attribute میتوان ظاهر آن را به شکل دلخواه تغییر داد.

            @Html.LabelFor(m => m.Comment, new { @class = "form-lable" })
            @Html.TextAreaFor(m => m.Comment, new { @class = "form-control" })
            @Html.ValidationMessageFor(m=> m.Comment,"",new {style="color:red" })

همانگونه که در قطعه کد فوق مشاهده میکنید، هلپر ValidationMesageFor توسط عبارت لامبدا به فیلد Comment متصل شده است. همچنین با استفاده از Html Attribute و Style به متن خطا رنگ قرمز نسبت داده‌ایم.

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

تماشای ویدیو در یوتیوب ما

دانلود اسلایدهای آموزشی این جلسه از اینجا