آموزش DataBase First در MVC – افزودن

در پست های قبل به روش DataBase First دیتابیسی ایجاد کردیم و برای آن مدل ساختیم همچنین جدولی به اسم Users ایجاد کردیم و لیست User ها را نمایش دادیم. لیست ما باید قابلیتی داشته باشد تا بتوانیم کاربران جدید را نیز به آن اضافه کنیم از این رو در این پست نحوه ایجاد صفحه افزودن – Create را آموزش میدهیم.

ایجاد اکشن برای افزودن فیلد جدید

اولین کاری که باید انجام دهیم این است که به کنترلر خود اکشنی به نام Crate یا هر نامی که میخواهید اضافه کنیم اما نه یکی بلکه دو تا یکی از نوع HttpGet که تمام اکشن ها به صورت پیش فرض از نوع Get هستند و یکی از نوع HttpPost.

اکشن Crate از نوع HttpGet به ما صفحه و فرم ایجاد کاربر جدید را نمایش میدهد و اکشن Crate از نوع HttpPost محتویات فرم ما را ذخیره میکند و دلیل این که از نوع HttpPost است این است که فرمی که محتویات ما ارسال میکند به صورت پیش فرض از متد Post استفاده میکند.

در ادامه به عنوان ورودی یک متغییر از جنس مدلی که ایجاد کردیم به اکشن خود میدهیم و ورودی را در متد دریافت و در دیتابیس اضافه و تغییرات را ذحیره میکنیم.

[HttpGet]
public ActionResult Create() {
    return View();
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(T_Users user)
{
    db.T_Users.Add(user);
    db.SaveChanges();
    return RedirectToAction("Index", "Users");
}

ایجاد View برای اکشن

• ویو Template حتما باید از نوع Create باشد.
• مدل خود را برای ویو در بخش Model class مشخص کنید.
• چون داده ها را از دیتابیس دریافت میکنید حتما Context خود را در Data context class مشخص کنید.
• چون قرار است داده از کاربر دریافت کنیم حتما تیک Refrence script libraries را بزنید تا عملیات Validation سمت کاربر به درستی انجام شود. در برخی موارد ممکن است نسخه Jquery اضافه شده به Layot Page و خود صفحه Crate اشتباه باشد از درست بودن لینک آن اطمینان حاصل کنید.

Add-Create-Layout-AspNetMVC

کار تمام است شما میتوانید اطلاعات خود را ذخیره کنید، اما برای افزایش امنیت و کارایی و همچنین اعتبار سنجی Validation در سمت کاربر مراحل زیر را نیز به پروژه خود اضافه کنید.

افزودن فیلد از طریق کدنویسی

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

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(T_Users user)
{
    user.IsActive = true;
    user.RegisterDate = DateTime.Now;
    db.T_Users.Add(user);
    db.SaveChanges();
    return RedirectToAction("Index");
}

افزودن Data Annotations های کاربردی

در این مرحله باید Data Annotations های مورد نیاز خود را جهت اعتبار سنجی به مدل خود اضافه کنیم. جهت مشاهده لیست کلیه Data Annotations ها اینجا کلیک کنید.

توجه داشته باشید که زمان Copy و Paste کردن فرمت عبارت {۰} بهم میریزد و موجب ارور میشود به صورت دستی آن را اصلاح فرمایید.

• Data Annotation برای تلفن همراه

[Display(Name = "تلفن همراه")]
[RegularExpression("09(1[0-9]|3[1-9]|2[1-9])-?[0-9]{3}-?[0-9]{4}", ErrorMessage = "قالب {۰} اشتباه است")]

• Data Annotation برای تلفن ثابت

[Display(Name = "تلفن همراه")]
[RegularExpression("^0[0-9]{2,}[0-9]{7,}$", ErrorMessage = "قالب {۰} اشتباه است")]

• Data Annotation برای تلفن ایمیل

[Display(Name = "ایمیل")]
[Required(ErrorMessage = "فیلد {۰} خالی است")]
[EmailAddress(ErrorMessage = "قالب {۰} اشتباه است")]

• Data Annotation برای حداقل و حداکثر کاراکتر های رمز عبور

[Display(Name = "رمز عبور")]
[Required(ErrorMessage = "فیلد {۰} خالی است")]
[StringLength(12,MinimumLength =3,ErrorMessage ="تعداد کاراکتر ها نباید کمتر از ۳ و بیشتر از ۱۲ باشد")]
[DataType(DataType.Password)]

• Data Annotation برای تبدیل TextBox به TextArea

[DataType (DataType.MultilineText)]

افزایش امنیت با دستور Bind

برای جلوگیری از حملات SQL injection با استفاده از دستور bind include و شرط modelstate.isvalid باید برسی کنیم که در اکشن خود منتظر دریافت چه ورودی هایی هستیم تا از نفوذ جلوگیری کنیم مانند کد زیر. دستور Bind توسط اتربیوت خود یعنی include پارامتر هایی که منتظر آن ها هستیم را دریافت میکند و توسط شرط modelstate.isvalid آن را برسی میکنیم.

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

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create([Bind(Include = "Name,Family,Password,MobileNumber,Maritel,Email,Address")] T_Users user)
{
    if (ModelState.IsValid) {
        user.RegisterDate = DateTime.Now;
        user.IsActive = true;
        db.T_Users.Add(user);
        db.SaveChanges();
        return RedirectToAction("Index");
    }
    return View();
}

آپلود فایل و یا تصویر در فرم

در خیلی موارد نیاز داریم کاربر فایلی را برای ما آپلود کند. مثلا در این مثال کاربر برای ما تصویر خود را آپلود کند، پس باید به صورت زیر اقدام کنیم.

• گام اول : Html Helper مخصوص آپلود را باید تغییر دهید به جای EditorFor از تگ Input با تایپ File استفاده میکنیم. توجه داشته باشید باید حتما دارای اتربیوت Name باشد، چون در اکشن خود توسط همین اتربیوت فایل را دریافت میکنیم.

<input type="file" name="ImgUpload" />

• گام دوم : از آنجایی که Html Helper فرم به صورت پیشفرض خاصیت enctype را ندارد باید به فرم خود این خاصیت را اضافه کنیم. ورودی های این هلپر شامل ورودی ۱ : نام اکشن مقصد، ورودی ۲ : نام کنترلر مقصد، ورودی ۳ : متد ارسال، ورودی ۴ : اتربیوت های لازم

@using (Html.BeginForm("Create", "User", FormMethod.Post, new {enctype="multipart/form-data"}))

• گام سوم : دریافت فایل ارسال شده توسط اکشن، نوع متغییر ورودی اکشن باید از نوع HttpPostedFileBase باشد. همچنین نام آن هم نام تگ Input ای که با تایپ File ایجاد کردیم.

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create([Bind(Include = "Name,Family,Password,MobileNumber,Maritel,Email,Address")] T_Users user, HttpPostedFileBase ImgUpload)
{
    my code
}

• گام چهارم : با استفاده از کلاس TIT_File تصویر و یا فایل خود را آپلود کنید در صورتی که با کلاس TIT_File آشنایی ندارید اینجا کلیک کنید.

if(ImgUpload != null)
{
    TIT_File up = new TIT_File();
    string[] format = { "jpg", "png" };
    bool UploadStatus = up.Upload(ImgUpload, 2, format, "images/user");
    if(UploadStatus) {
        user.ImageName = up.Address;
    }
    else
    {
        ModelState.AddModelError("ImageName", up.Message);
        return View();
    }
}
else
{
    user.ImageName = null;
}

در صورتی که بنا به هر دلیلی فایل شما با موفقیت آپلود نشود میتوانید توسط دستور زیر به کاربر متن خطا را نمایش دهید. این دستور در کد های بالا استفاده شده و خطا را در هلپر ValidationMessageFor نمایش میدهد.

ModelState.AddModelError("Validate Name", "Message");